javascript - 绘制谷歌地图形状标记对象

Question

嗨，我正在尝试使用谷歌地图标记形状属性创建一个可点击区域，但我有点难以绘制它并找到正确的坐标来放置它。我有一个大的导入 svg，我希望它位于该 svg 的中心。有没有一种方法或程序可以让我利用它来看看我到底在做什么？因为目前我只是盲目地试图通过随机改变坐标来获得中心。或者至少让它有一种颜色，这样我在改变它时就能看到它在哪里。根据API，它遵循w3 AREA坐标规范，但说实话我仍然不太明白。

var iconUrl = "data:image/svg+xml;charset=utf-8," + escape(document.getElementById("builtMarker").innerHTML);
    var sizeX = 200;
    var sizeY = 200;
    var icon = {
        url: iconUrl,
        scaledSize: new google.maps.Size(sizeX, sizeY),

        anchor: new google.maps.Point(sizeX / 2, sizeY / 2)
    };
var marker = new google.maps.Marker({        
        position: myLatLng,
        map: map,
        draggable: false,
        icon: icon,           
        shape: { 
            type: 'circle',
            coords: [184, 200, 60],
         } 

    });

所以本质上我想知道这些人是如何弄清楚在哪里以及如何使形状位于正确的位置 fiddle

Answer 1

好吧，这个特定问题的答案是谷歌地图形状根据此 answer 工作。因此，如果您转到底部，您可以看到坐标的定义是什么，例如，对于圆，它被定义为 x,y,radius