cesiumheatmap3d

A library for creating 3D heatmap(using heatmap.js) in Cesium

Installation

$ npm install cesiumheatmap3d

Usage

import CesiumHeatMap3D from 'cesiumheatmap3d';

const viewer = new Cesium.Viewer(cesiumContainer, viewerOption);
const bounds = [120, 20, 130, 40];
/**
 * create a CesiumHeatMap3D instance
 * @param {Cesium.Viewer} viewer The Viewer of Cesium.
 * @param {Array<number>} bounds [west, south, east, north]
 * @param {object} heatmapOptions Part of the option of heatmap.js are now available: gradient, radius, opacity, maxOpacity, minOpacity and blur are now available.
 * @param {object} heatmap3DOptions The options which are used to generate the 3D heatmap. Height and heightGradient are now available.
 */
const heatmapInstance = new CesiumHeatMap3D(
  viewer,
  bounds,
  {
    blur: 0.8,
    radius: 35
  },
  {
    baseHeight: 100,
    heightGradient: 100
  }
);
let points = [];
for (let i = 0; i < 1000; i++) {
  let lon = Math.random() * (bounds[2] - bounds[0]) + bounds[0];
  let lat = Math.random() * (bounds[3] - bounds[1]) + bounds[1];
  let value = Math.random() * 100;
  points.push({ lon, lat, value });
}
/**
 * Initializes a heatmap instance with a dataset
 * @param {object} data An array of objects, where each item contains lon, lat, value and radius(optional).
 * @param {number} min Min value of the heatmap.
 * @param {number} max Max value of the heatmap.
 */
heatmapInstance.setData(points, 0, 100)
/**
 * Remove the 3D heatmap in Cesium
 */
heatmapInstance.removeDate()

To be continued...