2017-02-15 3 views
1

Ich habe herausgefunden, wie ein Polygon in einem benutzerdefinierten Fenster mit the Working with Map Panes tutorial und this Stack Overflow question mit dem zugehörigen Fiddle erstellt wird.So ändern Sie das Polygonfenster in Leaflet (benutzerdefiniertes Fenster)

Kann ich das Polygon nach der Erstellung in ein anderes (benutzerdefiniertes) Fenster umwandeln?

Ich erstelle ein Polygon in einer benutzerdefinierten Scheibe etwa so:

// create custom pane 
mymap.createPane('polygonView'); 
var polygonViewPane = mymap.getPane('polygonView'); 
polygonViewPane.style.zIndex = 300; 
// with custom renderer 
var myrenderer = L.svg({ 
    pane: polygonViewPane 
}); 

// create polygon in a custom pane (note the `renderer:myrenderer` or `pane:polygonViewPane` both work) 
var myPoly = L.polygon([ 
    [51.509, -0.08], 
    [51.503, -0.06], 
    [51.51, -0.047] 
], { 
    fillOpacity: 1, 
    pane: polygonViewPane 
}).addTo(mymap); 

Es scheint, wie ich in der Lage sein sollte, die Scheibe mit so etwas wie zu wechseln:

// changes pane in options.pane, but appearance on the map is same 
myPoly.setStyle({pane: polygonViewPaneTop});  
// also does not work (command fails without output in console?) 
myPoly.setStyle({renderer: myrenderer2}); 

aber keinen von diesen sind am Arbeiten. Ich kann den zIndex des gesamten Bereichs mit polygonViewPane.style.zIndex = 800; wechseln, aber ich habe normalerweise mehrere Polygone in diesem Hauptbereich, und ich möchte nur einen vor alle meine Ebenen bringen.

https://jsfiddle.net/kbkxf220/


EDIT: Aktualisiert Fiddle IvanSanchez Antwort enthält: https://jsfiddle.net/kbkxf220/3/

// THIS WORKS; polygon switches pane and `myPoly.options.pane` shows new pane. 
myPoly.removeFrom(mymap); 
myPoly.setStyle({pane: polygonViewPaneTop, renderer: myrenderer2}); 
myPoly.addTo(mymap); 

Beachten Sie, dass Sie benötigen renderer für das Polygon wechseln Scheiben auf der Kartenansicht zu wechseln (siehe inspect-Element) und wechseln Sie pane für myPoly.options.pane, um das neue Fenster korrekt anzuzeigen.

Antwort

1

Nein, Leaflet erlaubt nicht, Scheiben im laufenden Betrieb zu wechseln.

Entfernen Sie die Ebene aus der Karte, ändern Sie ihre Optionen, und fügen Sie sie erneut hinzu.

Wenn Ihr Problem Linien/Polygone übereinander bringt, denken Sie daran, dass Sie call bringToFront() auf ihnen haben können.

+0

Vielen Dank dafür. Ich würde auch hinzufügen, dass 'bringToFront()' nur innerhalb eines einzelnen Renderers sortiert (siehe [L.Paths Version von 'bringToFront()'] (https://github.com/Leaflet/Leaflet/blob/49213551953067aa70c3c3d2e74a6c5431a896c5/src/layer) /vector/Path.js#L110); Wenn es nicht korrekt zu funktionieren scheint, suche nach mehreren Renderern. Ich habe einen benutzerdefinierten Renderer für einige Layer verwendet, aber nicht für alle. Um alle Pfadlayer zusammen zu sortieren, brauchte ich den gleichen Renderer für alle Pfad-Ebenen zu verwenden, hat mich eine Weile gebraucht, um das herauszufinden ... :) – user2441511

Verwandte Themen