如何找到 svg 路径的谷歌地图锚点?

may*_*ayk 4 svg google-maps google-maps-markers

问题与谷歌地图标记图标有关。如果我使用默认图标,图标的位置不会改变,但如果我使用 svg,标记的位置会发散。我想使用新的谷歌地图锚点来解决这个问题,但我不知道如何找到我的锚点svg。谁能告诉我这样做可以解决问题,或者我如何找到 svg 的锚点。路径如下。

路径:“M125 410 c-56 -72 -111 -176 -120 -224 -7 -36 11 -83 49 -124 76 -85 223 -67 270 31 28 60 29 88 6 150 -19 51 -122 205 -148 221 -6 3 -32 -21 -57 -54z m110 -175 c35 -34 33 -78 -4 -116 -35 -35 -71 -37 -105 -7 -40 35 -43 78 -11 116 34 41 84 44 120 7z",

geo*_*zip 5

根据文档

锚点设置符号相对于标记或多段线的位置。符号路径的坐标分别通过锚点的 x 和 y 坐标向左和向上平移。默认情况下,符号锚定在 (0, 0)。该位置以与符号路径相同的坐标系表示。

概念证明小提琴

代码片段:

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var marker = new google.maps.Marker({
    map: map,
    position: map.getCenter(),
    icon: {
      path: 'M125 410 c-56 -72 -111 -176 -120 -224 -7 -36 11 -83 49 -124 76 -85 223 -67 270 31 28 60 29 88 6 150 -19 51 -122 205 -148 221 -6 3 -32 -21 -57 -54z m110 -175 c35 -34 33 -78 -4 -116 -35 -35 -71 -37 -105 -7 -40 35 -43 78 -11 116 34 41 84 44 120 7z',
      fillColor: "blue",
      fillOpacity: 0.8,
      scale: 0.1,
      strokeColor: 'blue',
      strokeWeight: 1,
      anchor: new google.maps.Point(185, 500)

    }
  });
  var point = new google.maps.Marker({
    map: map,
    position: map.getCenter(),
    icon: {
      url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle.png",
      size: new google.maps.Size(7, 7),
      anchor: new google.maps.Point(3.5, 3.5)
    }
  });
}
google.maps.event.addDomListener(window, "load", initialize);
Run Code Online (Sandbox Code Playgroud)
html,
body,
#map_canvas {
  height: 500px;
  width: 500px;
  margin: 0px;
  padding: 0px
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>
Run Code Online (Sandbox Code Playgroud)