OSM Einbindung -> Keine Anzeige im IE

Guten Abend,

habe folgendes Problem.
In meine Webseite will ich eine OSM einbauen mit beliebig vielen Marker. Klappt auch soweit. In Firefox wird alles super dargestellt, ich kann zoomen und verschieben.

Im IE (Version 11) jedoch wird nichts angezeigt. Es gibt ein Script-Problem.
Nachdem ich dort in der Karte auf das “+” Zeichen gehe und “Meine Orte” ausschalte, so wird die Karte zum Teil eingeblendet, jedoch natürlich eine meine Marker und sehr fehlerhaft.

Muss eine private Homepage fürs Studium erstellen und die Einbindung der OSM ist der letzte Schritt, aber die Darstellung funktioniert im IE nicht…

Warum gibt es im IE diese Probleme und wie kann ich diese beheben?

Ich habe folgende Anleitung benutzt:
http://wiki.openstreetmap.org/wiki/Openlayers_POI_layer_example

Vielen Dank schonmal im Vorraus! :wink:

Grüße
Sebastian

Nahmd,

Der IE reagiert anders als der FF allergisch auf überzählige ",":

x = {
a: 1,
b: 2,
c: 3, ←←← überzähliges “,”
};

ist für FF ok, der IE wirft eine Skript-Fehler und bricht ab. Das gilt auch für “[ … ]”.

Gruß Wolf

Danke für deine Antwort.

Das habe ich so verstanden.
Nur wo taucht dieses Problem in diesem Code auf? steh grad aufm Schlauch…

Gruß Sebastian

Nahmd,

Da ich Deinen Code nicht sehen kann, kann ich die Frage nicht beantworten.

Gruß Wolf

Hier der HTML Code:

Hier die CSS:

Sebastian

Naja, das der IE gerne eine Sonderbehandlung möchte ist ja nichts neues. Schreib doch einfach drunter, dass wenn nichts angezeigt wird, einfach auf einen anderen guten Browser gewechselt werden soll. :wink: Ich mein, entweder man hat sauberen Code oder nicht. Da irgendwelche Ausnahmen für den IE zu schreiben…naja, wer es sich nicht leisten kann auf solche Besucher zu verzichten. :wink: Aber so wird MS halt nicht gerade unter Druck gesetzt…
Sorry für Off-Topic. :stuck_out_tongue:

In IE funktionieren einige Dinge nicht oder anders.

Er macht z.B. auch Größenberechnungen für die map div anders was manchmal zum Verschwinden der Karte führen kann.

Bin auch der Ansicht: Anständigen Browser benutzen. :slight_smile:

bye, Nop

stimmt schon. Bei mir kommt der IE auch nicht zum Einsatz.

Nur sollte eine Webseite ja eigentlich in allen Browsern ohne Fehler funktionieren.

Weiß halt nicht wie mein Prof. das sieht, wenn ich dem das einfach nur so hinschreibe, dass es im IE Probleme gibt.

ich denke es liegt an der eingebundenen textfile, in der ich meine markierten Orte gespeichert habe.

Im Google Chrome Browser wird die OSM Karte korrekt dargestellt, jedoch fehlen die Marker in der Karte.

Im IE lädt die Karte auch (wenn auch nur teilweise) sobald die der Haken bei den Marker-Orten draußen ist.

Nahmd,

Dann hat das Skript nach Erzeugung der Karte und vor Einbindung der Icons einen Fehler geworfen.

Möglicherweise ist das hier hilfreich.
Ich habe es mit dem IE11 getestet, es gibt das ganze Paket als Zip.

Gruß Wolf

Schonmal vielen vielen Dank für deine Hilfe und Mühe!

Dein Link funktioniert sowohl im IE als auch GoogleChrome, hammer!

Ich werde morgen meine Seite umbauen und dann testen.

Was genau war bei meinem ursprünglichen Code fehlerhaft bzw. wie bist du auf einen richtigen Lösungsweg gekommen?

Gruß Sebastian

edit//
Den Javascript Teil kann ich doch in eine extra js Datei legen oder? und dann im HTML Bereich auf diese js Datei verweisen.
Wäre programmiertechnisch sauberer oder?

edit2//
nochmal ne Frage:
Ist es auch möglich in das Information-PopUp einen “Schließ-Button” zu integrieren, so dass ein geöffnetes PopUp nicht durch erneutes Klicken auf den Marker verschwindet sondern über den “Schließ-Button”?
bzw auch verschwindet sobald man irgendwo in die Karte klickt, also nicht speziell nochmals auf den Marker drücken muss?

Nahmd,

Dem wohlfeilen MS/IE-Bashing zum Trotz: die aktuellen Versionen des IE halten die Spezifikationen von HTML, JS und CSV genauer ein als z.B. der FF. Wenn eine Seite mit IE nicht funktioniert, hat man (meist) irgendwo geschlampt und gegen Spezifikationen verstoßen. Das wirklich blöde am IE ist, dass er nur unter Win läuft und ich keins habe (musste mir zum Test eben nen Laptop ausleihen mit Win drauf). Wäre dem nicht so, würde ich zuerst mit IE testen. Was da läuft, läuft mit hoher Wahrscheinlichkeit auch mit FF&Co.

Empfehlung: während der Änderungen immer die letzte funktionierende Version sichern. :wink:

Der Teufel steckt im Detail. Da ich nur die Schnipsel, aber keine vollständige Seite hatte, habe ich nicht nach dem Fehler gesucht; stattdessen meine Beispielseite kopiert und ein wenig angepasst.

Ich empfehle, bei Problemen mit Seiten und/oder JavaScript die Seite im Netz zugänglich zu machen: für statische Dateien reicht ein für-lau-Hoster. Dann muss man nicht blind herumstochern, und das erhöht die Motivation zu helfen.

Geschmackssache.
Ich packe (mehrfach verwendbare) Definitionen neuer JS-Klassen in eigene Dateien, das zu einer einzelnen Seite gehörende JS jedoch in die Seite selbst. Da gehört es aber in den -Bereich und nicht wild irgendwo in den eingestreut.

Gruß Wolf

Hast Du da zu HTML irgendein Beispiel? Meiner Erinnerung nach gab es da vor 10 Jahren schon keine signifikanten Unterschiede mehr.
Was macht denn aktuell der FF im HTML-rendering (abgesehen von DTD nachladen, was (afaik) kein Browser macht) falsch?

Das halte ich für eine Gerücht. In AJAX-Beispielen finden sich typischerweise Fallunterscheidungen der art “if IE nehme abweichende Objektnamen else alle anderen Browser einheitlich”. Meine Erfahrungen decken sich damit, meine Seite z.B. ist mit FF getestet, läuft aber auch in Chrome, Safari etc. Nur IE stellt sich quer und würde oben genannte Fallunterscheidungen erfordern.

In einem konkreten Fall hatte ich z.B. bei der div für eine Karte das Problem, daß die width aus style-Angaben für left und right dynamisch berechnet werden muß. IE zeigt die Seite zwar korrekt an, teilt aber sein Berechnungsergebnis nicht mit sondern läßt width auf null stehen, so daß später eine Exception in OpenLayers fliegt. Braucht wieder eine Fallunterscheidung um die Berechnung nochmal im Skript zu machen und den Wert künstlich zu setzen.

In dem Fall mußte ich den IE-Workaround einbauen, aber normalerweise tu ich mir das nicht an und empfehle einen vernünftigen Browser.

bye, Nop

Moins,

OpenLayers kann das, Layer.Text nutzt diese Möglichkeit aber nicht.

Dazu installiert man einen click-Eventhandler am Kartenobjekt, und lässt den das Popup entfernen.

Hab ich in den Beispielcode eingebaut, zusammen mit einem Hack für den Schließknopf. :sunglasses:

Gruß Wolf

.oO( jetzt habe ich aber einen Eintrag im Literaturverzeichnisanhang verdient :stuck_out_tongue: )

Weltklasse vielen Dank!:slight_smile:

Es gibt aber ein Problem:
Im Link von dir geht alles Probleme in allen Browsern: http://www.netzwolf.info/tmp/ietest.htm

Sobald ich aber die html lokal aus der zip-Datei verwende und im Browser testen will, taucht das gleiche Problem wieder auf.
Es wird wieder keine Karte angezeigt (im IE ), bzw die Marker werden nicht dargestellt (im Chrome).

Dasselbe auch bei meiner html Datei, in die ich deinen Code geschrieben habe.

Weiß nicht warum…

Gruß Sebastian

Das Nachladen von Objekten benutzt die JS-Funktion XMLHttpRequest, und die unterliegt der Same-Domain-Policy.

Sobald in den URLs “file:///” auftaucht, ist der Mechanismus besonders vorsichtig und blockiert je nach Implementierung und Sicherheits-Einstellungen fast alles. Das kann man als Feature sehen oder auch als Bug.

Ich sehe zwei Lösungen:

  1. Du rufst die Seiten von einem Server ab. Gibts für ganz kleines Geld oder auch für lau. Dann funktioniert das Nachladen der *.txt-Datei. Das ist die saubere Lösung.
  2. Du lädst Deine Daten nicht aus einer Datei nach, sondern packst die Definition der POIs in die Seite und simulierst das Nachladen. Das willst Du aber nicht wirklich.

Gruß Wolf

danke für die Tipps :wink:

ich habs jetzt ganz anders gemacht bzw ähnlich deiner 2. Lösung, da ich das ganze dem Prof. als zip-Datei abgeben soll. (Abruf vom Server fällt somit flach)

Und zwar hab ich mich auf diese Vorlage gestützt:
http://harrywood.co.uk/maps/examples/openlayers/marker-popups.html

Hab den script-Teil in eine JS-Datei eingefügt und verweise im HTML-head-Bereich auf die JS-Datei.
Dieser JS-Datei hab ich an den Anfang “window.onload = function () {” gesetzt.
Nun hab ich dann jeweils mit “var feature = new OpenLayers.Feature.Vector(” meine Orte und Marker gesetzt.

Scheint bisher zumindest mit allen 3 Browsern zu funktionieren.

Ist diese Lösung auch in Ordnung oder gibts da was einzuwenden?!

Gruß Sebastian

Nahmd,

Perfekt.

Durch das new Feature() und addFeature vermeidest Du auch so das bei lokaler Nutzung problematische Nachladen von Daten.

Gruß Wolf

Sauber, sehr gut!

Dannn bedanke ich mich vielmals für die super Hilfe! :slight_smile:
Ohne die wäre ich sicher nicht durch Herumsuchen und Herumprobieren auf einen Lösungsweg gekommen.

Fall ich nochmal Fragen hab weiß ich ja, dass ich hier super Hilfe bekomme. :stuck_out_tongue:

Dann mal gutes Feiern und Guten Rutsch!

Gruß Sebastian