OpenStreetMap Forum

Wegabschneider

Member

From: Palatina

Registered: 2010-02-07

Posts: 287

leaflet custom icons verändern Position beim zoomen

Mit dem Verändern des Zooms verändern marker die Position

so wie hier beschrieben, ist es auch bei mir

http://gis.stackexchange.com/questions/ … with-scale

mit dem Unterschied, dass die dortige Lösung nicht hilft.

var blackIcon = L.icon({
    iconUrl: 'leaflet/images/marker-icon-black.png',
    //iconRetinaUrl: 'my-icon@2x.png',
    iconSize: [38, 95],
    iconAnchor: [22, 94],
    //popupAnchor: [-3, -76],
    //shadowUrl: 'leaflet/images/marker-shadow.png',
    //shadowRetinaUrl: 'my-icon-shadow@2x.png',
    //shadowSize: [68, 95],
    //shadowAnchor: [22, 94]
});

damit wird der schwarze Marker bei jedem Zoomfaktor an der richtigen Stelle angezeigt. Aber er ist in der Höhe verzerrt.

Der schwarze Marker bei leaflet misst 25x41 pixel. Ändere ich nun iconSize in [25, 41], dann verändern die Marker die Position beim zoomen. Ebenso rote, grüne Marker etc.

Ich habe schon unzählge Kombinationen und Werte ausprobiert. Nichts behebt das Problem.

leaflets blaue Marker, sind wohl Standard, die musste ich nicht anpassen. Die sind immer an der richtigen Position!

Last edited by Wegabschneider (2017-03-09 12:47:05)

dooley

Member

From: Landkreis Calw

Registered: 2013-11-04

Posts: 899

Re: leaflet custom icons verändern Position beim zoomen

Mit dem Verändern des Zooms verändern marker die Position

so wie hier beschrieben, ist es auch bei mir

http://gis.stackexchange.com/questions/ … with-scale

mit dem Unterschied, dass die dortige Lösung nicht hilft.

var blackIcon = L.icon({
    iconUrl: 'leaflet/images/marker-icon-black.png',
    //iconRetinaUrl: 'my-icon@2x.png',
    iconSize: [38, 95],
    iconAnchor: [22, 94],
    //popupAnchor: [-3, -76],
    //shadowUrl: 'leaflet/images/marker-shadow.png',
    //shadowRetinaUrl: 'my-icon-shadow@2x.png',
    //shadowSize: [68, 95],
    //shadowAnchor: [22, 94]
});

damit wird der schwarze Marker bei jedem Zoomfaktor an der richtigen Stelle angezeigt. Aber er ist in der Höhe verzerrt.

Der schwarze Marker bei leaflet misst 25x41 pixel. Ändere ich nun iconSize in [25, 41], dann verändern die Marker die Position beim zoomen. Ebenso rote, grüne Marker etc.

Ich habe schon unzählge Kombinationen und Werte ausprobiert. Nichts behebt das Problem.

leaflets blaue Marker, sind wohl Standard, die musste ich nicht anpassen. Die sind immer an der richtigen Position!

Du musst iconSize und iconAnchor zusammen anpassen, nicht nur eins von beiden. Das sollte funktionieren (ungetestet):

...
iconSize: [25, 41],
iconAnchor: [12.5, 41]
...

wenn das Icon "zentriert unten" auf die Koordinate zeigen soll.

---

Zum Zustand des deutschen Forums vom geschätzten Netzwolf auch "Pamphlet" genannt
Mein Avatar ist ein Ausschnitt aus "Die Saporoger Kosaken schreiben dem türkischen Sultan einen Brief" (Ilja Repin, gemeinfrei)

Wegabschneider

Member

From: Palatina

Registered: 2010-02-07

Posts: 287

Re: leaflet custom icons verändern Position beim zoomen

Voll korrekt. Merci!

gormo

Member

Registered: 2013-08-01

Posts: 2,119

Website

Re: leaflet custom icons verändern Position beim zoomen

Hast du schon den Code auf http://leafletjs.com/examples/custom-icons/ gesehen? Der macht das, und zeigt auch das mit dem iconAnchor.

edit: zu spät...

Last edited by gormo (2017-03-09 15:00:40)

---

OSM hat nicht das Ziel bis Ende des Monats einen vollständigen Datensatz der Welt zu enthalten.
(nach S.W.) - Aber weil die Welt vielfältig ist, weil sie auch im Detail interessant ist, mag ich genaue Karten (nach C.)