Wie überlagere ich Lat / Lon-Punkte auf einer Google-Ebene in OpenLayers 2?

13

Ich füge keinen Vektorpunkt in lat / lon auf einer Google-Ebene in OpenLayers hinzu. Der Punkt bewegt sich, wenn ich die Karte schwenke. Dies passiert nicht, wenn ich die Google-Ebene durch eine Ebene in WGS84 ersetze. Wie kann ich das beheben?

map = new OpenLayers.Map('map');
map.addControl(new OpenLayers.Control.LayerSwitcher());

var gmap = new OpenLayers.Layer.Google(
            "Google Streets", 
            {numZoomLevels: 20}
           );
var pointLayer = new OpenLayers.Layer.Vector("Point Layer");

map.addLayers([gmap,pointLayer]);
map.setCenter(new OpenLayers.LonLat(16.373056, 48.208333), 5);

var point = new OpenLayers.Geometry.Point(16.373056, 48.208333);
var pointFeature = new OpenLayers.Feature.Vector(point,null,null);
pointLayer.addFeatures([pointFeature]);

Ich habe versucht, http://docs.openlayers.org/library/spherical_mercator.html zu folgen, aber ohne Erfolg.

Underdunkel
quelle
Mein Problem hängt mit der Verwendung von Jquery auf derselben Seite zusammen. Funktioniert einwandfrei, wenn ich alle Verweise auf Jquery abrufe.

Antworten:

11

Sie müssen einige Änderungen hinzufügen, um die erforderlichen Ergebnisse zu erhalten:

  1. Fügen Sie den sphericalMercator hinzu: true Sie der Google-Ebene die Eigenschaft , damit Vektorebenen korrekt über der Google-Basisebene angezeigt werden (dies ist der Grund für die Verschiebung der Geometrie).
  2. Fügen Sie die maxExtent-Eigenschaft Ihres Google-Layers hinzu, da sonst die Kartenmitte nicht korrekt festgelegt wird. Die unten gezeigte Ausdehnung ist die Ausdehnung der Welt in Mercator-Koordinaten.
  3. Wie von user1795 angegeben, muss Ihre Punktgeometrie von 4326 an Web Mercator neu projiziert werden, damit sie korrekt auf der Karte angezeigt wird.
  4. Dies gilt auch für das setCenter LonLat. Sie müssen dies also ebenfalls transformieren.

Arbeitscode unten:

            map = new OpenLayers.Map('map');
            map.addControl(new OpenLayers.Control.LayerSwitcher());

            var proj = new OpenLayers.Projection("EPSG:4326");

            var gmap = new OpenLayers.Layer.Google("Google Streets", {
                sphericalMercator: true,
                'maxExtent': new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34)
            });
            var pointLayer = new OpenLayers.Layer.Vector("Point Layer");

            map.addLayers([gmap, pointLayer]);
            var lonlat = new OpenLayers.LonLat(16.373056, 48.208333);
            lonlat.transform(proj, map.getProjectionObject());
            map.setCenter(lonlat, 5);

            var point = new OpenLayers.Geometry.Point(16.373056, 48.208333);
            point = point.transform(proj, map.getProjectionObject());
            //console.log(point);
            var pointFeature = new OpenLayers.Feature.Vector(point, null, null);
            pointLayer.addFeatures([pointFeature]);
geographika
quelle
Das funktioniert super! Es sieht so aus, als ob OpenLayers bei Transformationen nicht wirklich intuitiv ist. Ist es die Option 'spericalMercator', die tatsächlich Reprojektionen ermöglicht?
underdark
1
Stimmen Sie zu, dass dies nicht intuitiv ist. Die Option sphericalMercator fügt die folgenden Funktionen hinzu, mit denen Daten in anderen Projektionen verarbeitet werden können: dev.openlayers.org/docs/files/OpenLayers/Layer/…
geographika
4

Dies ist ein Projektionsproblem, Sie müssen die Projektion des Punkts in die der Basisebene umwandeln (Google Map hier). Der folgende Code sollte funktionieren

    map = new OpenLayers.Map('map');
    map.addControl(new OpenLayers.Control.LayerSwitcher());

    var gmap = new OpenLayers.Layer.Google(
        "Google Streets", 
        {numZoomLevels: 20}
    );
    var pointLayer = new OpenLayers.Layer.Vector("Point Layer");

    map.addLayers([gmap,pointLayer]);
    map.setCenter(new OpenLayers.LonLat(16.373056, 48.208333), 5);

    var point = new OpenLayers.Geometry.Point(16.373056, 48.208333);
    point.transform(new OpenLayers.Projection("EPSG:4326"),new OpenLayers.Projection("EPSG:900913"));
    var pointFeature = new OpenLayers.Feature.Vector(point,null,null);
    pointLayer.addFeatures([pointFeature])

Dies liegt daran, dass die Standardprojektion von Google Map (Spherical Mercator) 900913 und die eines einfachen Punkts in Lonlat im Jahr 4326 ist.

Bitte stellen Sie sicher, dass der Punkt als (Längengrad, Breitengrad) und nicht als (Breitengrad, Längengrad) eingestellt ist.

Vikash Talanki
quelle
Durch Hinzufügen der Transformation wird der Punkt auf meiner Karte ausgeblendet. Meine OpenLayers-Version ist 2.9.1, wenn es einen Unterschied macht.
Underdunkel
Die point.transform hat den Trick für mich gemacht!
Stefan
1

Wenn Sie mit der Google Maps JS-API arbeiten, sollten Sie auf die Version achten. Standardmäßig wird die Entwicklungsversion der Google JS Maps-API verwendet. Überprüfen Sie die Seite: http://code.google.com/apis/maps/documentation/javascript/basics.html#Versioning

Und das Google Maps JS-Team behebt auch Fehler. Überprüfen Sie http://code.google.com/p/gmaps-api-issues/wiki/JavascriptMapsAPIv3Changelog

Erwähnen Sie in Zukunft die Google Maps API-Version in der Frage. v3.3 hatte keine Probleme mit Openlayern, wie sie hauptsächlich von Entwicklern verwendet werden.

Senthil
quelle
Hallo Senthil, ich bin nicht sicher, wie sich Google Maps JS API-Versionen auf mein Problem mit OpenLayers auswirken.
Underdunkel
Hallo Underdark, ich hatte ein Problem mit v3.4, als ich mit Openlayers und dann speziell mit 3.3 gearbeitet habe und wenn ich die Google Maps-Stammversion verwende, sind die Ergebnisse unvorhersehbar, da die Entwicklung noch nicht abgeschlossen ist. Haben Sie es mit der Versionierung versucht? Auch wenn Sie OpenLayer verwenden, liegt dem Google Maps API zugrunde.
Senthil
0

Ich denke, es ist ein Projektionsproblem.

Haben Sie versucht, den Schwerpunkt des Punkts zu melden, an dem die Karte schwenkt? Möglicherweise können Sie sehen, ob sich etwas ändert.

Aber von dem, was ich von Ihrem Code sehe, würden Sie WGS84 Punkt zu einem anderen corordsys hinzufügen

Behaart
quelle
Haben Sie übrigens versucht, die Projektion der Karte abzufragen, um zu sehen, wie sie tatsächlich eingestellt ist?
Behaarte
und schließlich, sorry, aber es gibt eine Möglichkeit, Ihren Punkt zu transformieren, wenn Sie Probleme mit der Projektion haben: var a = new OpenLayers.LonLat (3,53) .transform (ll, new OpenLayers.Projection ('EPSG: 900913')) ;
Behaarte