我使用API v3使用自定义样式获得了Google地图。问题是我正在向地图添加一个标记来显示一个Location.But当页面加载时,标记会显示几分之一秒然后消失。我使用下面的脚本来创建地图。
请让我知道我该怎么做才能解决这个问题?
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', init);
function init() {
var mapOptions = {
zoom: 14,
center: new google.maps.LatLng(19.235116, 72.8551),
styles: [{featureType:"landscape",stylers:[{saturation:-100},{lightness:65},{visibility:"on"}]},{featureType:"poi",stylers:[{saturation:-100},{lightness:51},{visibility:"simplified"}]},{featureType:"road.highway",stylers:[{saturation:-100},{visibility:"simplified"}]},{featureType:"road.arterial",stylers:[{saturation:-100},{lightness:30},{visibility:"on"}]},{featureType:"road.local",stylers:[{saturation:-100},{lightness:40},{visibility:"on"}]},{featureType:"transit",stylers:[{saturation:-100},{visibility:"simplified"}]},{featureType:"administrative.province",stylers:[{visibility:"off"}]/**/},{featureType:"administrative.locality",stylers:[{visibility:"on"}]},{featureType:"administrative.neighborhood",stylers:[{visibility:"on"}]/**/},{featureType:"water",elementType:"labels",stylers:[{visibility:"on"},{lightness:-25},{saturation:-100}]},{featureType:"water",elementType:"geometry",stylers:[{hue:"#ffff00"},{lightness:-25},{saturation:-97}]}]
};
var map = new google.maps.Map(document.getElementById('map'), mapOptions);
var myLatlng = new google.maps.LatLng(19.235116, 72.8551);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(19.235116, 72.8551),
map: map,
title: 'Photonics Enterprise'
});
var mapElement = document.getElementById('map');
var map = new google.maps.Map(mapElement, mapOptions);
}
</script>
答案 0 :(得分:0)
问题是你正在重写你刚刚创建的地图,因此你在代码执行结束时获得一张新的空地图
试试这个:
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', init);
function init() {
//map options
var mapOptions = {
zoom: 14,
center: new google.maps.LatLng(19.235116, 72.8551),
styles: [{featureType:"landscape",stylers:[{saturation:-100},{lightness:65},{visibility:"on"}]},{featureType:"poi",stylers:[{saturation:-100},{lightness:51},{visibility:"simplified"}]},{featureType:"road.highway",stylers:[{saturation:-100},{visibility:"simplified"}]},{featureType:"road.arterial",stylers:[{saturation:-100},{lightness:30},{visibility:"on"}]},{featureType:"road.local",stylers:[{saturation:-100},{lightness:40},{visibility:"on"}]},{featureType:"transit",stylers:[{saturation:-100},{visibility:"simplified"}]},{featureType:"administrative.province",stylers:[{visibility:"off"}]/**/},{featureType:"administrative.locality",stylers:[{visibility:"on"}]},{featureType:"administrative.neighborhood",stylers:[{visibility:"on"}]/**/},{featureType:"water",elementType:"labels",stylers:[{visibility:"on"},{lightness:-25},{saturation:-100}]},{featureType:"water",elementType:"geometry",stylers:[{hue:"#ffff00"},{lightness:-25},{saturation:-97}]}]
};
//creating map
var map = new google.maps.Map(document.getElementById('map'), mapOptions);
// creating latlng object
var myLatlng = new google.maps.LatLng(19.235116, 72.8551);
// creating marker and binding it to the map you have just created
var marker = new google.maps.Marker({
position: new google.maps.LatLng(19.235116, 72.8551),
map: map,
title: 'Photonics Enterprise'
});
// don't recreate the map, because you'll loose all objects in the map created above!!
//var mapElement = document.getElementById('map');
//var map = new google.maps.Map(mapElement, mapOptions);
}
</script>