版本
JSAPI 2.0 Betahttps://lbs.amap.com/home/news/jsapi2-beta
JavaScript API V1.4.15 https://lbs.amap.com/api/javascript-api/changelog
參考手冊
https://lbs.amap.com/api/jsapi-v2/documentation
基本概念
地圖容器 Container
layer
提供各種layer, 不同的layer根據(jù)zindex 疊加
比如行政區(qū)劃:word china province city 商區(qū)
官方圖層https://lbs.amap.com/api/javascript-api/guide/layers/official-layers
行政區(qū)圖層https://lbs.amap.com/api/javascript-api/guide/layers/districtlayer
其他
矢量圖形 Vector Overlays
點標(biāo)記 Markers
點趣效、圖形等
new Markers
如果marker都一樣睁枕, 可以考慮服用雀摘, 不用每個點都new markers 否則可能會很消耗性能始衅, 無法表達(dá)海量數(shù)據(jù)
比如圓點標(biāo)記 (CircleMarker) 摊唇、文本標(biāo)記 (Text)努潘、靈活點標(biāo)記 (ElasticMarker) 扛禽。同時我們提供了海量點(MassMarks)、點聚合(MarkerCluster)
地圖控件 Map Controls
如zoom scale
圖標(biāo)標(biāo)識
可考慮用css修改
插件
插件使用的時候需要單獨引入,https://lbs.amap.com/api/javascript-api/guide/abc/plugins
常用:標(biāo)注 Labels/
信息窗體和右鍵菜單
https://lbs.amap.com/api/javascript-api/guide/overlays/infowindow
熱力圖:
屬性:layer
接口輸入:
顏色config侈净, 根據(jù)透明度的顏色config
數(shù)據(jù): array of({lat, lng, value})
渲染原理
1 根據(jù)對value排序尊勿, value/max = opacity
2 離線canvas 按照opacity從小到大以此繪制每個點的形狀(一般是circle 半徑和模糊半徑)
3 canvas.getImageData 獲取每個點的透明度, 并根據(jù)這個透明度和顏色map 填充對應(yīng)的顏色畜侦, 生成新的imgData
4 canvas.clear
4 canvas.putImageData(imgData,0,0)
怎么得到顏色map:
利用canvas申請1*256像素的空間元扔, 并且利用接口輸入的顏色map和line gradient
var lineGradient=createLinearGradient(0, 0, 256, 1);
for (var opactity in opacityConfig) { lineGradient.addColorStop(parseFloat(opacity),opacityConfig[opacity]);
}
怎么根據(jù)透明度和顏色map填充對應(yīng)的顏色
var max = options.max;
var min = options.min;
var diff = max - min;
var range = options.range || null;
var jMin = 0;
var jMax = 1024;//256*4
if (range && range.length === 2) {
jMin = (range[0] - min) / diff * 1024;
}
if (range && range.length === 2) {
jMax = (range[1] - min) / diff * 1024;
}
var maxOpacity = options.maxOpacity || 0.8;
var range = options.range;
for (var i = 3, len = pixels.length, j; i < len; i += 4) {
j = pixels[i] * 4; // get gradient color from opacity value
if (pixels[i] / 256 > maxOpacity) {
pixels[i] = 256 * maxOpacity;
}
if (j && j >= jMin && j <= jMax) {
pixels[i - 3] = gradient[j];
pixels[i - 2] = gradient[j + 1];
pixels[i - 1] = gradient[j + 2];
} else {
pixels[i] = 0;
}
}
return pixels
坐標(biāo)轉(zhuǎn)換
https://lbs.amap.com/api/webservice/guide/api/convert
坐標(biāo)體系說明
https://segmentfault.com/a/1190000000498434
分類
按坐標(biāo)系的生成范圍分類:
GPS WPS-84 原始坐標(biāo)系、 GCJ-02 國家坐標(biāo)系 又稱火星坐標(biāo)系旋膳、其他坐標(biāo)系澎语;GPS坐標(biāo)系一般是不讓使用的, 在中國一般都會使用GCJ-02或者基于GCJ-02產(chǎn)生的其他偏移坐標(biāo)系
谷歌 高德 騰訊都是使用的GCJ-02坐標(biāo)系
百度使用的是BD-09坐標(biāo)系
按坐標(biāo)系的用途分類
經(jīng)緯度(球面坐標(biāo)系)验懊、墨卡托坐標(biāo)系(平面坐標(biāo)系)
經(jīng)緯度
墨卡托坐標(biāo)系
概念
墨卡托(Mercator)投影擅羞,又名“等角正軸圓柱投影”,荷蘭地圖學(xué)家墨卡托(Mercator)在1569年擬定义图,假設(shè)地球被圍在一個中空的圓柱里减俏,其赤道與圓柱相接觸,然后再假想地球中心有一盞燈碱工,把球面上的圖形投影到圓柱體上娃承,再把圓柱體展開奏夫,這就是一幅標(biāo)準(zhǔn)緯線為零度(即赤道)的“墨卡托投影”繪制出的世界地圖。
有效維度range[-74,74]
轉(zhuǎn)換公式
//經(jīng)緯度轉(zhuǎn)墨卡托
public Vector2D lonLat2Mercator(Vector2D lonLat)
{
Vector2D mercator = new Vector2D();
double x = lonLat.X * 20037508.34 / 180;
double y = Math.Log(Math.Tan((90 + lonLat.Y) * Math.PI / 360)) / (Math.PI / 180);
y = y * 20037508.34 / 180;
mercator.X = x;
mercator.Y = y;
return mercator;
}
//墨卡托轉(zhuǎn)經(jīng)緯度
public Vector2D Mercator2lonLat(Vector2D mercator)
{
Vector2D lonLat = new Vector2D();
double x = mercator.X / 20037508.34 * 180;
double y = mercator.Y / 20037508.34 * 180;
y = 180 / Math.PI * (2 * Math.Atan(Math.Exp(y * Math.PI / 180)) - Math.PI / 2);
lonLat.X = x;
lonLat.Y = y;
return lonLat;
}
特點
墨卡托投影的“等角”特性草慧,保證了對象的形狀的不變行桶蛔,正方形的物體投影后不會變?yōu)殚L方形匙头÷龋“等角”也保證了方向和相互位置的正確性,因此在航海和航空中常常應(yīng)用蹂析,而Google們在計算人們查詢地物的方向時不會出錯舔示。
墨卡托投影的“圓柱”特性,保證了南北(緯線)和東西(經(jīng)線)都是平行直線电抚,并且相互垂直惕稻。而且經(jīng)線間隔是相同的,緯線間隔從標(biāo)準(zhǔn)緯線(此處是赤道蝙叛,也可能是其他緯線)向兩級逐漸增大俺祠。
等角”不可避免的帶來的面積的巨大變形,特別是兩極地區(qū)借帘,明顯的如格陵蘭島比實際面積擴(kuò)大了N倍蜘渣。不過要是去兩極地區(qū)探險或科考的同志們,一般有更詳細(xì)的資料肺然,不會來查看網(wǎng)絡(luò)地圖的蔫缸,這個不要緊。
地理逆編碼
地理編碼/逆地理編碼 API 是通過 HTTP/HTTPS 協(xié)議訪問遠(yuǎn)程服務(wù)的接口际起,提供結(jié)構(gòu)化地址與經(jīng)緯度之間的相互轉(zhuǎn)化的能力拾碌。
- 結(jié)構(gòu)化地址的定義: 首先,地址肯定是一串字符街望,內(nèi)含國家校翔、省份、城市灾前、區(qū)縣防症、城鎮(zhèn)、鄉(xiāng)村豫柬、街道告希、門牌號碼、屋邨烧给、大廈等建筑物名稱燕偶。按照由大區(qū)域名稱到小區(qū)域名稱組合在一起的字符。一個有效的地址應(yīng)該是獨一無二的础嫡。注意:針對大陸指么、港酝惧、澳地區(qū)的地理編碼轉(zhuǎn)換時可以將國家信息選擇性的忽略,但省伯诬、市晚唇、城鎮(zhèn)等級別的地址構(gòu)成是不能忽略的。暫時不支持返回臺灣省的詳細(xì)地址信息
- 地理編碼:將詳細(xì)的結(jié)構(gòu)化地址轉(zhuǎn)換為高德經(jīng)緯度坐標(biāo)盗似。
- 逆地理編碼:將經(jīng)緯度轉(zhuǎn)換為詳細(xì)結(jié)構(gòu)化的地址