这个示例演示了如何构造一个用于可视化大型、密集点数据集的 HeatmapRenderer 。HeatmapRenderer 将点可视化为一个栅格表面，其中强颜色表示点密度高的区域。弱颜色或没有颜色的区域表示没有很多点的地方。
了解如何实现热图对于理解如何构建渲染器至关重要。 视图中的每个像素都根据其与一个或多个点的接近程度分配一个 强度 值。 如果指定了 字段 ，则将强度值乘以字段值。
通过将一组 colorStops 传递给渲染器来构造热图。 这些将特定颜色映射到比率值。 ratio 表示像素的强度值与渲染器的 maxPixelIntensity 的比值。 因此，maxPixelIntensity 越低，地图看起来越热。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const renderer = {
type: "heatmap",
colorStops: [
{ color: "rgba(63, 40, 102, 0)", ratio: 0 },
{ color: "#472b77", ratio: 0.083 },
{ color: "#4e2d87", ratio: 0.166 },
{ color: "#563098", ratio: 0.249 },
{ color: "#5d32a8", ratio: 0.332 },
{ color: "#6735be", ratio: 0.415 },
{ color: "#7139d4", ratio: 0.498 },
{ color: "#7b3ce9", ratio: 0.581 },
{ color: "#853fff", ratio: 0.664 },
{ color: "#a46fbf", ratio: 0.747 },
{ color: "#c29f80", ratio: 0.83 },
{ color: "#e0cf40", ratio: 0.913 },
{ color: "#ffff00", ratio: 1 }
],
maxPixelIntensity: 25,
minPixelIntensity: 0
};
const layer = new CSVLayer({
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.csv",
title: "Magnitude 2.5+ earthquakes from the last week",
renderer: renderer
});
有关此实现的更多细节，请参阅 HeatmapRenderer 文档。
Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.