deck.gl 中的图例

Posted 2023-02-16

【中文标题】deck.gl 中的图例

【英文标题】：Legend in deck.gl

【发布时间】：2020-09-13 18:26:45

【问题描述】：

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

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

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

【参考方案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 的链接。

【讨论】：

嘿，谢谢！这看起来不错。问题：您知道为什么最大值的红色似乎从未归因于可视化吗？我玩弄了日期范围，图例正在更新，但地图上从来没有红色六边形。

最大红色多边形仅在极少数情况下出现，我认为只是某些设置的 b/c 我可能在初始化对象中搞砸了，因为我进行了很多试验以查看它们都是什么做，因为源代码中所有被注释掉的东西都会显示给你。