在d3地图中显示特定纬度和经度的圆圈

时间:2014-07-02 08:45:54

标签: javascript svg map d3.js

我正在使用 .svg 文件绘制印度地图。它根据需要显示印度地图。 现在我想使用纬度和经度在此地图上显示圆圈。

如何使用地方数组绘制圆圈?任何源代码和网络链接将不胜感激。

我的index.html代码如下所示,我使用的svg文件是here。 我的脚本的最终输出是here

** 还请指导我,这是显示地图的正确方法吗?

    <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>
        <script type="text/javascript" src="d3.v3.min.js"></script>
        <style type="text/css">
        </style>
    </head>

    <body>
        <script type="text/javascript">
            var places = [
              {
                name: "GUNA",
                location: {
                  latitude: 24.5429,
                  longitude: 77.1032
                }
              },
              {
                name: "THE DANGS",
                location: {
                  latitude: 20.4633,
                  longitude: 73.4646
                }
              }
            ]

            d3.xml("toilet.svg", function(xml) {
                var x = document.importNode(xml.documentElement, true);
                document.body.appendChild(x)
            });
        </script>
    </body>
</html>

0 个答案:

没有答案