在Leaflet弹出窗口中查找SVG图形的示例

时间:2013-05-15 16:41:17

标签: svg d3.js leaflet

我正在使用Leaflet和D3构建地图。我将这些点作为传单层引入。我想在弹出窗口中为这些包含SVG图形的点绑定弹出窗口。

有没有人见过这样的例子?我认为这是可能的,因为弹出窗口允许HTML,但我想找到一个有效的例子。

谢谢,

1 个答案:

答案 0 :(得分:0)

这绝对有可能。像往常一样在弹出窗口中使用HTML。例如,您可以在弹出窗口中添加<div class="popupGraph"/>元素。然后只需像往常一样使用JavaScript来显示该元素中的任何内容。

编辑:我将再添加一个例子。我有一个非常不同的外观/感觉Popup,所以我做的是扩展我自己。

myPopup = L.Popup.extend({ ... });

当我初始化弹出窗口时,我为div添加了一个包装器,稍后我将使用JavaScript Graph API进行扩展(我使用JQuery Sparklines http://omnipotent.net/jquery.sparkline/)。

this._graphContainer = L.DomUtil.create('div', 'myGraph', this.container);

然后我可以像对待任何其他图一样对待它。

$(this._graphContainer).sparkline({ /*my options here*/ });

这将在我的弹出窗口中显示实时更新图。