ポリラインを使って地図上にラインを表示するサンプルコードを作成しました。

（１）サンプルコード

　
デモ表示へ
　

（２）サンプルコードの内容

　
１）ポリラインの設定
　
Polylineオブジェクトを使って、ラインを定義します。
　
PolylineオブジェクトはLatLng配列で構成され、LatLng配列内の位置を順番に接続して連続した線セグメントを作成します。
　
①スクリプト内でポリラインの属性を設定
　
path　ラインを構成するポイント（緯度・経度）の配列
stroke　ラインの属性を設定
　Color　線の色
　Opacity　線の色の不透明度
　Weight　線の太さ
draggable　線を地図の範囲を超えてドラッグできるか
editable　線をdraggingポイントで変更できるか
　
②HTML内でpolylineディレクティブを使ってポリラインを表示する。
　
２）projection_changedイベント
　
地図が表示される際に一度発行されるprojection_changedイベントを使って上記ポリラインを設定します。
　
AngularJS、Googleマップの他の記事の目次

関連記事の目次