2016-09-05 4 views
-2

Ich muss die Markierungen in Google Map mit dem Ajax-Aufruf dynamisch festlegen. Wie es möglich istWie setze ich den Marker auf Google Map mit Ajax?

Ich brauche den Code dafür.

Ich möchte Ajax Anruf Google Karte zu aktualisieren.

Update der Marker dynamisch mit AJAX

var locations = [['spain',-41.054502,160.136719,'Uk',35.666222 ,39.019184],['china',58.025555,87.714844,'United Stat',35.666222 ,-44.472656],['Hong Kong',62.057586,44.121094,'United Stat',12.801088,18.457031],['Hong Kong',40.4523,102.128906,'United Stat',35.666222 ,-70.472656],['Hong Kong',28.526622,-76.816406,'United Stat',35.666222 ,-65.472656],['Hong Kong',28.526622,-76.816406,'United Stat',35.666222 ,-40.472656],['Hong Kong',28.526622,-45.816406,'United Stat',35.666222 ,-44.472656],['Hong Kong',28.526622,-24.816406,'United Stat',35.666222 ,-44.472656],['Hong Kong',28.526622,-76.816406,'United Stat',35.666222 ,-44.472656],['Hong Kong',28.526622,-76.816406,'United Stat',35.666222 ,-44.472656]]; 
function initialize() { 
var styledMapType = new google.maps.StyledMapType( 
[ 
{ 
"featureType": "all", 
"elementType": "labels.text.fill", 
"stylers": [ 
{ 
"saturation": 36 
}, 
{ 
"color": "#ffffff" 
}, 
{ 
"lightness": 40 
} 
] 
}, 
{ 
"featureType": "all", 
"elementType": "labels.text.stroke", 
"stylers": [ 
{ 
"visibility": "on" 
}, 
{ 
"color": "#000000" 
}, 
{ 
"lightness": 16 
} 
] 
}, 
{ 
"featureType": "all", 
"elementType": "labels.icon", 
"stylers": [ 
{ 
"visibility": "off" 
} 
] 
}, 
{ 
"featureType": "administrative", 
"elementType": "geometry.fill", 
"stylers": [ 
{ 
"color": "#ffffff" 
}, 
{ 
"lightness": 20 
} 
] 
}, 
{ 
"featureType": "administrative", 
"elementType": "geometry.stroke", 
"stylers": [ 
{ 
"color": "#ffffff" 
}, 
{ 
"lightness": 17 
}, 
{ 
"weight": 1.2 
} 
] 
}, 
{ 
"featureType": "landscape", 
"elementType": "geometry", 
"stylers": [ 
{ 
"color": "#000000" 
}, 
{ 
"lightness": 20 
} 
] 
}, 
{ 
"featureType": "poi", 
"elementType": "geometry", 
"stylers": [ 
{ 
"color": "#ffffff" 
}, 
{ 
"lightness": 21 
} 
] 
}, 
{ 
"featureType": "road.highway", 
"elementType": "geometry.fill", 
"stylers": [ 
{ 
"color": "#000000" 
}, 
{ 
"lightness": 17 
} 
] 
}, 
{ 
"featureType": "road.highway", 
"elementType": "geometry.stroke", 
"stylers": [ 
{ 
"color": "#000000" 
}, 
{ 
"lightness": 29 
}, 
{ 
"weight": 0.2 
} 
] 
}, 
{ 
"featureType": "road.arterial", 
"elementType": "geometry", 
"stylers": [ 
{ 
"color": "#000000" 
}, 
{ 
"lightness": 18 
} 
] 
}, 
{ 
"featureType": "road.local", 

i verwendet diesen Code für die Aktualisierung von Markern

+0

dies ist kein Code schriftlich Service. pls bieten, was Sie versucht haben, können wir helfen, es zu beheben. – Iceman

Antwort

1

Sie so etwas tun sollte. Da ich Sie machen wollen nicht den Ajax-Aufruf weiß verspottete ich es und ich rufe die fakeAjaxCall Funktion, die ein lat-lng Objekt zurückgibt, wie am Beispiel gezeigt

//This is the fake ajax call we are supposed to call 
var fakeAjaxCall = function(success, error) { 
    var response = {lat: 59.327, lng: 18.067}; 
    window.setTimeout(success.bind(null, response), 1000); 
} 

//Our map object is already initialized, no marker is there yet. 
var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 13, 
    center: {lat: 59.325, lng: 18.070} 
}); 

//Here we make the ajax call. We expect a lat-lng response like the one from fake ajax call 
fakeAjaxCall(function success(responseMarker){ 
    var marker = new google.maps.Marker({ 
    position: responseMarker, 
    map: map, 
    title: 'Hello World!' 
    }); 
})