javascript 如何更改 Gmaps.js 在 Google 地图中使用的图标?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13345894/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change the icon Gmaps.js uses in Google Maps?
提问by sergserg
How can I use the latest version of GMaps.jsto change the pin icon I set in code?
如何使用最新版本的GMaps.js更改我在代码中设置的图钉图标?
Here's what I'm trying to do:
这是我想要做的:
$('input[name="Address"]').blur(function () {
GMaps.geocode({
address: $('input[name="Address"]').val(),
callback: function (results, status) {
if (status == 'OK') {
var latlng = results[0].geometry.location;
map.setCenter(latlng.lat(), latlng.lng());
map.addMarker({
lat: latlng.lat(),
lng: latlng.lng(),
icon: {
image: "http://i.imgur.com/12312.png"
}
});
}
}
});
});
When running this script, the following errors flare up in Firebug's console:
运行此脚本时,Firebug 的控制台中会出现以下错误:
"NetworkError: 404 Not Found - http://localhost:17680/Account/undefined"
"NetworkError: 404 Not Found - http://localhost:17680/Account/undefined"
I don't understand why it's trying to HTTP GET that URL since I've never invoked it anywhere in the code.
我不明白为什么它会尝试通过 HTTP 获取该 URL,因为我从未在代码中的任何地方调用过它。
回答by sergserg
Changing the icon on a marker is quite simple.
更改标记上的图标非常简单。
If you read the documentation, notice it says:
如果您阅读文档,请注意它说:
Also, createMarker accepts any option defined in google.maps.MarkerOptions and any marker event defined in google.maps.Marker ('Events' section).
此外,createMarker 接受 google.maps.MarkerOptions 中定义的任何选项和 google.maps.Marker('Events' 部分)中定义的任何标记事件。
And if you read the Google documentation, it's just a matter of calling:
如果您阅读了 Google文档,只需调用以下代码即可:
icon: "some-url-here"
In my case it was:
就我而言,它是:
$('input[name="Address"]').blur(function () {
GMaps.geocode({
address: $('input[name="Address"]').val(),
callback: function (results, status) {
if (status == 'OK') {
var latlng = results[0].geometry.location;
map.setCenter(latlng.lat(), latlng.lng());
map.addMarker({
lat: latlng.lat(),
lng: latlng.lng(),
icon: "/images/mapicon.png"
});
$('input[name="Longitude"]').val(latlng.lng());
$('input[name="Latitude"]').val(latlng.lat());
}
}
});
});