OpenLayers에서 벡터 피처 / 레이어 클릭의 좌표는 어떻게 얻습니까?

사용자가 OpenLayers 맵에서 벡터 기능을 클릭 할 때 클릭 좌표를 가져와야합니다. SelectControl은 클릭 한 기능 만 제공하며 클릭 좌표는 제공하지 않습니다. 어쨌든 벡터 클릭의 좌표를 얻으려면? 사용자 클릭 시점에 AnchoredBubble을 표시해야합니다.

실제로 클릭 이벤트 샘플 은 원하는 것을 제공합니다.

OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
            defaultHandlerOptions: {
                'single': true,
                'double': false,
                'pixelTolerance': 0,
                'stopSingle': false,
                'stopDouble': false
            },

            initialize: function(options) {
                this.handlerOptions = OpenLayers.Util.extend(
                    {}, this.defaultHandlerOptions
                );
                OpenLayers.Control.prototype.initialize.apply(
                    this, arguments
                ); 
                this.handler = new OpenLayers.Handler.Click(
                    this, {
                        'click': this.trigger
                    }, this.handlerOptions
                );
            }, 

            trigger: function(e) {
                var lonlat = map.getLonLatFromViewPortPx(e.xy);
                alert("You clicked near " + lonlat.lat + " N, " +
                                          + lonlat.lon + " E");
            }

        });

필요한 경우 좌표를 픽셀로 변환 하여 팝업을 표시 할 수 있습니다 .

편집-피처 선택시에만 좌표를 가져옵니다 .

   var options = {
    onSelect: getCoordinates,
};

var selectEt = new OpenLayers.Control.SelectFeature(mylayer, options);
map.addControl(selectEt);

function getCoordinates(e) {
 // this should work
 var lonlat = map.getLonLatFromViewPortPx(e.xy);
 alert("You clicked near " + lonlat.lat + " N, " +
                                          + lonlat.lon + " E");
}

API는 SelectFeature컨트롤 에서 클릭 위치를 가져 오는 방법을 제공하지 않지만 반드시 클릭 해야합니다. 사소한 추가가 될 것입니다 ( 이벤트에 xy포함 featureselected). 이 티켓을 발권하면 첫 번째 단계가됩니다.

그 동안 SelectFeature컨트롤에서 사용하는 기능 처리기에서 마우스 이벤트에 액세스 할 수 있습니다 . 따라서 다음과 같은 리스너가있을 수 있습니다.

layer.events.on({featureselected: function(event) {
    // should be event.xy, but it's not available currently
    var pixel = control.handlers.feature.evt.xy;
    var location = map.getLonLatFromPixel(pixel);
    alert("You clicked near " + location);
});

이것은 SelectFeature컨트롤과 맵에 대한 참조가 있다고 가정합니다 .

다음을 사용하여 클릭 이벤트의 위도를 얻을 수있었습니다.

clickFeature핸들러 내부

var clickedlonlat = 
    Ext.getCmp("coreRef").parent.map.getLonLatFromPixel(
        new OpenLayers.Pixel(
            selectFeatureReference.handlers.feature.evt.layerX,
            selectFeatureReference.handlers.feature.evt.layerY
        ));

어디에 당신이 만든 selectFeatureReference참조 SelectFeature입니다.

map.on('click', function(evt){
    console.log(ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326'));
});

이것은
[-1.1645507812500016, 53.2257684357902]
영국을 클릭 할 때 다음과 같은 좌표를 얻기 위해 v3.8.2에서 알아 냈습니다 .

사용할 수 있습니다 feature.getBounds().getCenterLonLat(). 점 / 선 / 다각형 유형 기능에 사용됩니다. 그리고 그것이 모두 작동하기 때문에 그것이 무엇인지 알 필요가 없습니다.

내가했던 것처럼이 오래된 질문을 우연히 발견 한 경우, 이번 OpenLayers 최신 릴리스 (3.20.0) 에서 Select 이벤트는 e.mapBrowserEvent.coordinate어디 에서 클릭 위치를 얻을 수 있습니다 e.