手动触发事件时填写e.layer [英] Fill e.layer when firing events manually

问题描述

我正在使用

有没有办法找到并填写 e 的其他属性，以便 fireEvent 可以完美模仿点击吗？谢谢。

更新1 （ https://jsfiddle.net/ziyuang/dfekwzhd/4/ ）：

我试过@ IvanSanchez的 prosthetic-hand ，但仍然没有工作。添加的代码是

  var crs = L.CRS.EPSG3857; 
 var rambaut_lake_latlng = L.latLng（40.99842740667731，-74.16458129882814）; 
 var rambaut_lake_point = crs.latLngToPoint（rambaut_lake_latlng，map.getZoom（））; 
 var southwest_point = crs.latLngToPoint（map.getBounds（）._ southWest，map.getZoom（））; 
 var x = rambaut_lake_point.x  -  southwest_point.x; 
 var y = map.getSize（）。y  - （southwest_point.y  -  rambaut_lake_point.y）; 
 console.log（[x，y]）
 
 var hand = new Hand（）; 
 var finger = hand.growFinger（'mouse'）; 
 finger.moveTo（x，y，0）.down（）。up（）; 
  

手动单击将创建一个Rambaut Lake弹出窗口，但是我没有看到任何弹出窗口

更新2 ：我终于可以使用发生。
在我的情况下，我必须

  var canvas = document.elementFromPoint（left，top）; 
 $（canvas）.happen（{type：'click'，clientX：left，clientY：top}）; 
  

既不是 $（'＃map'）。 'click'，clientX：left，clientY：top}）也不使用jQuery的 触发器 发现 canvas 适用于我。

解决方案

如果你想完美地模仿一个点击，那么你应该在DOM中创建和发送合成的点击事件。这就是 发生 和 prosthetic-hand do。

以这种方式发送的事件将触发Leaflet的事件处理逻辑，就像事件是一个真实的一样。

I am using a L.vectorGrid.protobuf layer (named as pbfLayer) to display vector tiles, and I want to trigger click events by pbfLayer.fileEvent('click', {latlng: <some coordinate>}). But if in this way the event argument e will only have properties latlng, target, and type, while if triggered manually by mouse clicking it will have more properties including layer.

Example: https://jsfiddle.net/ziyuang/dfekwzhd/

Every time a click event is triggered, the console will print the event argument e. A screenshot of console output is as follow, if I first trigger an event manually by clicking and then by programming, using the same coordinate:

Is there a way to find and fill other properties of e, so that fireEvent can perfectly mimic a clicking? Thank you.

Update 1 (https://jsfiddle.net/ziyuang/dfekwzhd/4/):

I tried @IvanSanchez's prosthetic-hand, but still not working. The code added is

var crs = L.CRS.EPSG3857;
var rambaut_lake_latlng = L.latLng(40.99842740667731,-74.16458129882814);
var rambaut_lake_point = crs.latLngToPoint(rambaut_lake_latlng , map.getZoom());
var southwest_point = crs.latLngToPoint(map.getBounds()._southWest, map.getZoom());
var x = rambaut_lake_point.x - southwest_point.x;
var y = map.getSize().y - (southwest_point.y - rambaut_lake_point.y);
console.log([x, y])

var hand = new Hand();
var finger = hand.growFinger('mouse');
finger.moveTo(x, y, 0).down().up();

Manually clicking will create a popup of "Rambaut Lake" but I don't see any popup on the page.

Update 2: I finally get this done by using happen. In my case, I have to

var canvas = document.elementFromPoint(left, top);
$(canvas).happen({type: 'click', clientX: left, clientY: top});

And neither $('#map').happen({type: 'click', clientX: left, clientY: top}) nor using jQuery's trigger on the found canvas works for me.

解决方案

If you want to «perfectly mimic a click», then you should create and dispatch a synthetic click event in the DOM. This is what libraries like happen and prosthetic-hand do.

Events dispatched in that way will trigger Leaflet's event handling logic, just as if the event were a real one.

这篇关于手动触发事件时填写e.layer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！