OpenLayers auf andere Standorte projiziert Vs Bing Maps

Question

Ich verwende OpenLayers mit Bing Map. Ich habe einen Marker hinzugefügt, aber er wird an einem anderen Ort angezeigt. Die gleichen Koordinaten, die ich in Bing Maps verwendet habe und es zeigt an der richtigen Stelle.

Hier bing search result

Dies ist der OpneLayers führt

$(function() { 

     var tileLayer = new ol.layer.Tile({ 
      source: new ol.source.BingMaps({ 
       key: 'Armnl..', 
       imagerySet: 'Aerial' 
      }) 
     }); 

     var map = new ol.Map({ 
      layers: [tileLayer], 
      target: 'map', 
      view: new ol.View({ 
       center: [-22.3869608, -49.7602708], 
       zoom: 5, 
      }) 
     }); 

     var p1 = new ol.Feature({ 
      geometry: new ol.geom.Point([-22.3869608, -49.7602708]) 
     }); 


     var vectorSource = new ol.source.Vector({ 
      features: [p1] 
     }); 

     var vectorLayer = new ol.layer.Vector({ 
      source: vectorSource 
     }); 

     map.addLayer(vectorLayer); 

    }); 

Wurde ich brauche, um die Koordinaten zu transformieren?

Answer 1

Ja, in der Tat müssen Sie Ihre Koordinaten zu EPSG:3857 transformieren.

Sie haben zwei verschiedene Möglichkeiten

1) Sie Ihre Karte mit epsg bauen: 4326. Das bedeutet, dass eine Kunden-Fliese-Reprojektion stattfinden muss.

Dazu

var map = new ol.Map({ layers: [tileLayer], target: 'map', view: new ol.View({ projection:'EPSG:4326', center: [-22.3869608, -49.7602708], zoom: 5, }) });

2) Sie tranfrom Ihr Zentrum zu 'EPSG: 3857'. Diese Projektion sollte verwendet werden, da Sie sie nicht innerhalb der ol.view-Konfiguration angeben. (Projektion automatisch von der ersten Kachelebene, die an die Karte angehängt ist).

Um so

var map = new ol.Map({ layers: [tileLayer], target: 'map', view: new ol.View({ center: ol.proj.transform([-22.3869608, -49.7602708], 'EPSG:4326','EPSG:3857'); zoom: 5, }) });

Ende für Ihren Vektor Punkt

var p1 = new ol.Feature({ geometry: new ol.geom.Point(ol.proj.transform([-22.3869608, -49.7602708], 'EPSG:4326','EPSG:3857')) });