2017-01-07 2 views
3

Ich habe eine AngularJS (1.58) webapp zeigt einige Karten mit ui-leaflet. Ich habe das Leaflet.Heat Plugin erfolgreich integriert. Außerdem habe ich das Leaflet.Draw Plugin erfolgreich integriert.ui-Prospekt Heat Plugin Konflikte mit ui-Prospekt-Zeichnen für Microsoft Browser

Problem: In dem Moment, Im mit beiden Plugin, Wärme und Zeichnen, mein Webapp ist keine Karten mehr auf Microsoft-Browsern nicht angezeigt (Microsoft Edge, Internet Explorer 11). Ich habe versucht, verschiedene Kombinationen von Release-Versionen dieser Plugins zu verwenden, um es auf jedem der gängigen Browser zu arbeiten. Wenn ich die Flugblattkarten wieder zur Arbeit mit Microsoft Edge bringe, funktioniert das Heat Plugin nicht mehr (nicht nur ME, auch Opera, Firefox, GChrome).

zusammengefasst: Die neuesten Versionen von ui-Faltblatt, Broschüre, ui-Faltblatt-Draw und Leaflet.Heat arbeitet gut zusammen auf Google Chrome, Firefox, Opera. Aber die Karten verschwinden für Microsoft Edge vollständig. Ältere Versionen zeigen wieder Karten für Microsoft Edge, aber das Heat Plugin funktioniert nicht mehr in jedem Browser.

Frage: Gibt es eine funktionierende Kombination von Versionen dieser Tools für alle diese Browser (sprich von Google Chrome, Firefox, Opera, Microsoft Edge) zusammen? Wenn ja, welche Versionen sind sie? Wenn nicht, werden empfohlene Problemumgehungen empfohlen? Vielleicht andere Plugins, die ich stattdessen zum Zeichnen oder Anzeigen von gut aussehenden Heatmaps verwenden kann?

Schritte zum Reproduzieren: Laden Sie die Leaflet.Heat example herunter. Integrieren Sie Ui-Leaflet-Draw als Librarys (z. B. via Bower). Testen Sie es mit Google Chrome, Firefox oder Opera. Abhängig von Ihren Versionen werden Sie entweder die funktionierende Heatmap sehen, aber mit Microsoft Edge getestet. Sie sehen keine Karte ODER Sie sehen keine Heatmap und Microsoft Edge zeigt eine Karte (auch ohne Hitze).

Antwort

0

In Ordnung, ich konzentrierte mich auf mein Problem und fand eine Lösung.

Ich ersetzte ui-leaflet-draw mit leaflet.Draw Plugin und die Kombination aller 3 funktionierte für alle Browser (solange ich die richtigen Versionen verwende). Also hier sind sie aus meiner bower.json Projektdatei sind:

"dependencies": { 
    "angular": "1.5.8", 
    "angular-simple-logger": "~0.1.7", 
    "ui-leaflet": "1.0.3", 
    "Leaflet.heat": "https://github.com/Leaflet/Leaflet.heat/archive/gh-pages.tar.gz", 
    "angular-material": "~1.1.1", 
    "leaflet.draw": "*" 
    }, 
    "resolutions": { 
    "angular-material": "~1.1.1", 
    "angular": "1.5.8", 
    "leaflet": "1.0.3" 
    } 

Update: Genießen Sie die Entwicklung schöner Karten mit Wärmeschichten Leaflet 1.0.3 zu arbeiten und haben dann bessere Benutzer expierence Kontrollen

0.7.x und Zeichnen Sie die Steuerelemente jetzt für GChrome, Opera, FireFox und Microsoft Edge! (nicht getestet IE 11 Cuz von vielen anderen Konflikten mit eckigen Material)