热力地图高德_调用高德地图API(热力图)详解
具体脚本语言如下:
热力图
var map = new AMap.Map("container", {
resizeEnable: true,
center: [116.418261, 39.921984],
zoom: 11
});
var points=[
{"lng":"116.32497","lat":"39.96696"},
{"lng":"116.616","lat":"40.053016"},
{"lng":"116.34324","lat":"39.95056"},
{"lng":"116.554131","lat":"39.912131"},
{"lng":"116.3483","lat":"39.83151"},
{"lng":"116.36619","lat":"39.75298"}
];
if (!isSupportCanvas()) {
alert('热力图仅对支持canvas的浏览器适用,您所使用的浏览器不能使用热力图功能,请换个浏览器试试~')
}
//详细的参数,可以查看heatmap.js的文档 http://www.patrick-wied.at/static/heatmapjs/docs.html
//参数说明如下:
/* visible 热力图是否显示,默认为true
* opacity 热力图的透明度,分别对应heatmap.js的minOpacity和maxOpacity
* radius 势力图的每个点的半径大小
* gradient {JSON} 热力图的渐变区间 . gradient如下所示
*{
.2:'rgb(0, 255, 255)',
.5:'rgb(0, 110, 255)',
.8:'rgb(100, 0, 255)'
}
其中 key 表示插值的位置, 0-1
value 为颜色值
*/
var heatmap;
map.plugin(["AMap.Heatmap"], function() {
//初始化heatmap对象
heatmap = new AMap.Heatmap(map, {
radius: 25, //给定半径
opacity: [0, 0.8]
/*,gradient:{
0.5: 'blue',
0.65: 'rgb(117,211,248)',
0.7: 'rgb(0, 255, 0)',
0.9: '#ffea00',
1.0: 'red'
}*/
});
//设置数据集:该数据为北京部分“公园”数据
heatmap.setDataSet({
data: points,
max: 100
});
});
//判断浏览区是否支持canvas
function isSupportCanvas() {
var elem = document.createElement('canvas');
return !!(elem.getContext && elem.getContext('2d'));
}
大家将上述代码存在一个html文件中,然后通过网页打开即可。
其中只需要注意
heatmap.setDataSet({
data: points,
max: 1
}
中的data:后面的points是你自己的数据,即在之前定义的json格式经纬度
var points=[
{"lng":"116.32497","lat":"39.96696"},
{"lng":"116.616","lat":"40.053016"},
{"lng":"116.34324","lat":"39.95056"},
{"lng":"116.554131","lat":"39.912131"},
{"lng":"116.3483","lat":"39.83151"},
{"lng":"116.36619","lat":"39.75298"}
];
还有就是max的值(即最红区域对应的次数值)选取自己觉得合适的,不然太小会几乎一片红色,太大几乎看不到热力图颜色。
热力地图高德_调用高德地图API(热力图)详解相关推荐
- 地图瓦片:矢量瓦片和栅格瓦片详解
地图瓦片:矢量瓦片和栅格瓦片详解 为什么需要瓦片: 地图缓存技术:地图服务的性能需求越来越高:缓存技术大大提高了地图服务的性能:缓存技术降低了服务器端压力,不在需要进行动态出图:地图缓存或瓦块地图可以 ...
- c调用python脚本如何获取结果_使用C++调用Python代码的方法详解
一.配置python环境问题 1.首先安装Python(版本无所谓),安装的时候选的添加python路径到环境变量中 安装之后的文件夹如下所示: 2.在VS中配置环境和库 右击项目->属性-&g ...
- php调用C代码的方法详解和zend_parse_parameters函数详解
来源:http://my.oschina.net/Customs/blog/490873 http://blog.csdn.net/super_ufo/article/details/3863731 ...
- 最全的jquery datatables api 使用详解
https://www.cnblogs.com/amoniyibeizi/p/4548111.html 最全的jquery datatables api 使用详解 学习可参考:http://www.g ...
- React Native - Keyboard API使用详解(监听处理键盘事件)
参考: React Native - Keyboard API使用详解(监听处理键盘事件) 当我们点击输入框时,手机的软键盘会自动弹出,以便用户进行输入. 但有时我们想在键盘弹出时对页面布局做个调整, ...
- 【Java 8 新特性】Java 8 Util API: StringJoiner 详解 | 拼接字符串添加分隔符、前缀和后缀
Java 8 Util API: StringJoiner 详解 StringJoiner(CharSequence d) StringJoiner.add(CharSequence element) ...
- openGL API glVertexAttribPointer详解
openGL API glVertexAttribPointer详解 文章目录 openGL API glVertexAttribPointer详解 一.官方文档 二.翻译 例子 运行结果 代码下载 ...
- openGL API glUniformMatrix4fv详解
openGL API glUniformMatrix4fv详解 文章目录 openGL API glUniformMatrix4fv详解 官网 翻译 1.函数原型 2.参数列表: 3.描述: 4.描述 ...
- openGL API glProgramUniform详解
openGL API glProgramUniform详解 前言 一.官方文档 二.翻译 例子 运行结果 代码下载 前言 openGL API 之glProgramUniform详解 一.官方文档 g ...
- php tongjiapi 使用_Kayako REST API使用详解一
Kayako是PHP中非常流行的客服处理系统,包含工单模板.在线聊天模块.新闻模板.知识库模块.疑难解答模块以及电邮处理模块. 为什么REST API? REST 是英文 Representation ...
最新文章
- 【错误记录】Android Studio 编译报错 ( VirtualApp 编译 NDK 报错 | Error:A problem occurred configuring project ‘: )
- MSDN演练时发现的SqlServer2005数据库连接问题
- 纯java生成excel
- 如何使用DotNet 2.0中的应用程序配置 Settings.settings
- 图的建立-邻接表表示(C语言)
- lhgdialogV2.37 使用
- 我们一定要有自立的飞秋觉悟
- 域服务器批量修改用户密码,Windows域控制器批量创建用户
- 太扎心!10亿网民:4成初中学历,月收入超5000元不足3成
- scala的三个排序方法
- sqli-labs(24)
- 改变win7登陆时的界面
- 机器学习- 吴恩达Andrew Ng - week3-4 solve overfitting
- 计算机组成原理答案 耿,计算机组成理习题课2.ppt
- 为什么我们创业失败了和选择创业公司的思考
- python return break_Python基础:return和break的不同
- 如何把一张pdf分成多个?一个pdf怎么分成若干个pdf?
- 反演产品的精度和空间分辨率
- Transforemr模型从零搭建Pytorch逐行实现
- 21世纪东方美女标准[男士参考女士学习]