OpenLayers 3 + YandexMap

Warden · Сообщение **Warden** » 16 сен 2015, 16:46

Здравствуйте! Такой вопрос, как можно подключить к openLayers3 слой с картами Yandex?

Warden · Сообщение **Warden** » 25 сен 2015, 15:34

Для тех кто может быть столкнется с такой проблемой, как смещение координат при подключение YandexMap.
Исправить это можно, подключив библиотеку Proj4js. Описав проекцию YandexMap (EPSG:3395). Для примеру приведу свой код:

Код: Выделить всё

proj4.defs('EPSG:3395', '+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m +no_defs');
	view = new ol.View({
		center: [4701182.98765148, 7492051.764399836],
		zoom: 5,
		maxZoom: 18,
		projection:'EPSG:3395',
		minZoom: 2
	});

Прилагаю скриншоты до и после:

: OpenStreetMap; OSM.jpeg (65.6 КБ) 21686 просмотров

: YandexMap без подключения proj4js; YandexError.jpeg (120.33 КБ) 21686 просмотров

: Корректное отображение YandexMap; YandexCorr.jpeg (56.84 КБ) 21686 просмотров

а какой источник (ol.source) и какие параметры (улр....) вы используете для Яндекса?

Warden · Сообщение **Warden** » 28 сен 2015, 14:28

Код: Выделить всё

var yandexMapLayerMap = new ol.layer.Tile({
		'title': 'Яндекс Карты',
		type: 'base',
		projection: 'EPSG:3395',
		source: new ol.source.XYZ({
			url: 'http://vec02.maps.yandex.net?l=map&v=2.8.3&z={z}&x={x}&y={y}'
		})
	});

	var yandexMapLayerSat = new ol.layer.Tile({
		'title': 'Яндекс Спутник',
		zIndex: 997,
		projection: 'EPSG:3395',
		visible: false,
		source: new ol.source.XYZ({
			url: 'http://sat02.maps.yandex.net?l=sat&v=2.8.3&z={z}&x={x}&y={y}'
		})
	});

Первый слой, схема карта, второй слой спутниковые данные.

AlexSek · Сообщение **AlexSek** » 26 фев 2016, 10:03

Добавлю в эту ветку тк вроде по теме, вроде все сделал по инструкции а смещение никуда не делось, что не так?

Код: Выделить всё

<head>
       <link rel="stylesheet" href="http://openlayers.org/en/v3.13.1/css/ol.css" type="text/css">
	<script src="http://openlayers.org/en/v3.12.1/build/ol.js"></script>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/2.2.1/proj4.js"></script>
  </head>
  <body>
     <div id="map" class="map"></div>
    <script>
           proj4.defs('EPSG:3395', '+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +ellps=WGS84 +datum=WGS84 +units=m +no_defs');

            var view = new ol.View({
                center: [4187136.7833, 7509542.7662],
                zoom: 10,
                maxZoom: 18,
                projection: 'EPSG:3395',
                minZoom: 2
            });

            var yandexMapLayerMap = new ol.layer.Tile({
                type: 'base',
                projection: 'EPSG:3395',
                source: new ol.source.XYZ({
                    url: 'http://vec02.maps.yandex.net?l=map&v=2.8.3&z={z}&x={x}&y={y}'
                })
            });
			
            var rosreg = new ol.layer.Tile({                
                projection: 'EPSG:900913',
                source: new ol.source.TileArcGISRest({
                    url: 'http://maps.rosreestr.ru/arcgis/rest/services/Cadastre/Cadastre/MapServer/'
                })
            });
			
			var layersGroup = new ol.layer.Group({
                layers: [
                    yandexMapLayerMap,
                    rosreg,
                ],
            });

            var map = new ol.Map({
                target: 'map',
                view: view
        });

		map.setLayerGroup(layersGroup);
    </script>
  </body>
</html>

Warden · Сообщение **Warden** » 01 мар 2016, 10:51

AlexSek писал(а):Добавлю в эту ветку тк вроде по теме, вроде все сделал по инструкции а смещение никуда не делось, что не так?

Как то подробнее хотелось бы узнать. Насколько большое смещение? Яндекс карты даже между собой имеют небольшое смещение https://yandex.ru/blog/mapsapi/36655, а что уж тут говорить относительно других, там итак подавно. Если смещение большое, то это скорее всего что у вас проекция второго слоя Googleское, я использовал EPSG:3857 или EPSG:4326, уже не помню точно.

Сообщение **Denis Rykov** » 20 окт 2016, 08:57

Тоже возникли проблемы с Yandex Map. Пытаюсь отобразить точку с известными координатами, OpenLayers трансформирует их правильно, а вот сама подложка почему-то смещена, пример.

gornak · Сообщение **gornak** » 20 окт 2016, 10:07

Denis Rykov писал(а):Тоже возникли проблемы с Yandex Map.

тоже мучился, перепробовал всякие варианты- в результате перешел на leaflet, там нет смещения

Сообщение **Denis Rykov** » 20 окт 2016, 18:34

Совместными усилиями разобрались. Вообщем получается так, что для того, чтобы отобразить подложку Yandex-а недостаточно одного лишь описания проекции EPSG:3395. Оказывается, Yandex использует тайловую сетку такую же как OpenStreetmap, а именно:

Код: Выделить всё

[-20037508.342789244, -20037508.342789244, 20037508.342789244, 20037508.342789244]

То есть сетка натянута на гуглошарик (сфера, используемая в проекции EPSG:3857), а не на эллипсоид. Я почему-то думал, что раз проекция EPSG:3395, то и сетка будет:

Код: Выделить всё

[-20037508.34, -19994875.25, 20037508.34, 19994875.25]

Вычислено так:

Код: Выделить всё

$ echo 20037508.342789244 20037508.342789244 | cs2cs +init=epsg:3857 +to +init=epsg:3395
20037508.34	19994875.25 0.00

То есть я ошибочно предполагал, что координаты верхнего левого угла верхнего левого тайла (0,0) должны быть (-20037508.34, -19994875.25). В Yandex же координаты левого верхнего угла левого верхнего тайла такие же как и в OSM - (-20037508.342789244, -20037508.342789244), однако интересный момент - раз там нет данных (а нет их там потому что проекция данных EPSG:3395), то Yandex их и не рендерит. Вот пример: на 20 уровне данные по Y начинаются только с Y=557 тайла: http://vec01.maps.yandex.net/tiles?l=map&x=0&y=557&z=19, выше (Y=556 и далее) тайлов просто нет.

Теперь относительно того, что происходит в OpenLayers. Раз мы указали, что проекция тайла у нас EPSG:3395, то для определения сетки он идёт сюда, а потом сюда и пытается вычислить охват по проекции. Но в нашем случае проекция не содержит в себе информации об охвате и OL (видно по коду) в качестве основы сетки выбирает радиус некой нормальной сферы (6370997 м), что отличается от радиуса гуглошарика (6378137 м). Отсюда и все неприятности.

Варианты решения проблемы: либо мы указываем охват для проекции (демо):

Код: Выделить всё

ol.proj.get('EPSG:3395').setExtent(
  [-20037508.342789244, -20037508.342789244, 20037508.342789244, 20037508.342789244]
);

Либо указываем параметры сетки в описании слоя, (демо):

Код: Выделить всё

source: new ol.source.XYZ({
  url: 'http://vec01.maps.yandex.net/tiles?l=map&x={x}&y={y}&z={z}',
  projection: 'EPSG:3395',
  tileGrid: ol.tilegrid.createXYZ({
    extent: [-20037508.34, -20037508.34, 20037508.34, 20037508.34]
  })
})

Вот ещё один пример - наложения Yandex на OSM.

Форумы GIS-Lab.info

OpenLayers 3 + YandexMap

OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Re: OpenLayers 3 + YandexMap

Кто сейчас на конференции