Question

我正在使用OpenLayers 3.10.1和以下代码：

map.on('click', function (map, evt) {
    var mouseCoords = [evt.originalEvent.offsetX, evt.originalEvent.offsetY];

    alert(mouseCoords);
});

当我在IE或Chrome中尽可能靠近地图的左上角点击时，我得到一个警告，其中鼠标坐标偏离地图div的左上角，即像[3， 4]。

但是当我尝试相同的东西时，我得到相对于浏览器窗口而不是地图div的鼠标坐标。有人知道为什么吗？我是否使用过时的方法来查找鼠标坐标（最终我可以计算出哪个特征被点击了）？

Answer 1

一些替代方案：

map.on('click', function(evt){
    console.info(evt.pixel);
    console.info(map.getPixelFromCoordinate(evt.coordinate));
});

Answer 2

以下代码适用于我（openlayer 4.4，angular 4 +）

_initMap() {
  console.info("_initMap");
  this.mapW = new ol.Map({
      layers: [
        new ol.layer.Tile({
          source: new ol.source.OSM()
        })
      ],
      target: 'myMapDiv',
      controls: ol.control.defaults({
          attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
            collapsible: false
          })
      }),
      view: new ol.View({
          center: ol.proj.fromLonLat([this.lon, this.lat]);,
          zoom: 12
      })
    });
  const theMap = this.mapW; 
  // display on click
  this.mapW.on('click', function(evt) {
    /* // you want to detect feature click
    var feature = theMap.forEachFeatureAtPixel(evt.pixel,
        function(feature, layer) {
          return feature;
        });
    if (feature) {
      var fname = feature.getProperties().name;
      console.info("feature clicked:" + fname);
      return;
    }
    */
    console.info(evt.coordinate);
    console.info(ol.proj.toLonLat(evt.coordinate)); //   <=== coordinate projection
  });

JS控制台结果（点击法国格勒诺布尔附近时）：

(2) [637000.3050167585, 5652336.68427412]
(2) [5.722271099853512, 45.19540527485873]

Firefox中的map.on（'click'）坐标错误

2 个答案: