не могу нарисовать ломаную линию на картах Google v3, но могу нарисовать ее точки в виде маркеров (я использую слой OpenStreetMap) - PullRequest
0 голосов
/ 11 ноября 2011

следующий код используется для рисования polyline на Картах Google с использованием V3 API, но иногда он рисует polyline и в большинстве случаев этого не происходит, несмотря на наличие точки (как я могу показать точки на карта в виде маркеров), но polyline не отображается

обновление 2 : я использую слой openstreetmap поверх Google maps. это вызывает проблему при рисовании polyilne?

w переменная содержит данные в виде строки, например:

w= 35.1212,55.2333\n36.32366,56.3333

Реальный образец данных для w: [этот код может рисовать маркеры для следующих точек, но не может рисовать ломаную линию]

34.440501,31.515222
34.441933,31.514346
34.44247,31.514013
34.442603,31.51394
34.443607,31.513423
34.4445,31.512926
34.444762,31.512772
34.445186,31.512523
34.445257,31.512481
34.445311,31.512449
34.445614,31.512264
34.446244,31.511867
34.446939,31.511429
34.447351,31.511193
34.448081,31.512174
34.448241,31.512357
34.448576,31.512741
34.449147,31.513185
34.4499,31.513723
34.450894,31.514401
34.451925,31.515362
34.452905,31.516176
34.454194,31.517266
34.455337,31.518236
34.456215,31.51898
34.456987,31.519646
34.457583,31.520166
34.458298,31.520772
34.458989,31.52139
34.459659,31.521959
34.460476,31.522653
34.461192,31.523228
34.461869,31.523788
34.46256,31.524376
34.463302,31.525015
34.464062,31.525668
34.464433,31.525986
34.464737,31.526246
34.465247,31.526683
34.465498,31.526907
34.466666,31.52792
34.46722,31.528404
34.467327,31.528495
34.468014,31.529081
34.468379,31.52939
34.469296,31.530177
34.469771,31.530583
34.470152,31.53091
34.470951,31.531597
34.471617,31.532172
34.472388,31.532838
34.472664,31.533076
34.47295,31.533397
34.473422,31.533653
34.474028,31.534065
34.474844,31.534629
34.475725,31.535253
34.476083,31.535517
34.476697,31.535947
34.477105,31.536209
34.477627,31.536477
34.478,31.536742
34.478398,31.536989
34.478935,31.537325
34.480044,31.537975
34.480985,31.538529
34.481362,31.53878
34.481416,31.538819
34.482407,31.539419
34.482682,31.539109
34.483132,31.538603
34.483341,31.538368
34.483917,31.537753
34.484202,31.537449
34.484288,31.537357
34.484944,31.536587
34.485118,31.536383
34.485205,31.536304
34.485648,31.535903
34.485984,31.535598
34.486246,31.535381
34.486445,31.535291
34.486533,31.535254
34.486607,31.535282
34.486706,31.535354
34.486869,31.535526
34.487012,31.535692
34.487212,31.535923
34.487273,31.536006
34.487767,31.53571
34.488336,31.535395
34.48883,31.535148
34.489078,31.535032
34.489354,31.534901
34.48955,31.534788
34.489756,31.535011
34.489831,31.535097
34.490268,31.534748
34.49065,31.534473
34.490857,31.53436
34.491044,31.534319
34.491352,31.534248
34.491458,31.534237
34.491548,31.534304
34.491879,31.534209
34.492227,31.534203
34.492457,31.534214
34.492042,31.533636
34.492162,31.533542

примечание: я перевернул lng и lat при создании точки для какой-то цели

, где a - массив, в котором есть точки, которые должны быть представлены в виде полиина код


var mypolyline = new google.maps.Polyline({
                    strokeColor: "#FF0000",
                    strokeOpacity: .6,
                    strokeWeight: 3,
                    clickable: true
                    });

                    //  var bounds2 = new google.maps.LatLngBounds();
                        var a=w.split("\n");

                        for(var i=0;i<a.length;i++)
                        {
                            var zz=a[i].split(",");
                            var lat=zz[0];
                            var lng=zz[1];
                            var path = [];
                            var path = mypolyline.getPath();
                            var point = new google.maps.LatLng(parseFloat(lng),parseFloat(lat));
                            createMarker(i,name,point,icon[1],2);
                        //  alert(path.length);
                            path.push(point);
                            mypolyline.setPath(path);
                           mypolyline.setMap(map);
                        }

Функция CreateMarker ()

function createMarker(id,name,point,icon,type) {
   //  var marker = new google.maps.Marker(point, customIcons[type]);

     var marker = new google.maps.Marker({
            map: map,
            position: point,
                icon: icon
            });


         markersArray.push(marker);

         google.maps.event.addListener(marker, 'click',  function() {  


          infowindow = new google.maps.InfoWindow({  content: name  }); 
          infowindow.open(map, marker); 
          map.panTo(point);
          });
  return marker;
  }

1 Ответ

0 голосов
/ 11 ноября 2011

Итак, вы создаете массив, затем игнорируете его и воссоздаете его как MVCArray, используя функцию getPath ().Избавьтесь от первой строки (хотя это не является причиной проблем).

var path = [];
var path = mypolyline.getPath();

Просто мысль - является ли путь обязательным атрибутом при первом создании полилинии?

Мне кажется, что вы изначально создали mypolyline без какого-либо пути.Поэтому, когда вы делаете это на первой итерации, это не сработает, потому что все, что вы передаете .setPath () - это одна точка, но я предполагаю, что путь может работать только при наличии как минимум 2 точек.

path.push(point);
mypolyline.setPath(path);

Обновление: Я думаю, что нужно просто начать с пустого массива, зацикливая свои координаты, добавляя их в массив.Затем после цикла создайте ломаную линию, а не пытайтесь обновлять ее каждый раз, когда вы повторяете цикл.Например:

var a=w.split("\n");

var path = [];

for(var i=0;i<a.length;i++)
{
    var zz=a[i].split(",");
    var lat=zz[0];
    var lng=zz[1];
    var point = new google.maps.LatLng(parseFloat(lng),parseFloat(lat));
    createMarker(i,name,point,icon[1],2);
    path.push(point);
}

var mypolyline = new google.maps.Polyline({
    path: path,
    map: map,
    strokeColor: "#FF0000",
    strokeOpacity: .6,
    strokeWeight: 3,
    clickable: true
});
...