簡體   English   中英

如何從geojson為mapbox GL獲取'line-dasharray'值

[英]How to get 'line-dasharray' value from geojson for mapbox GL

我正在嘗試通過 ['get', 'line-dasharray'] 獲取值,但出現錯誤

這是我的代碼

var data = {
          'type': 'FeatureCollection',
          'features': [
 {
              'type': 'Feature',
              'geometry': {
                'type': 'LineString',
                'coordinates': []
              },
              'properties': {
                'route_id': 300,
                'route_url': 'http://test.com/file.gpx',
                'line-color': '#426d7e',
                'line-width':     3,
                'line-opacity':   1,
                'line-dasharray': [5, 2]
              },
            },
]
    }

// some code



              map.addSource('locations-rote', {
                type: 'geojson',
                data: data,
                generateId: true
              });

map.addLayer({
                  'id': 'route-coordinates',
                  'type': 'line',
                  'source': 'locations-rote',
                  'layout': {
                    'line-join': 'round',
                    'line-cap': 'round'
                  },
                  'paint': {
                    'line-color': ['get', 'line-color'],
                    'line-width': ['get', 'line-width'],
                    'line-opacity': ['get', 'line-opacity'],
                    'line-dasharray': ['get', 'line-dasharray']
                  }
                });

我嘗試使用數組表達式 - https://docs.mapbox.com/mapbox-gl-js/style-spec/expressions/#types-array但也出現錯誤。 告訴我如何解決問題。

盡管您沒有指定您得到的錯誤是什么,但您可能會看到類似於以下內容的情況:

Error: layers.route-coordinates.paint.line-dasharray: data expressions not supported

如 SDK 支持此處line-dasharray文檔中所示,這是因為數據驅動的樣式(即使用表達式來確定屬性的值以及從源數據派生的信息)尚不支持 GL JS 的line-dasharray屬性。

如果您想根據不同的屬性對虛線設置不同的樣式,則可以通過應用過濾器創建幾個不同的圖層來引用此源數據。

Mapbox 在 2.3.0 版上支持數據驅動屬性“line-dasharray”。 您可以更新 sdk 版本。

有關詳細信息,請參閱github 問題

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM