如何更改地圖框中點擊標記的標記顏色和圖標？

我是Mapbox的新手。我在mapbox studio中創建了自定義樣式地圖，然後使用geoJson添加標記。以下是示例代碼：如何更改地圖框中點擊標記的標記顏色和圖標？

mapboxgl.accessToken = 'pk.eyJ1Ijoic2Fua3ljc2Uhhcc.mb22KHuonjywQ-eaWQ'; 
var map = new mapboxgl.Map({ 
container: 'map_geo', 
style: 'mapbox://styles/abcd/cipjtsdhyh04ebam5tndf4jaj', 
zoom: 3.7, 
center: [81.30, 22.76] 
}); 
var geoJson = { 
"type": "FeatureCollection", 
"features": [{ 
    "type": "Feature", 
    "properties": { 
     "title": "Nagpur", 
      "description": "Nagpur", 
     "marker-symbol": "marker", 
    }, 
    "geometry": { 
     "coordinates": [79.0882, 21.1845], 
     "type": "Point" 
    }, 
    "id": "223e9579f03849c87abec10dfed64c37" 
}, { 
    "type": "Feature", 
    "properties": { 
     "title": "Lucknow", 
     "description": "Lucknow", 
     "marker-symbol": "marker", 
    }, 
    "geometry": { 
     "coordinates": [80.9462, 26.8467], 
     "type": "Point" 
    }, 
    "id": "2cc757705489152c8bccb33635708427" 
}] 
}; 

map.on('load', function() { 
map.addSource("markers", { 
    "type": "geojson", 
    "data": geoJson 

}); 

map.addLayer({ 
    "id": "markers", 
    "type": "symbol", 
    "source": "markers", 
    "layout": { 
     "icon-image": "{marker-symbol}-15", 
     "text-field": "{title}", 
     "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"], 
     "text-offset": [0, 0.6], 
     "text-anchor": "top", 
    }, 
    "paint": { 
      "text-size": 16, 
      "text-color": "#fff", 
     } 
}); 
}); 
map.scrollZoom.disable(); 
map.on('click', function (e) { 
var features = map.queryRenderedFeatures(e.point, { layers: ['markers'] }); 

if (!features.length) { 
    return; 
} 

// here I want to change the marker color to highlight the selected marker 

});

現在我想更改標記顏色，單擊任何標記以顯示所選標記。在此先感謝。

來源

2016-06-28 sankycse

感謝您的問題！

你會發現這個例子中實現您所要求的功能有所幫助：https://www.mapbox.com/mapbox-gl-js/example/hover-styles/

的基本工作流程如下：

創建標記的兩層：一個是，在未加亮顯示標記樣式和顯示突出顯示樣式的標記
使用過濾器隱藏突出顯示的樣式圖層中的所有標記
偵聽click ev耳鼻喉科
使用queryRenderedFeatures
顯示中突出顯示層上的標記使用過濾器

我們正在努力工作，以使這個過程更直接找到光標下的標記！

來源

2016-06-28 18:06:14

如何更改地圖框中點擊標記的標記顏色和圖標？

回答

相關問題