我找不到任何关于在 3.0 版 API 中设置标记颜色的文档或示例。你可以用 2.5 做到这一点,有人知道标记颜色是否受支持吗
function addMarkersToMap(map) {
var parisMarker = new H.map.Marker({ lat: 55.560789, lng: 12.981141 });
map.addObject(parisMarker);
}
最佳答案
如 API Explorer 中的示例所述,在不指定 icon
的情况下创建 H.map.Marker
会生成默认图像。如果您需要不同颜色的图标,您需要使用 SVG Graphics 创建它们。 .
function addSVGMarkers(map){
var svgMarkup = '<svg style="left:-14px;top:-36px;"' +
'xmlns="http://www.w3.org/2000/svg" width="28px" height="36px" >' +
'<path d="M 19 31 C 19 32.7 16.3 34 13 34 C 9.7 34 7 32.7 7 31 C 7 29.3 9.7 ' +
'28 13 28 C 16.3 28 19 29.3 19 31 Z" fill="#000" fill-opacity=".2"></path>' +
'<path d="M 13 0 C 9.5 0 6.3 1.3 3.8 3.8 C 1.4 7.8 0 9.4 0 12.8 C 0 16.3 1.4 ' +
'19.5 3.8 21.9 L 13 31 L 22.2 21.9 C 24.6 19.5 25.9 16.3 25.9 12.8 C 25.9 9.4 24.6 ' +
'6.1 22.1 3.8 C 19.7 1.3 16.5 0 13 0 Z" fill="#fff"></path>' +
'<path d="M 13 2.2 C 6 2.2 2.3 7.2 2.1 12.8 C 2.1 16.1 3.1 18.4 5.2 20.5 L ' +
'13 28.2 L 20.8 20.5 C 22.9 18.4 23.8 16.2 23.8 12.8 C 23.6 7.07 20 2.2 ' +
'13 2.2 Z" fill="${COLOR}"></path>' +
'<text transform="matrix( 1 0 0 1 13 18 )" x="0" y="0" fill-opacity="1" ' +
'fill="#fff" text-anchor="middle" ' +
'font-weight="bold" font-size="13px" font-family="arial">${TEXT}</text></svg>'
// Add the first marker
var parisIcon = new H.map.Icon(
svgMarkup.replace('${COLOR}', 'blue').replace('${TEXT}', 'P')),
parisMarker = new H.map.Marker({lat: 55.5607, lng: 12.9811 },
{icon: parisIcon});
map.addObject(parisMarker);
}
要更新颜色,只需创建一个新的 H.map.Icon
替换标记的 icon
属性。
关于javascript - Here Maps JavaScript API 3.0 Explorer 如何设置标记颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26020199/