高德地圖 Javascript API 入門（七）

YuboonaZhang 發布于2019-08-21 11:31 / 2687人閱讀

摘要：高德地圖入門七熱力圖插件簡單例子顯示地圖坐標點加載熱力圖插件預覽參數構造函數說明構造一個熱力圖插件對象，為要疊加熱力圖的地圖對象，屬性參考列表中的說明。

高德地圖 Javascript API 入門（七） 熱力圖插件 簡單例子

// 顯示地圖
var map=new AMap.Map("container",{
    resizeEnable:true,
    center:[116.397428, 39.90923],
    zoom:11
});
// 坐標點
var points =[
    {"lng":116.191031,"lat":39.988585,"count":100},
    {"lng":116.389275,"lat":39.925818,"count":60},
    {"lng":116.287444,"lat":39.810742,"count":200},
    {"lng":116.481707,"lat":39.940089,"count":30},
    {"lng":116.410588,"lat":39.880172,"count":200},
    {"lng":116.394816,"lat":39.91181,"count":10},
    {"lng":116.416002,"lat":39.952917,"count":150}
];
// 加載熱力圖插件
map.plugin(["AMap.Heatmap"],function () {
     var heatmap=new AMap.Heatmap(map,{
        radius:50
    });
    heatmap.setDataSet({
           data:points,
        max:100
       });
)};

預覽

參數

AMap.Heatmap

構造函數	說明
AMap.Heatmap(map:Map,opts:HeatmapOptions)	構造一個熱力圖插件對象，map為要疊加熱力圖的地圖對象，opts屬性參考HeatmapOptions列表中的說明。

options

HeatmapOptions	類型	說明
radius	Number	熱力圖中單個點的半徑，默認：30，單位：pixel
gradient	Object	熱力圖的漸變區間，熱力圖按照設置的顏色及間隔顯示熱力圖，例： { 0.4:"rgb(0, 255, 255)", 0.65:"rgb(0, 110, 255)", 0.85:"rgb(100, 0, 255)", 1.0:"rgb(100, 0, 255)" } 其中 key 表示間隔位置，取值范圍： [0,1]，value為顏色值。默認：heatmap.js標準配色方案
opacity	Array	熱力圖透明度數組，取值范圍[0,1]，0表示完全透明，1表示不透明，默認：[0,1]
zooms	Array	支持的縮放級別范圍，取值范圍[3-18]，默認：[3,18]

------ 參考來源：http://lbs.amap.com/ 作者：Yangfan

GPU云服務器云服務器高德地圖api接口高德地圖api接口文檔高德地圖高德地圖大數據

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86805.html

高德地圖 Javascript API 入門（一）

摘要：高德地圖入門一準備工作首先注冊個開發者賬號然后創建應用，獲取新建文件，在標簽中引入如下代碼把你的值填入即可您申請的值創建設置地圖容器地圖初始化創建地圖設置地圖參數可以通過以下設置也可通過對象的方法設置預覽個性化地圖改變地圖樣式目前支持五種地高德地圖 Javascript API 入門（一）準備工作首先注冊個開發者賬號 showImg(https://segmentfault.co...

jone5679 2019-08-20 14:29 評論0 收藏0
高德地圖 Javascript API 入門（二）

摘要：鼠標在地圖上拉框即可繪制相應的矩形。鼠標在地圖上單擊繪制量測區域，鼠標左鍵雙擊或右鍵單擊結束當前量測操作，并顯示本次量測結果。參數設為時，鼠標操作關閉的同時清除地圖上繪制的所有覆蓋物對象設為時，保留所繪制的覆蓋物對象。高德地圖 Javascript API 入門（二）鼠標工具插件測量距離 JS map.plugin([AMap.MouseTool],function ()...

dockerclub 2019-08-20 14:29 評論0 收藏0
高德地圖 Javascript API 入門（六）

摘要：高德地圖入門六出行規劃公交路徑公交換乘服務，提供起終點公交路線規劃服務，整合步行方式初始化加載公交線路插件實例化北京必須值，搭乘公交所在城市可選值，搜索結果的標注線路等均會自動添加到此地圖上可選值，顯示搜索列表的容器可選值，詳細信息駕駛策略高德地圖 Javascript API 入門（六）出行規劃公交路徑公交換乘服務，提供起、終點公交路線規劃服務，整合步行方式初始化 // 加...

idisfkj 2019-08-20 14:39 評論0 收藏0
高德地圖 Javascript API 入門（三）

摘要：高德地圖入門三距離測量插件區別雖然鼠標工具插件也提供距離量測功能，但是距離量測插件，提供更為豐富的樣式設置功能。高德地圖 Javascript API 入門（三）距離測量插件區別雖然鼠標工具插件也提供距離量測功能，但是距離量測插件，提供更為豐富的樣式設置功能。加載插件 JS map.plugin([AMap.RangingTool],function () { ...

EdwardUp 2019-08-20 14:29 評論0 收藏0
高德地圖 Javascript API 入門（四）

摘要：高德地圖入門四地圖覆蓋物覆蓋物類名說明是否插件點標記否覆蓋物點標記復雜點標記對象，對普通點標記的擴展否覆蓋物折線否覆蓋物多邊形否覆蓋物圓否圖片覆蓋物否地圖右鍵菜單否點標記預覽自定義點標記預覽多邊形預覽右鍵菜單添加右鍵菜單內容項放大縮小添加高德地圖 Javascript API 入門（四）地圖覆蓋物覆蓋物類名說明是否插件 AMap.Marker 點標記否 AM...

AlanKeene 2019-08-20 14:29 評論0 收藏0