-1

スタイル付きマップの中心にマーカーを追加しようとしています (下)。

(申し訳ありませんが、構文を正しく取得できません)。


<!DOCTYPE html>
<html>
<head>
<link href="css/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>

var map;
var TDMP = new google.maps.LatLng(32.896187, -96.768493);

function initialize() 

{var roadAtlasStyles = 
[
    {
    featureType: 'road.highway',
    elementType: 'geometry',
    stylers: [
        { hue: '#355f7d' },
        { saturation: 60 },
        { lightness: -20 }
        ]
    },
    {
    featureType: 'road.arterial',
    elementType: 'all',
    stylers: [
        { hue: '#c0dfdc' },
        { lightness: -40 },
        { saturation: 100 }
        ]
    },
    {
    featureType: 'road.local',
    elementType: 'all',
    stylers: [
        { visibility: 'on' },
        { hue: '#f6ff00' },
        { saturation: 50 },
        { gamma: 0.7 },
        ]
    }
];

var mapOptions = {
zoom: 14,
center: TDMP,
mapTypeControlOptions: {
    mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'usroadatlas']
    }
};

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

var styledMapOptions = {
name: 'US Road Atlas'
};

var usRoadMapType = new google.maps.StyledMapType(
roadAtlasStyles, styledMapOptions);

map.mapTypes.set('usroadatlas', usRoadMapType);
map.setMapTypeId('usroadatlas');
}


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

</script>

</head>
<body>
<div id="map-canvas"></div>
</body>
</html>

投稿を読み、下のマップに例を追加しましたが、マーカーが表示されません。

ご協力ありがとうございました。

4

1 に答える 1

0

これにより、マップの中心にマーカーが配置されます。

<!DOCTYPE html>
<html>
<head>
<link href="css/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>

var map;
var TDMP = new google.maps.LatLng(32.896187, -96.768493);

function initialize() 

{var roadAtlasStyles = 
[
    {
    featureType: 'road.highway',
    elementType: 'geometry',
    stylers: [
        { hue: '#355f7d' },
        { saturation: 60 },
        { lightness: -20 }
        ]
    },
    {
    featureType: 'road.arterial',
    elementType: 'all',
    stylers: [
        { hue: '#c0dfdc' },
        { lightness: -40 },
        { saturation: 100 }
        ]
    },
    {
    featureType: 'road.local',
    elementType: 'all',
    stylers: [
        { visibility: 'on' },
        { hue: '#f6ff00' },
        { saturation: 50 },
        { gamma: 0.7 },
        ]
    }
];

var mapOptions = {
zoom: 14,
center: TDMP,
mapTypeControlOptions: {
    mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'usroadatlas']
    }
};

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

var styledMapOptions = {
name: 'US Road Atlas'
};

var marker = new google.maps.Marker({ 
    position: TDMP, 
    map: map, 
    title:"Hello World!" 
});`

var usRoadMapType = new google.maps.StyledMapType(
roadAtlasStyles, styledMapOptions);

map.mapTypes.set('usroadatlas', usRoadMapType);
map.setMapTypeId('usroadatlas');
}


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

</script>

</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
于 2013-09-23T19:16:34.343 に答える