OpenLayers 3 görüntüleme merkezini değiştir

Bazı haritalarla etkileşim için OpenLayers 3 kullanıyorum. İlk olarak haritamı beyan ederim:

map = new ol.Map({
            target: 'map',
            layers: [
              new ol.layer.Tile({
                  source: new ol.source.OSM()
              })
                ],
            view: new ol.View({
                center: [0, 0],
                zoom: 2
            })
        });

Haritamın görüntüleme merkezini değiştirmek için bir işlemi tetikleyen bir etkinliğim var. Bu şekilde, (koordinatlarım EPSG:4326biçimdedir):

function CenterMap(lat, long) {
     console.log("Lat: " + lat + " Long: " + long);
     map.setView(new ol.View({
            center: ol.proj.transform([lat, long], 'EPSG:3857', 'EPSG:4326'),
            zoom: 5
     }));
}

İşlev çalıştığında bunu explorer konsolundan alıyorum:

Lat: 9.0412851667 Long: -79.5658145000

Ama haritalar gidiyor [0,0], bunun neden olduğunu bilen var mı?

— Guillelon
kaynak

Yanıtlar:

Ol.proj.transform dosyasında toProjection öğesinden önce fromProjection öğesini belirtmeniz gerekir, o zaman çalışmalıdır.

Michael Gentry'nin cevabında açıkladığı gibi, bir başka Sorun, önce boylamı (böylece batı-doğu x) ve sonra enlemi (güney-kuzey böylece y) belirtmeniz gerektiğidir.

Ve merkezi ayarlamanın daha iyi bir yolu, her zaman yeni bir görünüm oluşturmak yerine geçerli görünümü elde etmek ve merkezi orada ayarlamaktır.

function CenterMap(long, lat) {
    console.log("Long: " + long + " Lat: " + lat);
    map.getView().setCenter(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));
    map.getView().setZoom(5);
}

— Simon Zyx
kaynak

Tamam, teşekkürler. Bir şey daha, bu şekilde değiştirirsem yeni bir hata alıyorum

Uncaught TypeError: Failed to execute 'putImageData' on 'CanvasRenderingContext2D': float parameter 3 is non-finite. ol.js:457 2Uncaught RangeError: Invalid array length

. Bence koordinatlarım çok uzun. Eğer değiştirirsem [131.044922, -25.363882]çalışır. Yani koordinatlarım çok mu uzun?

— Guillelon

sorun olmamalı. hata hangi koordinatlarla ortaya çıktı? yukarıda bahsettikleriniz?

— Simon Zyx

evet orada bir

— Guillelon

Bu koordinatları bir MapQuest haritası ile denedim ve işe yaradı. -79 boylamı hala EPSG: 4326 (+/- 90 derece içinde) ve EPSG: 3857 (+/- 85 derece içinde) sınırları dahilindedir.

— Simon Zyx

renderer ve bir rangerror içinde ortaya çıkan bir daktilo

— Simon Zyx

Yeni bir yığın exchange hesabım var ve "Uncaught TypeError: 'CanvasRenderingContext2D' 'putImageData' yürütülemedi: float parametresi 3 sonlu değildir." hata. Bunun nedeni lat ve uzun girişlerin geriye doğru olmasıdır.

map.getView().setCenter(ol.proj.transform([lat, long], 'EPSG:4326', 'EPSG:3857'));

olmalı:

map.getView().setCenter(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));

başka kimsenin bu sorunu olması durumunda.

— Michael Gentry
kaynak

evet haklısın - cevabımı buna göre güncelleyeceğim.

— Simon Zyx

Yalnızca tarayıcı kullanımı için:

<script src='https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js'></script>


  ol.proj.transform() 

  ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857');

Js-app kullanımı için

   // for projection
  import {transform} from 'ol/proj.js';

  // use this one : transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857')





   var map = new Map({
    layers: layers,
    target: 'map',
    view: new View({
      //center: [-118.246521, 34.049039],
        center: transform([-118.246521, 34.049039], 'EPSG:4326', 'EPSG:3857'),
      zoom: 16
    })
  });

— hoogw
kaynak