问Deck.gl，如何根据列中的值定义散点图的不同颜色
EN

Stack Overflow用户

提问于 2019-08-29 13:51:58

回答 1查看 892关注 0票数 2

这是我的第一个JS代码，所以请耐心等待，我设法改编了一个来自Deck.Gl的示例来显示散点图，现在我不确定如何根据列"Status“的值更改颜色，我知道如何根据1值更改颜色，但不确定如何使用if then else在这里执行其余操作

getFillColor: d => (d[2] === '1-pile' ? [0, 128, 255] : [255, 100, 128])

下面是一个完整的重现示例

 <html>
  <head>
    <title>deck.gl solar Farm  Example</title>
    <script src="https://unpkg.com/deck.gl@^7.0.0/dist.min.js"></script>
    <script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.50.0/mapbox-gl.js"></script>
  </head>
  <body>
    <div id="container"></div>      
  </body>
  <script type="text/javascript">
    const {DeckGL, ScatterplotLayer} = deck;  
    new DeckGL({
      mapboxApiAccessToken: 'xxxxx',
      mapStyle: 'mapbox://styles/mapbox/satellite-streets-v9',
      longitude: 5.2,
      latitude:  35.49,
      zoom: 15,
      minZoom: 5,
      maxZoom: 20,
      pitch: 40.5,
      layers:[ 
        new ScatterplotLayer({
        id: 'scatter-plot',
        data: 'https://raw.githubusercontent.com/djouallah/interactivie_map/master/data.json',
        radiusScale: 3,
        radiusMinPixels: 0.25,
        getPosition: d => [d[0], d[1], 0],
        getFillColor: d => (d[3] === '1-pile' ? [0, 128, 255] : [255, 100, 128])
      })
      ]
    });
  </script>
</html>

javascript

deck.gl

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-09-02 13:18:40

一个简单的解决方案(我也不是javascript开发人员)可以是创建一个函数，该函数根据变量返回颜色

function get_colour( d ) {
        if( d === '1-pile' ) {
            return [0,128,255]
        } else if ( d === '2-Tracker') {
            return [255,100,128]
        } else if ( d === '3-module') {
            return [128, 128, 128]
        } else {
            return [255, 255, 255]
        }
    }

然后，您可以为getFillColor属性调用它

getFillColor: d => get_colour( d[3] )

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/57703751

复制

相似问题

问Deck.gl，如何根据列中的值定义散点图的不同颜色
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Deck.gl，如何根据列中的值定义散点图的不同颜色EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Deck.gl，如何根据列中的值定义散点图的不同颜色
EN