Làm cách nào để phủ các điểm lat / lon trên một lớp Google trong OpenLayers 2?


13

Tôi bị kẹt khi thêm một điểm vectơ trong lat / lon trên đầu một lớp Google trong OpenLayers. Điểm đang di chuyển khi tôi xoay bản đồ. Điều này không xảy ra nếu tôi thay thế lớp Google bằng một lớp trong WGS84. Làm thế nào tôi có thể sửa lỗi này?

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

Tôi đã cố gắng theo dõi http://docs.openlayers.org/l Library / spherical_mercator.html nhưng không thành công.


Vấn đề của tôi liên quan đến việc sử dụng Jquery trên cùng một trang. Hoạt động tốt nếu tôi lấy tất cả các tham chiếu đến Jquery.

Câu trả lời:


11

Bạn cần thêm một vài thay đổi để có kết quả cần thiết:

  1. Thêm sphericalMercator: true property vào lớp Google của bạn để các lớp vectơ được hiển thị chính xác trên đầu lớp cơ sở Google của bạn (đây là lý do cho hình dạng dịch chuyển).
  2. Thêm vào thuộc tính maxExtent của lớp Google của bạn, nếu không trung tâm của bản đồ sẽ không được đặt chính xác. Phạm vi hiển thị dưới đây là phạm vi của thế giới trong tọa độ Mercator.
  3. Như user1795 đã nói hình học điểm của bạn phải được phân phối lại từ 4326 sang Web Mercator để xuất hiện chính xác trên bản đồ.
  4. Điều này cũng áp dụng cho setCenter LonLat, do đó bạn cũng cần phải chuyển đổi nó.

Mã làm việc dưới đây:

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

Điều đó làm việc tuyệt vời! Có vẻ như OpenLayers không thực sự trực quan khi chuyển đổi. Đây có phải là tùy chọn 'spericalMercator' thực sự cho phép phản hồi không?
underdark

1
Đồng ý rằng nó không trực quan..cách tùy chọn spercicalMercator
geographika

4

Đây là một vấn đề chiếu, bạn phải chuyển đổi hình chiếu của điểm thành lớp cơ sở (google map ở đây). Các mã sau đây nên hoạt động

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

Điều này là do hình chiếu mặc định của google map (hình cầu thủy ngân) là 900913 và là một điểm đơn giản trong lonlat trong 4326.

Vui lòng đảm bảo rằng điểm được đặt là (kinh độ, vĩ độ) chứ không phải là (vĩ độ, kinh độ).


Thêm phép biến đổi làm cho điểm biến mất trên bản đồ của tôi. Phiên bản OpenLayers của tôi là 2.9.1 nếu nó tạo ra sự khác biệt.
underdark

Các point.transform đã lừa tôi!
Stefan

1

Khi bạn đang làm việc với API Google Maps, bạn nên cẩn thận với phiên bản. Mặc định có phiên bản phát triển API Google JS Maps. Kiểm tra trang: http://code.google.com.vn/apis/maps/documentation/javascript/basics.html#Versioning

Và nhóm Google Maps cũng sửa lỗi. Kiểm tra http://code.google.com.vn/p/gmaps-api-issues/wiki/JavascriptMapsAPIv3Cheachog

Trong tương lai, hãy đề cập đến phiên bản API Google Maps trong câu hỏi. v3.3 không có bất kỳ vấn đề nào với Openlayers vì hầu hết được các nhà phát triển sử dụng.


Xin chào Senthil, tôi không chắc các phiên bản API Google Maps của Google ảnh hưởng đến vấn đề của tôi với OpenLayers như thế nào.
underdark

Xin chào Underdark, tôi gặp vấn đề với v3.4 khi tôi sử dụng với Openlayers và sau đó cụ thể sử dụng 3.3 và khi sử dụng phiên bản trung kế google maps, kết quả không thể đoán trước được khi quá trình phát triển đang diễn ra. Bạn đã thử với phiên bản? Mặc dù bạn đang sử dụng openlayers, Google maps api nằm dưới đó.
Senthil

0

Tôi nghĩ đó là một vấn đề chiếu.

Bạn đã thử báo cáo trọng tâm của điểm khi bản đồ chảo chưa? Bạn có thể thấy nếu đôi khi đang thay đổi.

Nhưng từ những gì tôi thấy về mã yuor, bạn sẽ thêm điểm WGS84 vào một corordsys khác


Nhân tiện, bạn đã thử truy vấn hình chiếu của bản đồ bạn có, chỉ để xem nó thực sự được đặt là gì?
Lông

và cuối cùng, xin lỗi, nhưng có một cách để chuyển đổi quan điểm của bạn nếu bạn gặp vấn đề về trình chiếu: var a = new OpenLayers.LonLat (3,53) .transform (ll, OpenLayers.Projection ('EPSG: 900913')) ;
Lông
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.