Googleマップのapiで少し作業を開始しました。マーカーを特定の場所に追加する方法を確認したかったのですが、私はその文書を読んで自分のウェブサイトに適用しようとしました多くの未定義エラーが出 これはコードGoogleマップapiが地図上にマーカーを追加する
function initMap() {
// Styles a map in night mode.
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 32.0225572, lng: 34.7766291},
zoom: 17,
mapTypeId: 'roadmap',
styles: [
{elementType: 'geometry', stylers: [{color: '#242f3e'}]},
{elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]},
{elementType: 'labels.text.fill', stylers: [{color: '#746855'}]},
{
featureType: 'administrative.locality',
elementType: 'labels.text.fill',
stylers: [{color: '#d59563'}]
},
{
featureType: 'poi',
elementType: 'labels.text.fill',
stylers: [{color: '#d59563'}]
},
{
featureType: 'poi.park',
elementType: 'geometry',
stylers: [{color: '#263c3f'}]
},
{
featureType: 'poi.park',
elementType: 'labels.text.fill',
stylers: [{color: '#6b9a76'}]
},
{
featureType: 'road',
elementType: 'geometry',
stylers: [{color: '#38414e'}]
},
{
featureType: 'road',
elementType: 'geometry.stroke',
stylers: [{color: '#212a37'}]
},
{
featureType: 'road',
elementType: 'labels.text.fill',
stylers: [{color: '#9ca5b3'}]
},
{
featureType: 'road.highway',
elementType: 'geometry',
stylers: [{color: '#746855'}]
},
{
featureType: 'road.highway',
elementType: 'geometry.stroke',
stylers: [{color: '#1f2835'}]
},
{
featureType: 'road.highway',
elementType: 'labels.text.fill',
stylers: [{color: '#f3d19c'}]
},
{
featureType: 'transit',
elementType: 'geometry',
stylers: [{color: '#2f3948'}]
},
{
featureType: 'transit.station',
elementType: 'labels.text.fill',
stylers: [{color: '#d59563'}]
},
{
featureType: 'water',
elementType: 'geometry',
stylers: [{color: '#17263c'}]
},
{
featureType: 'water',
elementType: 'labels.text.fill',
stylers: [{color: '#515c6d'}]
},
{
featureType: 'water',
elementType: 'labels.text.stroke',
stylers: [{color: '#17263c'}]
}
]
});
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var icons = {
info: {
icon: iconBase + 'info-i_maps.png'
}
};
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icons[feature.type].icon,
map: map
});
}
var feature = [
{
position: new google.maps.LatLng(32.0225572, 34.7766291),
type: 'info'
}];
addMarker(feature);
}
</script>
var myLatLng = new google.maps.LatLng(32.0225572, 34.7766291);
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: iconBase + 'שטיק-לוגו-07.png'
});
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icon,
map: map
});
}
var features = [
{
position: new google.maps.LatLng(32.0225572, 34.7766291),
type: 'info'
}
];
for (var i = 0, feature; feature = features[i]; i++) {
addMarker(feature);
}
https://jsfiddle.net/932j78og/1/
あなたはplunkerを提供することはできますか? – MarcoS
@MarcoSはそれを追加しました – ssabin
投稿されたコードでJavaScriptエラーが発生しました。 – geocodezip