Leaflet: Nicht auf die nächste ganze Zahl runden

Das Runden von Pfadkoordinaten auf die nächste ganze Zahl bietet eine schärfere Linie (und möglicherweise eine bessere Leistung, da der Browser keine zusätzlichen Pixel für das Anti-Aliasing zeichnet).

In Ihrem Fall vielleicht eine Option in Path, die darauf hinweist, dass der Renderer die Koordinaten nicht rundet?

Der Kompromiss für diese "Optimierung" ist Genauigkeit, was kein Preis ist, den man zahlen sollte. Die Rundung scheint nicht einmal etwas zu optimieren:
Das Bild ist nicht unbedingt schärfer, da der Browser Anti-Aliasing-Pixel für alle Linien zeichnet, da die Linie zwischen den Pixeln zu liegen scheint und nicht auf ihnen? Zumindest ist dies bei Polygonen der Fall.
Ich denke, deswegen habe ich keinen subjektiven Geschwindigkeitsunterschied zwischen mit und ohne Rundung bemerkt, da es für den Browser egal ist...

Das Runden der Koordinaten ist ein Artefakt, damit die Dinge in einigen Browsern richtig gerendert werden (denken Sie an den alten IE). Nicht ganzzahlige Werte für einige CSS-Transformationen können Probleme verursachen.

Also, selbst wenn dies eine gute Idee ist, glaube ich nicht, dass es 1.0 erreichen kann, und es muss getestet werden.

@Ceremony64 Bitte geben Sie die Version des Leaflets an, die Sie verwenden, und ziehen Sie in Betracht, eine Pull-Anfrage mit Ihren Änderungen zu senden - das würde die Sache vereinfachen.

Oh, BTW, Safari wird die Hauptursache für Kopfschmerzen sein, siehe zB https://twitter.com/Rich_Harris/status/762820715439591424

Ich war auf 1.0 RC2 und habe heute auf RC3 aktualisiert. Hier ist der Pull: https://github.com/Leaflet/Leaflet/pull/4808
Es gibt eine weitere Instanz von ._round() in Zeile 1095, aber ich bin mir nicht sicher, welche Auswirkungen es hat.

Dies ist ein alter Beitrag, gibt aber möglicherweise noch einen weiteren Grund an, warum Pfadkoordinaten gerundet werden: https://www.mapbox.com/osmdev/2012/11/20/getting-serious-about-svg/

Wenn Sie bis zur Überschrift "Abgerundete Pixel geben einen Schub" scrollen, können Sie sehen, dass @mourner als Quelle für diese 20%ige Leistungssteigerung angegeben ist.

Wäre interessant zu vergleichen, ob dies in modernen Browsern noch zutrifft.

Ich habe dieses Beispiel zusammen mit der Timeline-Funktion von Chrome als Leistungstest verwendet: http://playground-leaflet.rhcloud.com/tija/edit?html ,output

Aus diesem kleinen Test kann ich keinen signifikanten Unterschied bei der Verwendung von round oder der Nichtverwendung von round messen, die Timing-Zahlen für die Rendering-Zeit sind bis zur Genauigkeit der Messung identisch.

Zu beachten ist jedoch, dass die Daten ohne Rundung _viel besser_ aussehen.

Wir müssen jedoch noch die von @IvanSanchez in #4808 erwähnten

Kleines Kompatibilitätsupdate:
Ich hatte keine (gemeldeten) Probleme beim Ausführen meiner modifizierten Broschürenversion (jetzt mit 1.2) und konnte sie mit allen aktuellen Browserversionen testen (außer Safari für Mac, die ich nicht testen konnte). Ich habe auch keine zusätzlichen Verlangsamungen bemerkt.

Ich habe es nicht mit dem Canvas-Renderer getestet, sondern nur mit dem Standard-SVG-Renderer.

@Ceremony64 Das Problem hier ist hauptsächlich, dass Leaflet immer noch die Kompatibilität mit sehr, sehr _nicht_ aktuellen Browsern aufrechterhält, hauptsächlich IE8, 9 und 10. Safari auf dem Mac ist definitiv auch sehr wichtig für uns zum Testen.

Abgesehen davon würde ich mich freuen, wenn wir das vorantreiben!

Ich habe keine Möglichkeit, auf einem Mac zu testen, da ich keinen besitze. Ich könnte Safari auf iOS testen! (keine Probleme)

Außerdem glaube ich, dass es an der Zeit ist, IE aufzugeben, genau wie MS es in dem Moment getan hat, als sie es veröffentlicht haben ... lol
Nur Windows XP kommt mit IE8 und niedriger, die auch von MS nicht mehr unterstützt werden. Windows Vista hat das Update für bis zu IE9 erhalten, aber Vista ist eine Seltenheit, da es ein Marktversagen war und ich bin mir nicht sicher, ob diese IE-Version auch noch Sicherheitsupdates erhält... kostenloses Update auf IE11. (Außer Windows Phones, die ebenfalls ein Misserfolg waren und im Grunde keinen Marktanteil haben)

Daher empfehle ich, zumindest die Unterstützung für IE8 einzustellen, vielleicht auch die Unterstützung für IE9 und 10.

PS mein Anwendungsfall unterstützt nicht IE10 und niedriger, da ich Google Maps in der Broschüre verwende, was einen DOM-Mutationsbeobachter erfordert, der nur von IE11 und guten Browsern unterstützt wird

@perliedman @Ceremony64 Wie können Sie dies voranbringen ? Ich habe einen Mac, damit ich dir bei diesem helfen kann

@giacomoburattini wir müssen alle Kästchen in #4808

@perliedman Was ist die Ausgabe, die Sie genau erwarten?
Ich muss nur die Tests ausführen, indem ich spec/index.html in den aufgeführten Browsern öffne? Muss ich für bestimmte Tests einen Screenshot-Vergleich bereitstellen? Muss ich einen Vergleich der Leistungsregressionsergebnisse mit dem Fix bereitstellen? (Wenn ja, kannst du mir noch ein paar Details geben?)

@perliedman Ich denke, wir können die IE8-Unterstützung bereits
Error: Expected identifier File: leaflet-src.js, Line: 9020, Column: 7

@giacomoburattini Ich habe einen groben Test erstellt: https://a.uguu.se/AtGM4ieiYR35_leaflet.zip (24-Stunden-Limit... konnte keinen anständigen Hoster hinter der Firma fw finden...)
Entpacken und vergleichen Sie leaflet.html mit leaflet-patched.html. HTML enthält sowohl den regulären SVG-Renderer (links) als auch den Canvas-Renderer (rechts). Die enthaltenen Quellen basieren auf der neuesten stabilen Version 1.2.
IE9 und höher, FF und Chrome scheinen alle ohne Rundung gut zu funktionieren. Ich habe keine mobilen Browser oder Safari getestet.

@perliedman können Sie bitte bestätigen, ob IE8 noch unterstützt wird? Können Sie bitte auch bestätigen, dass das Ausführen des von @Ceremony64 bereitgestellten Tests ausreicht?

Hallo Leute,
IE8 wird offiziell unterstützt - auf unserer Titelseite steht "IE 7–11", und es steht mir nicht frei, dies aus einer Laune heraus zu ändern, egal wie sehr ich es und seine ungezogenen Brüder mag.

Wenn die neueste Version im IE8 tatsächlich nicht funktioniert, ist das ein Problem, das wir angehen sollten, und kein Grund, den beanspruchten Support einzustellen. Dass sich niemand darüber beschwert hat, könnte jedoch ein Hinweis darauf sein, dass wir erwägen sollten, den Support für zukünftige Versionen einzustellen; Auch das ist in diesem Fall nicht meine Entscheidung, obwohl ich sicherlich einschätzen könnte.

Der Test sieht leider vorerst verloren aus. Da ich momentan unter Zeitdruck stehe, kann ich gerade kein Testbeispiel zusammenstellen.

@perliedman Ich habe den von @Ceremony64 vorbereiteten Beispieltest heruntergeladen und in Dropbox hochgeladen (hier der Link https://www.dropbox.com/s/7c6lhiy4erc1x81/AtGM4ieiYR35_leaflet.zip?dl=0) damit ich die Tests ausführen kann auf den angeforderten Browsern.
Meine Frage ist: Reicht es, diesen Test auf den aufgeführten Browsern auszuführen, oder muss ich Screenshots der laufenden Tests machen?
Ich bin mit IE8 ok, ich kann den Beispieltest auch in diesem Browser ausführen und wenn etwas defekt ist, kann ich ein neues Problem melden und versuchen, das Problem dort zu beheben.
Vielen Dank

@giacomoburattini
danke fürs rehosten!

@perliedman
Die Zeit, die für die Behebung von IE8-Fehlern aufgewendet wird, ist Zeitverschwendung. Ich beginne keine Diskussion und dies ist mein letzter Kommentar zu IE8 und was unterstützt werden soll (und was nicht), aber Sie sollten unbedingt in Erwägung ziehen, die Unterstützung für veraltete Browser offiziell zu streichen:
Nur XP hat IE8 als neueste Version und nicht einmal MS unterstützt dieses Betriebssystem mehr. MS unterstützt auch Vista nicht mehr, das IE9 als neueste Version hat. Tho, niemand hat jemals Vista benutzt. Nur Win7 und höher erhalten IE11. Der IE selbst ist jetzt mit der Veröffentlichung von MS Edge eingefroren. Wenn jemand wirklich alten IE-Support braucht, kann man immer noch eine der älteren Versionen wählen und mit den Konsequenzen leben.

@perliedman Es tut mir leid, Sie wieder zu stören, aber dieser Fix ist etwas, das ich gerne fortsetzen möchte.
Es sieht so aus, als ob wir nur einen letzten Schub in die richtige Richtung brauchen, um es zusammenzuführen. Wir sind uns alle einig, dass der Fix korrekt aussieht und wir ihn in dem aufgelisteten Browser testen sollten (die Diskussion über die veraltete IE8 gehört nicht zu diesem Thread).
Aber was erwarten Sie von @giacomoburattini in Bezug auf die durchzuführenden Tests?
Brauchen Sie nur einen Rauchtest wie das Öffnen des hier verlinkten Skripts und das Posten der Screenshots der gerenderten Seite für alle verschiedenen Browser? oder benötigen Sie tiefergehende Tests?

Nur der Diskussion halber, für die Zukunft wäre es großartig, darüber nachzudenken, strukturierte Integrationstests (vielleicht basierend auf Bildvergleichen?) "-Dienst zum Ausführen der Funktionstests in allen von uns benötigten Browsern)

@danydev Für mich sind Screenshots oder was auch immer, um sicherzustellen, dass Vektoren nach dieser Änderung tatsächlich noch funktionieren. Obwohl ich glaube, dass uns die Leistung in alten IE-Versionen nicht zu sehr wichtig ist, ist es natürlich auch wichtig, dass es in diesen Browsern noch verwendbar ist.

@perliedman @Ceremony64 hier die Screenshots für die gewünschten Browser. Die gepatchte Version funktioniert gut. Bitte beachten Sie, dass IE8 defekt zu sein scheint. Ich werde ein separates Problem dafür einreichen, da ich IE8 VM habe, kann ich versuchen, das Problem herauszufinden .

Update: Nach einigen Untersuchungen entdeckte ich , dass das Problem mit IE8 zurückzuführen ist auf die Verwendung von class Wort in _initImage Methode in der VideoOverlay Klasse. Das Problem wurde mit https://github.com/Leaflet/Leaflet/pull/5785/files#diff -1dcd34332bab42a8b1cabcc4ebde9a37L42 behoben
und der Fix ist im Master-Zweig verfügbar.

iPhone 6 iOS 8

iPhone 6 iOS 8

iPhone 6s iOS 9

iPhone 6s iOS 9

@perliedman können wir das

@giacomoburattini es ist nicht ganz klar, welche Browser hier getestet werden: Ich kann Desktop Safari 8, IE 9, IE 11 sehen, aber welche iOS-Version wird oben getestet?

Wenn IE8 jetzt behoben ist, können wir das auch testen, bevor wir fortfahren?

@perliedman hat meinen Kommentar aktualisiert, um die getestete iOS-Version anzugeben (die, die Sie hier testen

@perliedman sieht so aus, als ob alles, was wir brauchen, um den Fall zu verschieben, bereitgestellt wurde. Was können wir tun, um diesen Fall

@danydev es sieht so aus, als ob IE8 immer noch nicht getestet wurde; leicht als unwichtig abgetan, aber ich habe nicht das Mandat zu sagen, dass wir es fallen lassen/ignorieren sollen.

Außerdem habe ich persönlich nicht die Zeit, mich mit den möglichen Folgen einer solchen Änderung zu befassen (zu diesem Zeitpunkt ist fast jede Änderung kompliziert, da Leaflet an so vielen Orten in so unterschiedlichen Anwendungsfällen verwendet wird), also ' Ich zögere, zu fusionieren.

@cherniavskii @ghybs Entschuldigung, dass ich dich da hineinziehen muss , aber ich würde sagen, mach weiter, irgendwelche Einwände oder Zögern

Hallo @perliedman ,

Danke für die Bemerkung.

Tut mir leid, dass ich derzeit auch nicht genug Zeit habe, um mich damit zu befassen… :enttäuscht:

Übrigens ist eine einfache Problemumgehung für Leute, die dies benötigen, einfach die Methode in Ihrem Skript zu überschreiben. Kopieren Sie das folgende Snippet, bevor Sie Ihre Karte instanziieren:

L.Map.include({
    latLngToLayerPoint: function (latlng) {
        var projectedPoint = this.project(L.latLng(latlng));
        return projectedPoint._subtract(this.getPixelOrigin());
    }
});

Da es oben eine einfache Problemumgehung @ghybs gibt , denke ich, dass es besser wäre, dieses Problem

Die Problemumgehung besteht darin, die Bibliotheksmethode mit dem richtigen im PR vorgeschlagenen Fix zu überschreiben.
Ich verstehe, dass eine solche Problemumgehung für jemanden kurzfristig funktioniert, aber dieses Problem zu schließen, nur weil wir eine Problemumgehung haben, die eine Kernbibliotheksfunktion überschreibt, ist wahrscheinlich nicht das, was wir tun sollten. Das Problem ist immer noch in der Bibliothek vorhanden und ich denke, wir wollen es im Auge behalten, bis es im Kern wirklich behoben ist.

Außerdem sieht es so aus, als wären wir nicht so weit entfernt, Maßnahmen zu diesem Fix zu ergreifen. Angesichts der Tatsache, dass @giacomoburattini es in (fast) allen von Leaflet unterstützten Browsern getestet hat, sehe ich keinen

Meine Untertreibung ist, dass diese Runde eingeführt wurde, weil IE8 beim Rendern von svg nicht mit Bruchzahlen umgeht, und wenn es richtig wäre, wäre das Rendering auf allen anderen Browsern einfach besser (wie der Screenshot zeigt).