Konvertieren Sie ein riesiges PNG-Bild in eine interaktive, zoombare Karte?

Ich habe ein 65k x 65k (4 Gigapixel ) großes Bild erstellt, das im Grunde eine Visualisierung des gesamten IPv4-Adressraums aus einer Perspektive ist:

Hilbert-Kurve der rDNS-Verteilung im gesamten Internet

Kein Browser ist bereit, ein so großes Bild zu laden und behauptet, es sei eine gzip-Bombe. Das bedeutet, dass ich gezwungen bin, sie in Kacheln mit unterschiedlichen Zoomstufen aufzuteilen und ein Frontend zum interaktiven Durchsuchen der Karte hinzuzufügen, genau wie in Google Maps (aber für die IP-Adressen).

Gibt es ein Projekt, mit dem ich es schnell machen könnte? Im Moment denke ich darüber nach, mit Leaflets CRS-Simple zu experimentieren , aber das bedeutet, dass ich die Ausrichtung der Kacheln usw. herausfinden müsste, um ein vollständiges Projekt zu erhalten. Gibt es eine „All-in-One“-Lösung, die mit einem riesigen Bild beginnt und mit einer zoombaren Karte endet? Bonuspunkte, wenn es Hilbert-Kurven oder noch besser IPv4-Hilbert-Kurven unterstützt, obwohl es gut wäre, nur einen interaktiven Kartengenerator zu haben.

Antworten (3)

Sie könnten verwenden gdal2tiles, um eine Bildpyramide zu generieren, die Faltblätter oder offene Ebenen verwenden können, um Ihr Bild in einem Browser anzuzeigen.

Es gibt ein ziemlich umfassendes Tutorial oder ein Github-Projekt , das den Code für einfache Bilder wie Ihres umschließt und die erforderliche HTML-Seite generiert.

Neben gdal2tiles könnten Sie vips verwenden . Einzelheiten finden Sie hier: https://stackoverflow.com/a/51852934/10168903

Wenn Sie eine GUI-basierte Lösung wünschen, können Sie Photoshop oder Microsoft Image Composite Editor verwenden . Sie benötigen jedoch ein Plugin von zoomable.ca .

Sie könnten die Syncfusion Essential JS2 Maps-Komponente verwenden. Dadurch werden alle Bilder/Kacheln vom Server geladen und als Karte gerendert. Außerdem bietet es viele interaktive Funktionen für den Benutzer.