前言：
而今朋友们对“htmlheatmap”可能比较关心，兄弟们都想要了解一些“htmlheatmap”的相关资讯。那么小编同时在网络上搜集了一些对于“htmlheatmap””的相关知识，希望姐妹们能喜欢，各位老铁们一起来了解一下吧！openlayers5之热力图heatmap
# openlayers5之热力图heatmap
###### 代码
```javascript
var map, view, heatmapL;
$(function () {
//热力图层
heatmapL = new ol.layer.Heatmap({
gradient: ['#00f', '#0ff', '#0f0', '#ff0', '#f00'],//热力图渲染色带，默认可不设置
radius: 8,//每个像素渲染点半径，可根据实际数据效果进行调整
blur: 15,//模糊度，可根据实际数据效果进行调整
weight:'weight',//权重值，热力图根据这个值进行热力渲染；图层中每个feature都要有这个属性；属性名默认weight，可以改成自己的字段名；注：0~1之间。
renderModed:'image',//图层渲染方式，image和vector分别为栅格和矢量，第一个渲染速度快；后者慢，ol5新增加的属性，对于大量数据渲染有利
source: new ol.source.Vector({
url: '../data/kml/2012_Earthquakes_Mag5.kml',
format: new ol.format.KML({
extractStyles: false
})
})//矢量source
}),
view = new ol.View({
center: [0, 0],
zoom: 2
});
map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.Stamen({
layer: 'toner'
})
}),
heatmapL
],
target: 'map',
view:view
})
})
```
[点击下载源码]( "代码下载")
标签： #htmlheatmap
