[英]Add local image as custom marker in google maps
我正在尝试使用谷歌地图创建自定义标记。
var iconBase = //some url;
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: iconBase + 'marker.png'
});
这基本上有效。 我在谷歌驱动器中托管我的图像。 这很好,但有点慢,单击地图并渲染标记后第一次加载图像需要大约 500-700 毫秒。 所以我试图在本地添加图像,遗憾的是,我似乎无法找到有关此图像的资源。 如何使用本地(在我的项目目录中)图像?
假设我将它放在与我调用谷歌地图服务的 php 文件相同目录级别的文件夹“icons”中,如果有帮助的话。 谢谢!
更新!
我试过:
maker = new google.maps.Marker({
position: location,
map: globalMap,
icon : "pubIcons/male-2.png"
});
其中pubIcons是与我渲染地图的 php 文件位于同一目录中的文件夹。 我收到此错误:
GET http://localhost/bims-2.0/index.php/location/view/pubIcons/male-2.png 404 (Not Found)
它有点像pubIcons/male-2.png是我的控制器“视图”中的一个动作,我正在使用 Yii 顺便说一句。
试试这个代码:)
var image = "https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQxFoh469eOsZQkuPOLpZn3R6yyIExkZCxOxf4ywfeY3v330EwP3Q";
var marker = new google.maps.Marker({
position: location,
map: globalMap,
icon: image
});
更新
var image = "http://yourdomain.com/image/image.php";
或者
icon : "/pubIcons/male-2.png"
我也遇到了这个问题,但以不同的方式解决了它。 我将 Django 用于我的 Web 框架,而 Django 使用一个名为 static 的目录。 不知道这个目录是否可以在 Django 之外使用。 我将图片加载到我的静态文件和我网页的正文标签中,有代码
<div style="display:none">
`<img src="{% static 'map/CrocMarker_45.png' %}" alt="Croc Marker" id="crocMark">`
</div>
在这种情况下,我将显示设置为无,因为我不想在 body 标签中渲染图片,只想加载它以便我可以在我的地图脚本中访问它。
在我的function initMap()
我创建了变量var crocMark=document.getElementById("crocMark").src;
.
稍后,当您创建标记时,您只需将图标设置为此变量即可。 例如:
var XMarker=new google.maps.Marker({ position: location, map: map_name, icon: crocMark });
这可能不是最好的方法,但它对我很有用,我希望它也适用于你。
编辑:请注意,如果不清楚,这是我的项目结构。
Project Root "Django">Django Root "Django_Project">My apps e.g. "map">static>map
google.maps.Marker
的icon
参数需要一个 URL。 通过指定"pubIcons/male-2.png"
,您提供了相对于您所在页面的相对 URL。
如果要从本地文件系统指定文件,则需要使用文件 URL,例如: "file:///var/www/pubIcons/male-2.png"
或文件位于本地的任何位置文件系统。 当然,如果您从本地机器加载 javascript,您将只能访问本地文件。
完整示例:
maker = new google.maps.Marker({
position: location,
map: globalMap,
icon : "file:///var/www/pubIcons/male-2.png"
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.