Google Maps und Yandex Maps funktionieren nicht richtig

Wenn ich versuche, eine Map in meine WordPress-Seite einzufügen, bekomme ich nur ein graues Feld mit einigen Steuerelementen wie auf dem Bild zu sehen: Bildbeschreibung hier eingeben

Egal, wie ich auf die Seite gesetzt habe: mit einem speziellen Plugin oder mit meinem eigenen Java-Code. Ich benutze WordPress 3.2.1 und ich habe versucht Google Maps für WordPress Version 1.0.3 und Yandex Maps für WordPress Version 1.3.1 Plugins sowie und meinen eigenen Code (ich füge es in den Körper der Seite in HTML ein Modus):

  window.onload = function () { var mapHybrid = new YMaps.Map(document.getElementById("YMapsHybridTypeId")); var mlHybrid = new YMaps.YMapsML("http://maps.yandex.ru/export/usermaps/jR_c2iaexA-htEui33mTTEmko4oPpRS-/"); mapHybrid.addOverlay(mlHybrid); mapHybrid.setCenter(new YMaps.GeoPoint(-1,-1)); }  

Ich habe das Problem unter verschiedenen Browsern getestet: Opera 10.51, Google Chrome, IE8

Solutions Collecting From Web of "Google Maps und Yandex Maps funktionieren nicht richtig"

Diese Fehler stammen von CSS-Regeln aus Ihrem WordPress-Theme, die auch auf Elemente auf der Karte angewendet werden. Auf Ihrer Seite konnte ich beispielsweise das Popup reparieren, indem ich die # #content table und die #content table #content tr th Regeln deaktiviere, die zusätzliche Ränder hinzufügen. In einem Test-Setup habe ich sogar graue Lücken zwischen den Kacheln wegen .entry-content img { max-width: 97.5% } in Twenty Eleven bekommen.

Karte mit Lücken zwischen den Fliesen

Wahrscheinlich wäre die einfachste Lösung, die Map in einen Iframe einzubetten, so dass die CSS-Hauptregeln dort nicht angewendet werden (ich weiß nicht, ob Sie das mit der API tun können). Wenn dies für Ihre Situation nicht akzeptabel ist, können Sie zusätzliche Regeln .entry-content .map-canvas img {max-width: none} , die die WordPress-Regeln für Maps rückgängig machen (zB .entry-content .map-canvas img {max-width: none} ), oder die Kartenanbieter .entry-content .map-canvas img {max-width: none} expliziter hinzuzufügen Regeln (mit !important ) zu den Style Sheets, die sie zur Verfügung stellen.

Aus dem von Ihnen bereitgestellten Schnelltest-Snippet wird die Karte scheinbar korrekt eingebettet. Es gibt nichts auf dieser Karte, weil Marker auf die Mitte von Nirgendwo zeigt, können Sie einige Straße sehen, wenn Sie herumziehen.

Fügst du das in den Körper der Seite ein? Im HTML-Modus?

Es wp_enqueue_script() , wp_enqueue_script() , wenn Sie mit Skripten in WordPress arbeiten. Ihr Beispiel scheint jedoch zu funktionieren, so dass das Problem möglicherweise nicht behoben wird.

Aktualisieren

Eingeschränkt auf Twenty Eleven Thema.