Ich möchte ein Overlay-Bild in eine Google Map einfügen. Das Bild ist eine SVG-Datei, die ich erstellt habe (Python mit SVGFig).

Ich benutze den folgenden Code:

<code>if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(48.8, 2.4), 12);

    // ground overlay
    var boundaries = new GLatLngBounds(new GLatLng(48.283188032632829, 1.9675270369830129), new GLatLng(49.187215000000002, 2.7771877478303999));
    var oldmap = new GGroundOverlay("test.svg", boundaries);
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.addOverlay(oldmap);
}
</code>

Überraschenderweise funktioniert es mit Safari 4, aber nicht mit Firefox (mit Safari 3 ist der Hintergrund nicht transparent).

Hat jemand eine Idee, wie ich eine SVG überlagern könnte?

PS1: Ich habe einige Werke wie gelesendiese oder den Quellcode von swa.ethz.ch/googlemaps, aber es scheint, dass sie JavaScript-Code verwenden müssen, um die SVG zu analysieren und nacheinander alle Elemente hinzuzufügen (aber ich habe nicht alle Quellen verstanden ...).

PS2: Die SVG-Datei besteht aus unterschiedlich gefüllten Pfaden und Kreisen mit Transparenz. Wenn es keine Lösung gibt, um mein SVG zu überlagern, kann ich 2 alternative Lösungen verwenden:

rastere die SVGKonvertieren Sie die Pfade und Kreise in GPolygons

Aber ich mag die erste Lösung nicht wirklich, weil die Qualität der Bitmap und die Zeit, um sie mit Antialiasing zu generieren, schlecht sind.

Und für die 2. Lösung müssen die Bögen, Ellipsen und Kreise in kleine Polylinien zerlegt werden. Viele von ihnen werden für ein gutes Ergebnis notwendig sein. Aber ich habe ungefähr 3000 Bögen und Kreise zu zeichnen, also ...