1

私はこのフォーラムに不慣れで、現在この定型化された Google マップに問題があります。本来あるべき姿が現れていません。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MY_OWN_KEY&sensor=false"></script> 
<script type="text/javascript">
    function initialize() {

        // Create an array of styles.
        var styleArray = [
            {
                "featureType": "water",
                "stylers": [
                  { "saturation": -100 },
                  { "lightness": -32 }
                ]
            },{
                "featureType": "road",
                "stylers": [
                  { "saturation": -100 }
                ]
            },{
                "featureType": "landscape.natural.landcover",
                "stylers": [
                  { "saturation": -100 },
                  { "lightness": 63 }
                ]
            },{
                "featureType": "poi",
                "stylers": [
                  { "lightness": 4 },
                  { "saturation": -100 }
                ]
            }
        ]

        // Create a new StyledMapType object, passing it the array of styles,
        // as well as the name to be displayed on the map type control.
        var styledMap = new google.maps.StyledMapType(styles,
            {name: "Styled Map"});

        // Create a map object, and include the MapTypeId to add
        // to the map type control.
        var mapOptions = {
            zoom: 17,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeControlOptions: {
                mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
            }
        };

        var map = new google.maps.Map(document.getElementById('map'),
            mapOptions);

        //Associate the styled map with the MapTypeId and set it to display.
        map.mapTypes.set('map_style', styledMap);
        map.setMapTypeId('map_style');
    }
</script>

HTMLは次のとおりですが、

<div id="map" style="width: 100%; height: 500px"></div>

うまくいけば、ここの達人がこれで私を助けてくれるでしょう。どうもありがとう。

4

1 に答える 1

0

ここに 2 つのバグがあります。

どこにも呼び出しを行っていないinitialize()ため、JavaScript コードは実行されません。スクリプトの最後に次の行を追加します。

google.maps.event.addDomListener( window, 'load', initialize );

それを修正した後、開発者ツールを開いた状態でページをロードするとstyles、配列に名前を付けたため、未定義のエラーが表示されますstyleArray。一致するようにどちらかを変更すると、マップが読み込まれます!

于 2013-04-06T09:22:16.217 に答える