Google Maps API v3:为symbolPath传递图片而不是内置符号 [英] Google Maps API v3: Passing an Image for symbolPath rather than a inbuilt symbol

查看:191
本文介绍了Google Maps API v3:为symbolPath传递图片而不是内置符号的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我刚了解符号动画由Google API提供。



在我的代码中,每件事都可以正常工作,但我只想知道在下面的代码中是否可以传递图像而不是符号。

  var lineSymbol = {
路径:google.maps.SymbolPath.CIRCLE,
比例:8,
strokeColor:'#393'
};

如果是,我该怎么做?我试过传递图像路径和图像对象。 NOthing Working ..请帮助我。

解决方案

这是一个相当老的帖子,但我试图解决这个问题时遇到了它问题,希望我收集的信息将有所帮助。 @jlivni是正确的,符号不能用图像替换。要做到这一点的方法是使用折线和标记。您可以用自定义标记替换标记图像并进行移动。



这种方法的好处是您可以使用新的标记点来改变您的外观$ / $>
$ b




这些对于标记之前/之后的多段线,请参阅从标记到结束位置的eta信息。看看,但其中许多人使用GMaps API v2:

http://econym.org。 uk / gmap /

- 特别是:

---- 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 (也是通过xml非折线API v3动画)






有用的脚本:
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


I just got to know about the Symbol Animation offered by Google API.

Every thing is working fine in my code but I just want to know if I can pass a Image instead of a symbol in the below code.

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

If yes, How can I do that? I've tried passing Image paths and Image objects. NOthing worked.. Please help me out.

解决方案

This is a fairly old post but I ran into it while trying to solve this problem, hopefully the info I've gathered will be of help. @jlivni is correct that Symbol can't be replaced with an image. The method to go about this is use Polyline and Marker. You can replace the marker image with your custom one and have that move.

The nice thing about this method is you can use your new marker point to change the look of your polylines before/after your marker, see eta info from your marker to the end location, etc.


These are useful to look over but many of them use GMaps API v2:
http://econym.org.uk/gmap/
--especially:
----http://econym.org.uk/gmap/example_cartrip.htm (simple, just goes to destination)
----http://econym.org.uk/gmap/example_cartrip2.htm (has a visible polyline trail behind it)
----http://econym.org.uk/gmap/example_cartrip3.htm (rotates so it's always facing the road, this is what I wanted)

http://www.geocodezip.com/
----especially:
----http://www.geocodezip.com/v3_animate_marker_directions.html (this is API v3)
----http://www.geocodezip.com/v3_animate_marker_xml.html (also API v3 animates via xml not polyline)


Useful scripts: v3_epoly.js taken from http://www.geocodezip.com/scripts/v3_epoly.js. The syntax in this file looks like it's straight up broken but the parts of it I've used work. Probably want to go through this by hand to fix it up if you need it. I also used Elabel3.js from a google group forum post (I think this is it https://github.com/erunyon/ELabel). It's used for the marker animation. It didn't work for me out of the box. I had to make changes to onAdd(), draw() and redraw() for my program. More info on that here: https://developers.google.com/maps/documentation/javascript/reference#OverlayView

这篇关于Google Maps API v3:为symbolPath传递图片而不是内置符号的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆