0

我想在同一个谷歌地图中绘制多个多边形，我需要做的是从列表框中读取纬度，它们是这样的：

lat1,lng1,1 lat2,lng2,1 lat3,lng3,1 lat1,lng1,2 lat2,lng2,2 lat3,lng3,2

并根据右侧的值（1或2）我将读取相应的纬度并绘制多边形，实际上我正在这样做，在我的循环中绘制了多边形但是有一条线连接它们，我能做什么？，我的意思是，如果没有这些连接线，我如何绘制多边形？，非常感谢！

这是我的代码：

    <script type="text/javascript">

        var bermudaTriangle=[];
        var places = [];
        var geoDataSplit;
        function initialize() {

            var mapDiv = document.getElementById('map_canvas');
            var coords = document.getElementById("selPoly");

            var map = new google.maps.Map(mapDiv, {
                center: new google.maps.LatLng(19.3162200000000, -99.2204930000000),
                zoom: 12,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });

            var latlng;

            for (var i = 0; i < coords.options.length; i++) 
                {
                    var geoData = coords.options[i].text;
                    geoDataSplit = geoData.split(",");
                    var counter = geoDataSplit[2];

                    for (geoDataSplit[2] = 1; geoDataSplit[2] <= 2; geoDataSplit[2]++)

                    {


                        if (counter == geoDataSplit[2]) {

                            latlng = new google.maps.LatLng(parseFloat(geoDataSplit[0]), parseFloat(geoDataSplit[1]));
                            places.push(latlng);

                            bermudaTriangle = new google.maps.Polygon({
                                paths: places,
                                strokeColor: "#FF0000",
                                strokeOpacity: 0.8,
                                strokeWeight: 2,
                                fillColor: "#FF0000",
                                fillOpacity: 0.35
                            });
                        }
                    }
                }
                bermudaTriangle.setMap(map);
        }
        google.maps.event.addDomListener(window, 'load', initialize);
    </script>
    </head>


  <body style="font-family: Arial; border: 0 none;">
    <form id="form1" runat="server">
    <div>
        <asp:ListBox ID="selPoly" runat="server"></asp:ListBox>
    </div>
    </form>

    <div id="map_canvas" style="width: 1024px; height: 768px"></div>
  </body>
4

1 回答 1

0

绘制多边形是在点之间绘制线（您给出的后续点，可能还有列表中的第一个和最后一个点）。当它们包围一个空间时 - 你会得到一个多边形并且空间充满了颜色。这条线总是在两个后续点之间。

如果您想要单独的多边形，您必须创建单独的多边形（使用new google.maps.Polygon）。如果你得到的只是一个点列表，你可以想出或找到一个算法来检测空间是否已经被封闭，并且应该创建一个新的多边形。

顺便说一句，使用现在的算法，new google.maps.Polygon可以（并且可能应该）将行向下推到循环之外，在前面的行中 bermudaTriangle.setMap(map)；

哦，等等，实际上有一个解决方案。或者至少是一个半解决方案。您可以使线条不可见 ( strokeOpacity: 0)。由于填充，多边形仍然可见，或多或少像这样： 在此处输入图像描述

于 2013-03-09T11:53:17.007 回答