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

Question

我正在用Leaflet和D3制作一张地图。我把这些点作为一个宣传层。我想为这些点绑定弹出窗口，包括在弹出窗口中SVG图形。

有没有人见过这样的例子？我认为这是可能的，因为HTML是允许在弹出窗口，但我想找到一个工作的例子。

谢谢,

李

Answer 1

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

编辑:我将添加更多的示例。我对弹出窗口有一个非常不同的外观/感觉，所以我所做的就是扩展我自己的。

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

当我初始化弹出窗口时，我为一个div添加了一个包装器，稍后我将使用JavaScript Graph API (我使用JQuery Sparklines )对其进行膨胀。

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

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

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

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