1

Here-maps 带有 SVG 图标的标记仅在 Safari 上的地图中不显示(适用于所有其他浏览器)。我也在使用地图外的图标,它们在那里显示得很好。实际的地图是画布,所以也许这与它有关?

尝试向图标的 SVG 标记添加高度、宽度和版本属性。

SVG 图标标记:

<svg xmlns="http://www.w3.org/2000/svg" width="1.25rem" class="svg-inline--fa fa-map-marker-alt" focusable="false" viewBox="0 0 384 512">
  <path d="M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z" fill="#007bff"></path>
</svg>

标记创建:

const svgMarkup = ''; //The markup from above
const latitude = 47.6062;
const longitude = 122.3321;

const icon = new H.map.Icon(svgMarkup);
return new H.map.Marker({lat: latitude, lng: longitude}, { icon });
4

1 回答 1

3

这与 webkit 浏览器规范更相关,因此请在 ios Safari 上查看这篇帖子 SVG viewbox height issue并尝试以下解决方案,如果您的问题仍然存在,请告诉我们。

svg {
    width: 100%;
    height: 100%;
}
于 2020-01-20T09:19:54.983 回答