这次介绍在Cesium上如何绘制热力图,现在比较常用的热力图插件是heatmap.js,但是它仅仅提供了对leaflet,openlayers等二维地图的插件,本想通过在这些二维地图上出图然后再三维球上加载,但是发现数据可是并不兼容。通过摸索发现了个支持Cesium的热力图插件HeatmapImageryProvider.js,下载地址为:https://www.npmjs.com/package/cesium-heatmap,下面详细介绍一下如何在Cesium上整合这个插件并实现热力图的绘制:
1)首先将HeatmapImageryProvider.js中define到return部分的代码(不要带上最后的heatmap.js的源码)复制到Cesium源码中define的定义与cesium的定义之间,如下所示,是define的定义,将复制的代码之后插入在这后面即可:
define = function (name, deps, callback) {
if (typeof name !== 'string') {
throw new Error('See almond README: incorrect module build, no module name');
}
//This module may not have dependencies
if (!deps.splice) {
//deps is not an array, so probably means
//an object literal or factory function for
//the value. Adjust args.
callback = deps;
deps = [];
}
if (!hasProp(defined, name) && !hasProp(waiting, name)) {
waiting[name] = [name, deps, callback];
}
};
define.amd = {
jQuery: true
};
}());
2)将'./Scene/HeatmapImageryProvider'插入至define('Cesium',[
那一行的第一个形式参数define('Cesium',['./Scene/HeatmapImageryProvider'
将'Scene_HeatmapImageryProvider' 插入至后面函数对应的实参位置,也是第一个function(Scene_HeatmapImageryProvider,Core_appendForwardSlash, Core_arrayFill
3)将Cesium['HeatmapImageryProvider'] = Scene_HeatmapImageryProvider;添加到对Cesium申明的那一行后面:
调用的效果如下所示:
由于本人对Cesium的源码没有深入研究,因此只能这样依样画葫芦的使用一下,其中原理还有待深入了解,欢迎大家交流讨论!
网友评论
我觉得你写的很难看的懂额