我正在尝试为我目前在Google地图上设置的图钉创建新标记。我已经按照文档中的示例进行操作,但仍然使用旧的红色引脚。
这是仅针对标记的代码:
var myLatLng = new google.maps.LatLng(51.521616, -0.102589);
var marker = 'marker.png';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
这是整个地图脚本。
google.maps.event.addDomListener(window, 'load', init);
function init() {
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(51.521616, -0.102589),
styles: [ {"featureType":"all", "stylers":[ {"saturation":0}, {"hue":"#e7ecf0"} ] }, {"featureType":"road", "stylers":[ {"saturation":-70} ] }, {"featureType":"transit", "stylers":[ {"visibility":"on"} ] }, {"featureType":"poi", "stylers":[ {"visibility":"off"} ] }, {"featureType":"water", "stylers":[ {"visibility":"simplified"}, {"saturation":-60} ] }]
};
var myLatLng = new google.maps.LatLng(51.521616, -0.102589);
var mapElement = document.getElementById('map');
var map = new google.maps.Map(mapElement, mapOptions);
var marker = 'marker.png';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
我哪里出错了?是否与我添加的其他地图选项有关?
我使用的是Google Maps API v3
答案 0 :(得分:1)
你的代码中有一个拼写错误(你正在覆盖“标记”,应该是“图像”)。变化:
var marker = 'marker.png';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
要:
var image = 'marker.png';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
google.maps.event.addDomListener(window, 'load', init);
function init() {
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(51.521616, -0.102589),
styles: [{
"featureType": "all",
"stylers": [{
"saturation": 0
}, {
"hue": "#e7ecf0"
}]
}, {
"featureType": "road",
"stylers": [{
"saturation": -70
}]
}, {
"featureType": "transit",
"stylers": [{
"visibility": "on"
}]
}, {
"featureType": "poi",
"stylers": [{
"visibility": "off"
}]
}, {
"featureType": "water",
"stylers": [{
"visibility": "simplified"
}, {
"saturation": -60
}]
}]
};
var myLatLng = new google.maps.LatLng(51.521616, -0.102589);
var mapElement = document.getElementById('map');
var map = new google.maps.Map(mapElement, mapOptions);
var image = 'http://maps.google.com/mapfiles/ms/icons/blue.png';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
}
html,
body,
#map {
height: 100%;
width: 100%;
}
<script src="http://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>