Định dạng đầu ra kiểm soát MousePosition trong OpenLayers 3

Question

Tôi thấy vị trí chuột ở OpenLayers 3 với sự kiểm soát sau

var mousePositionControl = new ol.control.MousePosition({ 
    coordinateFormat: ol.coordinate.createStringXY(2), 
    projection: 'EPSG:4326', 
    undefinedHTML: ' ' 
}); 

Nhưng kết quả cho thấy vị trí chuột như Lớn, Lạt hơn Lạt, Lớn.

Đây là jsfiddle example.

Làm cách nào để đảo ngược thứ tự sao cho nó là Lat, Lon?

Answer 1

gì làm việc cho tôi thêm một nhiều loại điều khiển bao gồm Lat, Long là:

var controls = [ 
 
    new ol.control.Attribution(), 
 
    new ol.control.MousePosition({ 
 
    projection: 'EPSG:4326', 
 
    coordinateFormat: function(coordinate) { 
 
     return ol.coordinate.format(coordinate, '{y}, {x}', 4); 
 
    } 
 
    }), 
 
    new ol.control.ScaleLine(), 
 
    new ol.control.Zoom(), 
 
    new ol.control.ZoomSlider(), 
 
    new ol.control.ZoomToExtent(), 
 
    new ol.control.FullScreen() 
 
];

(sửa đổi từ the book of openlayers 3)

Answer 2

Bạn thay đổi coordinateFormat của bạn - "chức năng tiêu chuẩn" tới chức năng tùy chỉnh:

var myFormat = function(dgts) 
{ 
    return (
    function(coord1) { 
     var coord2 = [coord1[1], coord1[0]]; 
     return ol.coordinate.toStringXY(coord2,dgts); 
    });   
} 

var mousePositionControl = new ol.control.MousePosition({ 
    coordinateFormat: myFormat(2), // <--- change here 
    projection: 'EPSG:4326', 
    className: 'custom-mouse-position', 
    target: document.getElementById('mouse-position'), 
    undefinedHTML: '&nbsp;' 
}); 

thấy bạn sửa đổi fiddle

Answer 3

Một thay thế:

var template = 'LatLon: {y}, {x}'; 

var mousePositionControl = new ol.control.MousePosition({ 
    coordinateFormat: function(coord) {return ol.coordinate.format(coord, template, 2);}, 
    projection: 'EPSG:4326', 
    undefinedHTML: ' ' 
    }); 

Answer 4

Cũng hữu ích để hiển thị trong Độ, Phút, Giây:

controls: ol.control.defaults().extend([ 
     new ol.control.ScaleLine({ 
      units: 'nautical' 
     }), 
     new ol.control.MousePosition({ 
      coordinateFormat: function(coord) { 
       return ol.coordinate.toStringHDMS(coord); 
      }, 
      projection: 'EPSG:4326', 
      className: 'custom-mouse-position', 
      target: document.getElementById('mouse-position'), 
      undefinedHTML: ' ' 
     }) 
    ]), 

Answer 5

trình trong OpenLayers 3.7.0. Sử dụng proj4js chiếu lại tọa độ để một chiếu khác nhau do xem bản đồ là trong 'EGPS: 3857':

var proj1 = proj4.defs('EPSG:4326'); 
 
var proj2 = proj4.defs('EPSG:3857'); 
 

 
var myFormat = function(digits) { 
 
    return (
 
    function(originalCoordinates) { 
 
     var reprojectedCoordinates = proj4(proj2, proj1).forward(originalCoordinates); 
 
     var switchedCoordinates = [reprojectedCoordinates[1], reprojectedCoordinates[0]]; 
 
     return ol.coordinate.toStringXY(switchedCoordinates, digits); 
 
    } 
 
); 
 
} 
 

 
var mousePositionControl = new ol.control.MousePosition({ 
 
    coordinateFormat: mojFormat(10), 
 
    projection: 'ESPG:4326', 
 
    undefinedHTML: '&nbsp' 
 
}); 
 
// map.addControl(mousePositionControl); //equivalent to setMap 
 
mousePositionControl.setMap(map);