Mapbox 比例符号要素半径

Question

我是 Mapbox GL JS 的新手，正在为数据驱动的样式而苦苦挣扎。我想根据我的数据源中的值按比例缩放我的圆特征 (a Google Sheet)。这是一个代码片段：

  map.addLayer({
    id: 'csvData',
    type: 'circle',
    source: {
     type: 'geojson',
     data: data
    },
    paint: {
      'circle-color': '#dd502c',
      'circle-stroke-width': 1,
      'circle-stroke-color': '#dd502c',
      'circle-opacity': 0.5,
      "circle-radius": {
        property: 'value',
        stops: [
          [2, 5],
                        [1000, 10],
                        [8000, 20],
        ]
      }
    }

  });

非常感谢，

Answer 1

看起来像 AverageNitrate（我假设这是你试图绘制的属性）是一个字符串。转换为 int 就成功了。

我还在样式表达式中引用了它而不是通用的 'value'

data.features.forEach((datum)=>{
          datum.properties.AverageNitrate = parseInt(datum.properties.AverageNitrate)
      })
      
      //Add the the layer to the map
      map.addLayer({
        id: 'csvData',
        type: 'circle',
        source: {
         type: 'geojson',
         data: data
        },
        paint: {
          'circle-color': '#dd502c',
          'circle-stroke-width': 1,
          'circle-stroke-color': '#dd502c',
          'circle-opacity': 0.5,
          "circle-radius": {
            property: 'AverageNitrate',
            stops: [
              [2, 5],
                            [1000, 10],
                            [8000, 20],
            ]
          }
        }
      
      });

这里是 link 编辑后的 fiddle: https://jsfiddle.net/mojsc6pn/35/

Mapbox 比例符号要素半径

Mapbox proportional symbol feature radius

mapbox-gl-js