這次介紹在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申明的那一行后面:
調用的效果如下所示: