0

我在实现 Google Maps APi 样式的地图时遇到了一点麻烦，我可以通过删除 var 样式和 map.setoptions 来使位置和自定义标记正常工作）但是当我尝试将 google 样式编码重新添加到地图中时不再有效，有什么想法吗？

<script type="text/javascript">
      function initialize() {
        var styles = [ 
          { 
          featureType: "water", 
          elementType: "geometry.fill",
          stylers: [ 
            { color: "#73b6e6" }
            ] 
            },{
          featureType: "road.highway",
          elementType: "geometry.fill",
          stylers: [ 
            { color: "#ffffff" } 
            ] 
            },{
          featureType: "road.highway",
          elementType: "geometry.stroke",
          stylers: [
            { color: "#c8c8c8" }
            ] 
            },{
          featureType: "road.local",
          stylers: [ 
            { color: "#ffffff" } 
            ] 
            },{
          featureType: "road.arterial",
          elementType: "geometry.fill", 
          stylers: [ 
            { color: "#ffffff" } 
            ] 
            },{
          featureType: "road.arterial",
          elementType: "geometry.stroke",
          stylers: [ 
            { color: "#c8c8c8" } 
            ] 
            },{
          featureType: "road.highway",
          elementType: "labels.text.stroke",
          stylers: [ 
            { visibility: "off" } 
            ] 
            },{
          featureType: "road.arterial", 
          elementType: "labels.text.stroke",
          stylers: [ { visibility: "off" } 
            ] 
            },{
          featureType: "poi",
          elementType: "labels",
          stylers: [ { "visibility": "off" } 
            ] 
            },{
          featureType: "poi.park",
          stylers: [ { color: "#cae6a9" } 
            ] 
            },{
          featureType: "administrative.neighborhood",
          elementType: "labels.text.fill",
          stylers: [ { "visibility": "off" } 
            ] 
            }
        ];
        map.setOptions({styles: styles});
        var mapOptions = {
          center: new google.maps.LatLng(-34.94533,138.58934),
          zoom: 14,
          scrollwheel: false,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("location-map"),
            mapOptions);
        var image = 'images/main/location.png';
        var myLatLng = new google.maps.LatLng(-34.94533,138.58934);
        var beachMarker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image
        });
      };
    </script>

HTML 代码

<div id="location-map" style="background-color: #E5E3DF; overflow: hidden;">
</div>
4

1 回答 1

1

map var 在您创建之前不存在，但您在此行之前调用 map.setOptions：

var map = new google.maps.Map(document.getElementById("location-map"),
            mapOptions);

只需移动这一行：

map.setOptions({styles: styles});

在这个之后：

var map = new google.maps.Map(document.getElementById("location-map"),
            mapOptions);
于 2013-01-28T00:24:58.690 回答