高德地图 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列表中的说明。 |
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] |