1.《117颗星 manuelnas/CesiumHeatmap》 6 | 基于heatmap.min.js,通过绘制Entity(矩形)实体实现,364行代码,有三维效果 7 | 2. 《32颗星 postor/cesiumjs-heat 》 8 | 基于heatmap.min.js,使用SingleTileImageryProvider图层实现,根据镜头移动具有重绘功能,239行代码,无三维效果 9 | 3. 《16颗星 wangzhongliang/CesiumHeatmap》 10 | 使用Primitive图元实现,提供了两种方式,优点在于计算范围的方法。 11 | 方式一基于heatmap.min.js,157行代码,无三维效果; 12 | 方式二基于webgl-heatmap.js,128行代码,无三维效果;
13 | 14 | 15 |
30 |
npm install cesium-heatmap-es6
自行打开docs文件夹
45 | 46 | 47 |<script type="text/javascript" src="./CesiumHeatmap/dist/cesium-heatmap-es6.umd.js"></script>
const defaultDataValue = [10, 500]
const defaultOpacityValue = [0, 1]
const points = []
fetch("/datas/geojson/busstop2016.geojson", {
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
}).then((response) => {
response.json().then((data) => {
if (data)
data.features.forEach(function (feature) {
const lon = feature.geometry.coordinates[0]
const lat = feature.geometry.coordinates[1]
points.push({
x: lon,
y: lat,
value: 100 * Math.random()
})
})
const earthHeatMap = new CesiumHeatmap(viewer,
{
zoomToLayer: true,
points,
heatmapDataOptions: { max: defaultDataValue[1], min: defaultDataValue[0] },
heatmapOptions: {
maxOpacity: defaultOpacityValue[1],
minOpacity: defaultOpacityValue[0]
}
}
)
})
})
50 |
51 |
52 |
53 | const defaultDataValue = [10, 500]
const defaultOpacityValue = [0, 1]
import { CesiumHeatmap, HeatmapPoint } from "cesium-heatmap-es6"
const points: HeatmapPoint[] = []
fetch("/datas/geojson/busstop2016.geojson", {
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
}).then((response) => {
response.json().then((data) => {
if (data)
data.features.forEach(function (feature) {
const lon = feature.geometry.coordinates[0]
const lat = feature.geometry.coordinates[1]
points.push({
x: lon - 0.05,
y: lat - 0.04,
value: 100 * Math.random()
})
})
cesiumHeatmap = new CesiumHeatmap(viewer,
{
zoomToLayer: true,
points,
heatmapDataOptions: { max: defaultDataValue[1], min: defaultDataValue[0] },
heatmapOptions: {
maxOpacity: defaultOpacityValue[1],
minOpacity: defaultOpacityValue[0]
}
}
)
})
})
56 |
57 |
58 |
59 | npm run a
npm start
npm run build
npm run release
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc
Generated using TypeDoc