Google Maps API v3：为symbolPath传递图像而不是内置符号

Question

我刚刚了解了Google API提供的Symbol Animation。

我的代码中的每一件事都运行正常，但我只是想知道我是否可以在下面的代码中传递Image而不是符号。

var lineSymbol = {
    path: google.maps.SymbolPath.CIRCLE,
    scale: 8,
    strokeColor: '#393'
 };

如果是，我该怎么做？我尝试过传递Image路径和Image对象。什么工作..请帮帮我。

Answer 1

这是一个相当古老的帖子，但我试图解决这个问题时遇到了它，希望我收集的信息会有所帮助。 @jlivni是正确的，Symbol无法替换为图像。解决这个问题的方法是使用Polyline和Marker。您可以使用自定义标记替换标记图像并进行移动。

这种方法的好处是你可以使用新的标记点在标记之前/之后更改折线的外观，查看从标记到结束位置的eta信息等。

---

这些对于查看很有用，但很多都使用GMaps API v2：
http://econym.org.uk/gmap/
--especially：
---- http://econym.org.uk/gmap/example_cartrip.htm（简单，只是去目的地）
---- http://econym.org.uk/gmap/example_cartrip2.htm（背后有一条可见的折线痕迹）
---- http://econym.org.uk/gmap/example_cartrip3.htm（旋转使它始终面向道路，这就是我想要的）

http://www.geocodezip.com/
----尤其是：
---- http://www.geocodezip.com/v3_animate_marker_directions.html（这是API v3）
---- http://www.geocodezip.com/v3_animate_marker_xml.html（也是API v3通过xml动画而不是折线）

---

有用的脚本： v3_epoly.js取自http://www.geocodezip.com/scripts/v3_epoly.js。这个文件中的语法看起来像是直接破坏了，但我使用过的部分工作。如果你需要它可能想要通过手工修复它。 我还使用了谷歌小组论坛帖子中的Elabel3.js（我认为这是https://github.com/erunyon/ELabel）。它用于标记动画。它对我来说不起作用。我必须为我的程序更改onAdd（），draw（）和redraw（）。有关详细信息，请访问：https://developers.google.com/maps/documentation/javascript/reference#OverlayView

Answer 2

否 - 符号仅限于SVG路径，而不是任意图像。见https://developers.google.com/maps/documentation/javascript/3.exp/reference#Symbol

Answer 3

您可以将图片网址传递给google.maps.Icon对象，但google.maps.Symbol对象使用google.maps.SymbolPath或SVG路径。查找SVG路径语法。这是CS和InkScape等许多工具可以为您生成的标准。

请参阅提供SVG坐标的官方自定义SymbolPath example。