Google Maps v3 - Uncaught TypeError: Cannot read property 'Marqueur' undefined
J'ai ma carte div
conteneur toujours sur la page:
<div id="map_canvas"></div>
au début, j'essayais d'ajouter ce pour les DOM dans l'ajax de rappel aswell mais a avoir des ennuis donc décidé de la rendre statique pour l'instant.
Je suis en train d'initialiser la carte de jquery ajax rappel
...
complete: function(data) {
//build the map
$.getScript("http://maps.google.com/maps/api/js?v=3&libraries=geometry&sensor=false®ion=uk&async=2&callback=MapApiLoaded", function () {});
running = false;
if(running) return false;
running = true;
setMarkers();
flightPath.setMap(null); //Remove polyline
flightPathProgress.setMap(null); //Remove polyline
setTimeout(function() {
flightPath.setMap(map);
flightPathProgress.setMap(map);
flightPathProgress.setOptions({
strokeOpacity: 0
});
var progress = 0;
var intvl = setInterval(function(){
progress += 0.01;
if(progress > 1) {
clearInterval(intvl);
running = false;
} else {
}
//Calc progress
var progressLatLng = google.maps.geometry.spherical.interpolate(userlatlng, serverlatlng, progress);
//Update polyline
flightPathProgress.setOptions({
strokeOpacity: progress,
path: [userlatlng, progressLatLng]
});
}, 50);
}, 1000);
}
J'ai aussi le suivant, en dehors du document prêt de la fonction
var map;
var serverlatlng;
var userlatlng;
var servermarker;
var usermarker;
var flightPath;
var flightPathProgress;
var running;
function MapApiLoaded() {
serverlatlng = new google.maps.LatLng(34.0625, -118.123);
userlatlng = new google.maps.LatLng(54.167, -4.48211);
var centerlatlng = new google.maps.LatLng(44.0835, -61.241055);
//Create the map
var myOptions = {
center: centerlatlng,
mapTypeId: google.maps.MapTypeId.TERRAIN,
panControl: false,
zoomControl: false,
streetViewControl: false,
mapTypeControl: false
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
//Centre map on user and server locations
var bounds = new google.maps.LatLngBounds();
bounds.extend(serverlatlng);
bounds.extend(userlatlng);
map.fitBounds(bounds);
//The grey outline path
flightPath = new google.maps.Polyline({
path: [userlatlng,serverlatlng],
strokeColor: "#666",
strokeOpacity: 0.5,
strokeWeight: 4,
geodesic: true,
zIndex: 1
});
//The red progress path
flightPathProgress = new google.maps.Polyline({
path: [userlatlng,userlatlng],
strokeColor: "#ff0000",
strokeOpacity: 0,
strokeWeight: 4,
geodesic: true,
zIndex: 2
});
}
function setMarkers() {
if(servermarker != undefined) servermarker.setMap(null); //Remove marker if exists
servermarker = new google.maps.Marker({
position: serverlatlng,
map: map,
title:"Server",
animation: google.maps.Animation.DROP,
icon: 'images/marker.png'
});
if(usermarker != undefined) usermarker.setMap(null); //Remove marker if exists
usermarker = new google.maps.Marker({
position: userlatlng,
map: map,
title:"User",
animation: google.maps.Animation.DROP,
icon: 'images/marker.png'
});
}
Le message d'erreur que j'obtiens est Uncaught TypeError: Cannot read property 'Marker' of undefined
.
La pleine étendue message est
Uncaught TypeError: Cannot read property 'Marker' of undefined
www.domain.co.uk/:345
setMarkers www.domain.co.uk/:345
$.ajax.complete www.domain.co.uk/:242
fire jquery.js:3064
self.fireWith jquery.js:3176
done jquery.js:8259
callback`
Vous devez vous connecter pour publier un commentaire.
Que vous essayez d'utiliser l'API Google Maps constructeur de google.cartes.Marqueur avant de l'API est chargé.
Mise à jour:
le setMarkers fonction est en cours d'exécution avant que l'API est chargé.
getScript
tourne et déclenche le rappel.Apparemment c'est un bug dans la nouvelle version de Google Maps mise à jour. Il semble que l'effet de ces utilisateurs qui ont la nouvelle version de maps. Pour eux, le marqueur ne sera pas même sur l'api de google échantillon de code: https://developers.google.com/maps/documentation/javascript/examples/marker-simple
Le développeur de la console auront le Uncaught TypeError: Type d'erreur
si vous vous déconnecter de google et de voir la même page, vous êtes plus susceptible de voir le marqueur
J'ai résolu ce problème car j'ai été absent de la géométrie à partir de la fin de cette url
si vous ne disposez pas d'un compte d'affaires, il peut aussi vous donner cette erreur qui vient de cette réponse du serveur:
Ce qui signifie que soit vous chargez de l'api trop de fois par jour/trop concentrée ou que vous essayez de charger de nombreuses adresses. De vérifier la réponse du serveur et de voir si vous l'obtenez.
Cette réponse particulière sera également à l'origine de cette erreur.
Ici vous pouvez trouver quelques conseils qui pourraient vous aider. https://developers.google.com/maps/documentation/business/articles/usage_limits
Je pense que vous devez charger le JS de l'API google maps à l'aide d'un "script" tag, et NON à l'aide de $.getScript.
Selon le jQuery API docs (http://api.jquery.com/jQuery.getScript/), getScript charge un fichier JavaScript à partir du serveur à l'aide d'une requête HTTP GET, puis l'exécute.
Ce n'est probablement pas la bonne façon de chargement de la Gmaps API JS. Notez que la documentation pour la GMaps API dit, "l'URL contenue dans La balise script est l'emplacement d'un fichier JavaScript qui se charge de tous les symboles et définitions dont vous avez besoin pour l'utilisation de l'API Google Maps. Cette balise script est nécessaire. [Pour charger de manière asynchrone, l'API JS], vous pouvez injecter votre propre étiquette en réponse à une fenêtre.événement onload ou un appel de fonction, mais vous avez besoin de charger les Maps API JavaScript de bootstrap pour retarder l'exécution de votre code d'application jusqu'à ce que les Maps JavaScript API code est entièrement chargé. Vous pouvez le faire en utilisant le paramètre de rappel, qui prend comme argument de la fonction à exécuter à la fin du chargement de l'API."
Vous pouvez voir la gmaps API docs ici: https://developers.google.com/maps/documentation/javascript/tutorial
Dans mon cas, je n'ai la suite. Notez que le paramètre de rappel est nécessaire pour faire ce travail: