Як накласти точки Lat / lon на шар Google у OpenLayers 2?


13

Я застряг, додаючи векторну точку в lat / lon поверх шару Google у OpenLayers. Справа рухається, коли я панорумую карту. Це не відбувається, якщо я заміню шар Google на шар у WGS84. Як я можу це виправити?

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]);

Я намагався наслідувати http://docs.openlayers.org/library/spherical_mercator.html, але без успіху.


Моя проблема пов'язана з використанням Jquery на одній сторінці. Добре працює, якщо я отримаю всі посилання на Jquery.

Відповіді:


11

Вам потрібно додати кілька змін, щоб отримати необхідні результати:

  1. Додайте властивість sphericalMercator: true у свій шар Google, щоб векторні шари правильно відображалися поверх базового шару Google (це є причиною зміщення геометрії).
  2. Додайте у властивість maxExtent шару Google, інакше центр карти не буде встановлений правильно. Розмір, показаний нижче, - це розмір світу в координатах Меркатора.
  3. Як заявив user1795, геометрію точки потрібно повторно відхилити від 4326 до Web Mercator, щоб правильно відобразитися на карті.
  4. Це стосується і setCenter LonLat, тому вам також потрібно перетворити це.

Робочий код нижче:

            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]);

Це чудово працює! Схоже, OpenLayers не дуже інтуїтивно зрозумілий, коли мова йде про трансформації. Чи варіант "spericalMercator" насправді дозволяє перепроектувати?
underdark

1
Погодьтеся, це не інтуїтивно зрозуміло. Опція sfericalMercator
geographika

4

Це проблема проекції, ви повинні перетворити проекцію точки в проект базового шару (тут google map). Наступний код повинен працювати

    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])

Це тому, що за замовчуванням проекція google map (сферичний меркатор) становить 900913, а для простої точки в lonlat в 4326 році.

Переконайтеся, що точка задана як (довгота, широта), а не як (широта, довгота).


Додавання перетворення змушує точку зникнути на моїй карті. Моя версія OpenLayers - це 2.9.1, якщо вона має значення.
андеркап

Point.transform зробив для мене трюк!
Стефан

1

Працюючи з JS API Карт Google, слід бути уважними щодо версії. За замовчуванням слід розробити версію розробки API JS Maps Google. Перевірте сторінку: http://code.google.com/apis/maps/documentation/javascript/basics.html#Versioning

І команда JS Google Maps виправляє помилки. Перевірте http://code.google.com/p/gmaps-api-isissue/wiki/JavascriptMapsAPIv3Changelog

Надалі в запитанні згадайте версію API Google Maps. v3.3 не виникло проблем із Openlayers, як це в основному використовують розробники.


Привіт, Сентіл, я не впевнений, як версії API Google Maps JS впливають на мою проблему з OpenLayers.
underdark

Привіт Underdark, у мене виникли проблеми з v3.4, коли я використовував Openlayers, а потім спеціально використовував 3.3 і коли використовував версію магістралі google maps, результати непередбачувані, оскільки триває розробка. Ви пробували з версією? Навіть незважаючи на те, що ви використовуєте відкриті шари, Google відображає основні підходи до цього.
Сентіль

0

Я думаю, що це питання прогнозування.

Ви намагалися повідомити про центроїд точки, коли карта простежує? Ви можете побачити, чи щось змінюється.

Але з того, що я бачу у вашому коді, ви додасте WGS84 вказівку на різні corordsys


До речі, ви спробували запитати проекцію карти, яку ви маєте, лише щоб побачити, що вона насправді встановлена?
Волохатий

і нарешті, вибачте, але є спосіб перетворити свою точку, якщо у вас виникають проблеми з проекцією: var a = новий OpenLayers.LonLat (3,53) .transform (ll, новий OpenLayers.Projection ('EPSG: 900913')) ;
Волохатий
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.