Блог

Главная - Вопросы по программированию - просмотр.calculateExtent, возвращающий [NaN, NaN, NaN,NaN]

просмотр.calculateExtent, возвращающий [NaN, NaN, NaN,NaN]

#openlayers-3

#openlayers-3

Вопрос:

Я использую OpenLayers 3.18.2. Моя карта — olMap, а мой вид — olView. Я хочу получить размер видимой карты на экране.

 olView.getCenter() = [2142126.3712395,-4085536.2324793]
olView.getZoom() = 16
olView.getResolution() = 2.388657133911758
olMap.getSize() = [1906,904]
olView.calculateExtent(olMap.getSize()) = [NaN,NaN,NaN,NaN]

Почему это не возвращает надлежащую степень?

Ответ №1:

После сна, учитывая отзывы здесь и еще немного поэкспериментировав, я нашел причину проблемы: координаты поступают из вызова AJAX, который возвращает строки. Я вызываю

 olView.setCenter([x, y])

когда x и y являются строками, вид карты изменяется на правильное центральное положение, но затем не функционирует должным образом. Изменение вызова на

 olView.setCenter([parseFloat(x), parseFloat(y)])

заставляет карту работать должным образом.

Ответ №2:

На самом деле у вас не должно возникнуть проблем с получением экстента карты, поскольку код кажется правильным.Моя карта определяется как map и map.getView().calculateExtent(map.getSize()).Я смог получить степень.Вы можете видеть на скриншоте

Комментарии:

1. Я тестировал в IE11, FireFox и Chrome, используя как мою пользовательскую сборку, так и полную сборку OL3.18.2 и получаю тот же результат. NaN

Ответ №3:

В интересах продолжения работы я сам рассчитал степень:

 var center = olView.getCenter();
var res = olView.getResolution();
var pxSize = olMap.getSize();
var cx = parseFloat(center[0]);
var cy = parseFloat(center[1]);
var dx = res * pxSize[0] / 2;
var dy = res * pxSize[1] / 2;
var extent = [cx - dx, cy - dy, cx   dx, cy   dy];

olView.getCenter() возвращает массив строк, отсюда и parseFloat.

Ответ №4:

Вот рабочий jsFiddle карты, похожей на вашу (с использованием OSM в качестве базовой карты). calculateExtent(), похоже, работает правильноhttp://jsfiddle.net/e969kjro/1 /

 <div id="map" class="map"></div>
<button id="myButton" onclick="test()">Click Me</button>

var view = new ol.View({
    center: [2142126.3712395,-4085536.2324793],
    zoom: 16
    })

var map = new ol.Map({
    target: 'map',
    layers: [
        new ol.layer.Tile({
            source: new ol.source.OSM()
        })
    ],
    view: view
});

window.test = function () {
    alert(view.calculateExtent(map.getSize()));
}