web-dev-qa-db-ja.com

Google Maps API v3はすべてのポリラインを削除します

少し背景。特定のナビゲーションアイテムをクリックしたときにナビゲーション設定があり、マップ上にmarkersが作成されます。別のナビゲーション項目をクリックすると、以前のmarkersが削除され、新しいナビゲーション項目が設定されます。

さて、私はpolylinesで作業していて、ここでpolylinesを使用して同じ概念を作成しようとしていますが、困難な状況にあります。ここに私が持っているものがあります：

    // Global variable for array of lines
    var points= [];

私のポイントを設定します。

    line1 = new google.maps.LatLng(line1Start, line1Finish);
    line2 = new google.maps.LatLng(line2Start, line2Finish);
    line3 = new google.maps.LatLng(line3Start,line3Finish);

    points.Push(line1, line2, line3);

ポリラインを設定します。

    var polyline = new google.maps.Polyline({
       path:points,
       strokeColor:"#FF0000",
       strokeOpacity:1.0,
       strokeWeight:2
    });

ラインでマップを初期化します。

    polyline.setMap(map);

すべてうまくいきます。線が作成され、私のマーカーの間に表示されます。それらを削除しましょう（または削除しないでください...）

    function removeLines() {
      if (points) {
           points.length = 0;
      }
      points = [];
    }

関数の最初でremoveLines（）が呼び出されてクリアされ、新しいものがセットアップされます。これで実際にpoints配列内の私のポイントがクリアされますが、マップ自体にはpolylinesが引き続き表示され、マーカーのように消えることはありません。

何を与える？

google-mapsgoogle-maps-api-3google-maps-markerspolyline
20
Romes

マップから行を削除するpolyline.setMap(null)を実行する必要があります。 ドキュメント 。

37
friism

ポリラインは、LatLngオブジェクトの配列であり、個々のポリラインではありません。おそらく、ポリライン用に個別の配列が必要だと思います。ポリラインをループしてすべて削除することができます。グローバル配列行を作成します。

 var line = [];
 polyline = new google.maps.Polyline({
        path: points,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2
    });
 line.Push(polyline);

これで、すべてのポリラインオブジェクトを配列線にプッシュしています。次のようにループすることで、マップを非表示にしたり、マップから削除したりできます。

for (i=0; i<line.length; i++) 
{                           
  line[i].setMap(null); //or line[i].setVisible(false);
}
15
Aravind Asok