1.使用es6模块化方式引入HeatMap和VectorSource
import Heatmap from 'ol/layer/Heatmap' import VectorSource from 'ol/source/Vector'
2.创建热力图图层并添加到map上
let heatMapLayer = new Heatmap({ name: 'heatLayer', source: new VectorSource(), gradient: ['#00f', '#0ff', '#0f0', '#ff0', '#f00'], //颜色 blur: 25, // 模糊半径 radius: 20 //半径 }) //当添加feature到热力图层上时,设置热力值 heatMapLayer.getSource().on('addfeature', function (event) { let num = event.feature.get('num') // 热力值,从feature的属性中读取 let magnitude = parseFloat(num) event.feature.set('weight', magnitude)// 设置热力值 }) map.addLayer(heatMapLayer)
3.创建feature并添加到热力图图层上
let feature = null if (data.pointWkt) { feature = wkt.readFeature(data.pointWkt) //使用wkt格式个点坐标创建feature // 添加属性到feature中,用于保存相关数据 for (let prop in data) { feature.set(prop, data[prop]) } } // 将feaure添加到t热力图图层上 heatMapLayer.getSource().addFeature(feature)