如何从开放层地图中获取纬度/液化值

How to get lat/lng values from openlayers map

本文关键字:纬度 获取 地图      更新时间:2023-09-26

我想在开放图层地图上获取标记的纬度/纬度:

...
var dragVectorC = new OpenLayers.Control.DragFeature(vectorLayer, {
            onComplete: function (feature) {
        var lonlat = new OpenLayers.LonLat(feature.geometry.x, feature.geometry.y);
                alert(lonlat.lat + ', ' + lonlat.lon);

但我得到的价值是:

5466016.2318036, 2328941.4188153

我尝试了不同的方法来转换它,但我总是错过一些东西。
我做错了什么?

var map = new OpenLayers.Map('map');
    var layer = new OpenLayers.Layer.OSM("Simple OSM Map");
    var vector = new OpenLayers.Layer.Vector('vector');
    map.addLayers([layer, vector]);
    map.setCenter(
        new OpenLayers.LonLat(-71.147, 42.472).transform(
            new OpenLayers.Projection("EPSG:4326"),
            map.getProjectionObject()
        ), 12
    );
    var pulsate = function (feature) {
        var point = feature.geometry.getCentroid(),
            bounds = feature.geometry.getBounds(),
            radius = Math.abs((bounds.right - bounds.left) / 2),
            count = 0,
            grow = 'up';
        var resize = function () {
            if (count > 16) {
                clearInterval(window.resizeInterval);
            }
            var interval = radius * 0.03;
            var ratio = interval / radius;
            switch (count) {
                case 4:
                case 12:
                    grow = 'down'; break;
                case 8:
                    grow = 'up'; break;
            }
            if (grow !== 'up') {
                ratio = -Math.abs(ratio);
            }
            feature.geometry.resize(1 + ratio, point);
            vector.drawFeature(feature);
            count++;
        };
        window.resizeInterval = window.setInterval(resize, 50, point, radius);
    };
    var geolocate = new OpenLayers.Control.Geolocate({
        bind: false,
        geolocationOptions: {
            enableHighAccuracy: false,
            maximumAge: 0,
            timeout: 7000
        }
    });

    map.addControl(geolocate);
    var firstGeolocation = true;
    geolocate.events.register("locationupdated", geolocate, function (e) {
        vector.removeAllFeatures();
        var circle = new OpenLayers.Feature.Vector(
            OpenLayers.Geometry.Polygon.createRegularPolygon(
                new OpenLayers.Geometry.Point(e.point.x, e.point.y),
                e.position.coords.accuracy / 2,
                40,
                0
            ),
            {},
            style
        );
        vector.addFeatures([
            new OpenLayers.Feature.Vector(
                e.point,
                {},
                {
                    graphicName: '', // cross
                    strokeColor: '', // #f00
                    strokeWidth: 2,
                    fillOpacity: 0,
                    pointRadius: 10
                }
            ),
            circle
        ]);
        if (firstGeolocation) {
            map.zoomToExtent(vector.getDataExtent());
            pulsate(circle);
            firstGeolocation = false;
            this.bind = true;
        }
        // create marker
        var vectorLayer = new OpenLayers.Layer.Vector("Overlay");
        var feature = new OpenLayers.Feature.Vector(
         new OpenLayers.Geometry.Point(e.point.x, e.point.y),
         { some: 'data' },
         { externalGraphic: 'http://opportunitycollaboration.net/wp-content/uploads/2013/12/icon-map-pin.png', graphicHeight: 48, graphicWidth: 48 });
        vectorLayer.addFeatures(feature);
        map.addLayer(vectorLayer);
        var dragVectorC = new OpenLayers.Control.DragFeature(vectorLayer, {
            onComplete: function (feature) {
                alert('x=' + feature.geometry.x + ', y=' + feature.geometry.y);
            }
        });
        map.addControl(dragVectorC);
        dragVectorC.activate();
    });
    geolocate.events.register("locationfailed", this, function () {
        OpenLayers.Console.log('Location detection failed');
    });
    var style = {
        fillColor: '#000',
        fillOpacity: 0,
        strokeWidth: 0
    };
    $(window).load(function () {
        initMap();
    });

    function initMap() {
        vector.removeAllFeatures();
        geolocate.deactivate();
        geolocate.watch = false;
        firstGeolocation = true;
        geolocate.activate();
    }
您需要将

点几何的 X,Y 转换为 LonLat,然后将其从地图的投影转换为 WGS84(又名 EPSG:4326)以获得"常规"的 lon/lat:

   var dragVectorC = new OpenLayers.Control.DragFeature(vectorLayer, {
        onComplete: function (feature) {
            var lonlat = new OpenLayers.LonLat(feature.geometry.x, feature.geometry.y).transform(
                map.getProjectionObject(),
                new OpenLayers.Projection("EPSG:4326")
            ))
            alert(lonlat.lat + ', ' + lonlat.lon)

> 2022 年更新:

import { toLonLat } from 'ol/proj'
let lonLat = toLonLat(coordinates)