Question

我正在尝试在地图中绘制多边形但是失败了。我从我的数据库中设置了latlng。我已经在这里阅读了https://developers.google.com/maps/documentation/javascript/examples/polygon-simple

中的教程

我在查询时使用vb.net。

这是我的代码：

function showpolygon(){
       var data1 = "<%= vpolygon %>";
       var ndata1 = data1.split("|");            
       var len1 = ndata1.length;
       var nnama, nlat, nlong, gmbrpolygon;
       var arraypoly = [];
       var arraypoly1 = [];
       var n =0;
       var polygons = [];
       alert ("<%= vpolygon %>");
       for (var i = 0; i < len1; i++)
            {
               ndata11 = ndata1[i].split("~");
               nlat = parseFloat (ndata11[1]);
               nlong = parseFloat(ndata11[2]);
               arraypoly = new google.maps.LatLng(nlat,nlong);  
                //alert(polygons);
               arraypoly1.push(arraypoly);          
               }

        polygons.push(arraypoly1);
        gmbrpolygon = new google.maps.Polygon({
        paths: arraypoly1,
        strokeColor: '#FF0000',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#FF0000',
        fillOpacity: 0.35
        });
        gmbrpolygon.setMap(map);
       }

我正在尝试使用mvc数组但发生错误。

编辑：＆lt;％= vpolygon％＆gt;包含：name~lat~long~numberof |

polygon[n] = { location: new google.maps.LatLng(nlat,nlong)};
var polygons = new google.maps.MVCArray(polygon);

我使用mvc数组时的错误是参数0：[object] [object]并且无法设置未定义的属性'0'

并且使用此代码在控制台javascript中没有任何错误，但多边形不会出现。

Answer 1

当提供的字符串格式正确时，您的函数可以正常工作：

'some~lat~lng|some~lat~lng'

检查字符串是否具有此格式，我猜它确实具有以下格式：

'lat~lng|lat~lng'

当它的功能不起作用时，因为你从每个部分的2 + 3的分割值创建LatLngs（注意数组索引是从零开始的），但结果数组只有2个项目。

你必须改变：

       nlat = parseFloat (ndata11[1]);
       nlong = parseFloat(ndata11[2]);

到

       nlat = parseFloat (ndata11[0]);
       nlong = parseFloat(ndata11[1]);

`<edit>`

由于这里的数据格式不是问题（我仍然不清楚为什么没有MVCArray的第一种方法不起作用），我重写了你的功能，它现在使用MVCArray，支持复杂的多边形并接受数据和polygon-options作为参数使这个函数变得灵活：

function showpolygon(data,options){
       var indexes={lat:1,lng:2},//indexes of lat and lng in the splitted arrays
           delimiters   = ['#','|','~'],//delimiters for data
           paths        = new google.maps.MVCArray(),
           defaults     ={//default polygon options,
                          //will be merged with the options-argument
              strokeColor: '#FF0000',
              strokeOpacity: 0.8,
              strokeWeight: 2,
              fillColor: '#FF0000',
              fillOpacity: 0.35
            }, temp;

       if(options){
          for(var k in options){
            defaults[k]=options[k]
          }
       }

       defaults.paths=paths;
       temp=data.split(delimiters[0]); 

       for (var a = 0; a < temp.length; a++){
               var current=new google.maps.MVCArray();
               temp[a]=temp[a].split(delimiters[1]);
               for (var b = 0; b < temp[a].length; b++){
                 temp[a][b]=temp[a][b].split(delimiters[2]);
                 current.push(new google.maps.LatLng(temp[a][b][indexes.lat],
                                                     temp[a][b][indexes.lng]))
               }

               paths.push(current);          
            }
    return new google.maps.Polygon(defaults);
}

简单多边形的示例用法：

showpolygon("name~54~-82~0|name~55.3~-116~0|name~34~-107~0|name~36~-70~0",
            {map:map, strokeColor: '#000000', strokeWeight:4, fillColor:'#00FF00'});

复杂多边形的示例用法:(注意新的分隔符#，分隔符可以通过函数内的delimiters-variable定义）

showpolygon("name~1~1~0|name~55.3~55~0|name~43.2~-11~0#name~24~4|name~39~1~0|name~43~22~0|name~31.5~20.8~0",
            {map:map, strokeColor: '#0000FF'});

演示：http://jsfiddle.net/doktormolle/rBE6S/

使用谷歌地图中数据库中的set lat long绘制多边形

1 个答案:

`<edit>`