Cesium实现热力图绘制

这次介绍在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申明的那一行后面:

4)确保在加载Cesium.js之前要先加载heatmap.js
调用的效果如下所示:
由于本人对Cesium的源码没有深入研究,因此只能这样依样画葫芦的使用一下,其中原理还有待深入了解,欢迎大家交流讨论!

你可能感兴趣的:(Cesium实现热力图绘制)