Question

现在我想从多边形对象单击中触发fancybox事件。这是我的目标：

new L.Polygon([
        [79.07181, -100.63477], 
        [79.06348, -90.43945], 
        [77.52312, -90.52734], 
        [77.50412, -94.21875], 
        [77.41825, -94.35059], 
        [77.40868, -96.72363], 
        [77.51362, -96.81152], 
        [77.53261, -100.63477], 
        [79.07181, -100.63477]
  ], {'label': popup_flor, 'popup': content_flor}),

变量＆＃39; content_flor＆＃39;包含建筑物描述。我没有展示这个描述，而是想提出fancybox iframe。

另一位团队成员提供了建筑物描述的链接列表。

    <a class="fancybox fancybox.iframe" data-fancybox-type="iframe" href="flrs.html">The Building Name</a>

我想要做的是通过点击访问者点击多边形对象本身时发生的链接来执行代码。是否有可能做到这一点？像这样的伪代码：

  new L.Polygon([
        [79.07181, -100.63477],
        ...
        [79.07181, -100.63477]
  ], {'label': popup_flor, 'popup': callFancyboxIframe('flrs.html')}),

谢谢！

Answer 1

您可以使用多边形的click事件执行您想要的操作，在您打开fancybox的情况下。

//Handle click on polygon
var onPolyClick = function(event){
    //open fancybox here
    var label = event.target.options.label;
    var content = event.target.options.popup;
    var otherStuff = event.target.options.otherStuff;
    alert("Clicked on polygon with label:" +label +" and content:" +content +". Also otherStuff set to:" +otherStuff);
};
//Create polygon
var popup_flor ="MyLabel";
var content_flor ="MyContent";
var poly = new L.Polygon([
        [79.07181, -100.63477], 
        [79.06348, -90.43945], 
        [77.52312, -90.52734], 
        [77.50412, -94.21875], 
        [77.41825, -94.35059], 
        [77.40868, -96.72363], 
        [77.51362, -96.81152], 
        [77.53261, -100.63477], 
        [79.07181, -100.63477]
  ], {'label': popup_flor, 'popup': content_flor, 'otherStuff': 'abc123'});
poly.on('click', onPolyClick);

Example

在leaflet.js中，如何从多边形对象单击中触发fancybox事件？

1 个答案: