使用geoJson数据在传单弹出窗口中创建图形

我正在使用传单的地图上工作,并使用GeoJson格式的文件中的数据填充.我的首要目标是将图表放入地图上每个标记的小册子弹出窗口中.

获取每个功能的标记并使弹出窗口打开非常容易.但是,我发现很难使用D3添加到弹出窗口.

为了简单起见,我目前的目标是使用D3在每个leaflet popup div中创建一个svg并绘制一个正方形.

我找到了一些例子,其中人们使用D3在传单弹出窗口中创建图形,但是它们都没有使用geoJson和onEachFeature函数.这是其中一个例子:http://jsfiddle.net/6UJQ4/

这是我的代码的相关部分:

L.geoJson( data,  {
    style: function (feature) {
        return { opacity: 0, fillOpacity: 0.5, fillColor: "#0f0" };
    },
    onEachFeature: function(feature, layer){

        var graph_container = '
';

        layer.bindPopup(feature.properties.name + '
' + graph_container);    

        var svg = d3.select("#graph").selectAll("svg").append("svg").attr("width", 50).attr("height", 200);   

        var rectangle = svg.append("rect").attr("width", 25).attr("height", 25);

    }
}).addTo(map);

我相信我遇到了问题,因为D3无法找到graph_container div但是我对如何解决这个问题感到有些困惑.

如果有人有任何使用D3,Leaflet和geoJson的经验,可以向我解释如何让我的方块显示在弹出窗口中,或者是否有人知道可以帮助我的源.我会很感激.提前致谢!

更新:比特已经解决了我的问题!如果有人需要在Leaflet弹出窗口中结合GeoJson使用D3的工作示例,Bits会在评论中发布它,但我会在这里发布它:http://jsfiddle.net/2XfVc/132/