颜色标题地图框
Color title mapbox
有谁知道如何更改地图框上标记的标题颜色,
我希望家是蓝色的,我尝试添加油漆:color-size:"blue",但它不起作用,
谢谢你的帮助!!
map.on('load', function () {
map.loadImage(
'https://docs.mapbox.com/mapbox-gl-js/assets/custom_marker.png',
function (error, image) {
if (error) throw error;
map.addImage('custom-marker', image);
map.addSource('points', {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': [
{
// feature for Mapbox
'type': 'Feature',
'geometry': {
'type': 'Point',
'coordinates': [6.157902659395512,49.3612254277963],
},
'properties': {
'title': 'Lieu de repas',
'scale': 2,
},
}
]
}
});
map.addLayer({
'id': 'points',
'type': 'symbol',
'source': 'points',
'layout': {
'icon-image': 'custom-marker',
'text-field': ['get', 'title'],
"text-size": 28,
'text-font': [
'Open Sans Regular',
],
'text-offset': [0, 1.25],
'text-anchor': 'top',
}
});
}
);
});
您可以通过类似于此的方式为此创建一个 HTML marker:
var el = document.createElement('div');
el.innerHTML = 'Lieu de repas';
el.style.color = 'blue';
new mapboxgl.Marker(el)
.setLngLat([6.157902659395512,49.3612254277963])
.addTo(map);
有谁知道如何更改地图框上标记的标题颜色, 我希望家是蓝色的,我尝试添加油漆:color-size:"blue",但它不起作用, 谢谢你的帮助!!
map.on('load', function () {
map.loadImage(
'https://docs.mapbox.com/mapbox-gl-js/assets/custom_marker.png',
function (error, image) {
if (error) throw error;
map.addImage('custom-marker', image);
map.addSource('points', {
'type': 'geojson',
'data': {
'type': 'FeatureCollection',
'features': [
{
// feature for Mapbox
'type': 'Feature',
'geometry': {
'type': 'Point',
'coordinates': [6.157902659395512,49.3612254277963],
},
'properties': {
'title': 'Lieu de repas',
'scale': 2,
},
}
]
}
});
map.addLayer({
'id': 'points',
'type': 'symbol',
'source': 'points',
'layout': {
'icon-image': 'custom-marker',
'text-field': ['get', 'title'],
"text-size": 28,
'text-font': [
'Open Sans Regular',
],
'text-offset': [0, 1.25],
'text-anchor': 'top',
}
});
}
);
});
您可以通过类似于此的方式为此创建一个 HTML marker:
var el = document.createElement('div');
el.innerHTML = 'Lieu de repas';
el.style.color = 'blue';
new mapboxgl.Marker(el)
.setLngLat([6.157902659395512,49.3612254277963])
.addTo(map);