deck.gl 中的图例

Question

我想知道是否可以从 deck.gl 层访问聚合数据以绘制图例。

因为提供了配色方案，所以我只需要 screengrid 层计算的聚合值的范围就可以将其添加到图例中。

我知道有工具提示，但在某些情况下，访问这些值会很好。

Answer 1

我正在使用 HexagonLayer，对于那个，您可以在初始化图层时使用半自定义 onSetColorDomain 函数找到图层的值。然后将域范围数组保存到变量中并调用生成图例函数。

例如：

        const hexlayer = new HexagonLayer({
          id: 'heatmap',
          pickable: true,
          colorRange: COLOR_RANGE,
          data:  feats_obj.coords_array,
          elevationScale: 9,
          extruded: true,
          radius: 300,
         getColorValue: points => {
            if( points.length > max_points) {
              max_points = points.length
            }
            renderCategories( incident_categories )
            return points.length
          },
          onSetColorDomain: (ecol) => {
            console.log('color domain set', ecol)
            max_span.innerHTML = ecol[1]
            color_domain = ecol;
            create_legend()

          //  console.log('max_points: ', max_points)
          },...
        })

我想出的方法是在初始化图层之外的多边形全局变量中创建一个最大点，并让它在多边形中的点数超过该最大值时更新该值。它在野外的一个例子是：https://mpmckenna8.github.io/sfviz/?start_date=2020-05-01&end_date=2020-05-31 带有指向你可以在那里破解的 repo 的链接。