1.5.3.2.18.1 热力图

原理：在客户端直接渲染的栅格图，热点图的渲染需要三大要素：

• 热点数据，热点数据需要点数据，每一个热点数据需要有地理位置以及权重值 （能够明显的表现某位置某事件发生频率或事物分布密度等，如可以为温度的高低、人口密集度等等)
• 热点衰减渐变填充色集合， 用于渲染每一个热点从中心向外衰减时的渐变色
• 热点半径，也就是衰减半径。每一个热点需要从中心点外四周根据半径计算衰减度， 对在热点衰减区内的每一个像素计算需要渲染的颜色值，然后进行客户端渲染

应用场景：由于热点图的衰减是像素级别的，视觉效果方面极佳，但不能与具体数据进行一一对应，只能表示权重之间的差别，所以可以用于一些对精度要求不高而需要重点突出权重渐变的行业，如可以制作气象温度对比动态效果图、地震区域的震点强弱图等。

//创建热力图
var xmax = 130, xmin = 80, ymax = 50, ymin = 20;
for (var i = 0; i < 100; i++) {
heatPoints[i] = new ol.Feature(new ol.geom.Point([Math.floor(Math.random() * (xmax - xmin + 1) + xmin), Math.floor(Math.random() * (ymax - ymin + 1) + ymin)]));
}
var heatMap = new ol.layer.Heatmap({
    source: new ol.source.Vector({
    //热力点数组
    features: heatPoints,
    wrapX: false
    }),
    //模糊大小
    blur: blur,
    //半径大小
    radius: radius
});
map.addLayer(heatMap);

查看完整示例代码