Googleマップオーバーレイ

Googleマップでマーカーを追加します

Googleマップ - オーバーレイ

オーバーレイは緯度/経度は、マップ上の座標にバインドされたオブジェクト、ドラッグされているか、またはマップはあなたと一緒に移動するズーム。

Google Maps APIの次のオーバーレイです。

ポイントは、多くの場合、カスタムアイコンを表示する表示する地図上のマーカーを使用します。マーカーは、オブジェクトGMarker型であり、オブジェクトGIconアイコンの種類をカスタマイズするために使用することができます。
表示される（点の集合を表す）ポリラインを使用して地図上の線。型オブジェクトのGPolylineライン。
（それは矩形領域である場合）または底部オーバーレイ（領域は任意の形状である場合）は、地図上のエリアはポリゴンとして表示されます。閉じたポリラインに似たポリゴンは、それがどのような形状とすることができます。グラウンドオーバーレイは、一般的に、直接または間接的に関連したタイルの領域をマッピングするために使用されます。
マップ自体は、タイルオーバーレイを使用して表示されます。あなたがタイルのシリーズを所有している場合は、マップ上の既存のタイルを変更するにはGTileLayerOverlayクラスを使用することができ、あなたもあなた自身のマップタイプを作成するためにGMapTypeを使用することができます。
情報ウィンドウには、オーバーレイの特別な種類です。（注）ただし、情報ウィンドウが自動的にマップに追加され、マップは一種類のみのGInfoWindowオブジェクトを追加することができます。

Googleマップ - タグを追加します

マップは、レコード上の点を識別します。デフォルトでは、彼らは（あなたはまた、カスタムアイコンを指定することができます）G_DEFAULT_ICONを使用しています。 GMarkerコンストラクタGLatLngとGMarkerOptionsパラメータとして（オプション）オブジェクト。

インタラクティブになるように設計タグ。たとえば、デフォルトでは、彼らはしばしばイベントリスナで情報ウィンドウを開くために使用されるイベントを、「クリック」受け取ります。

setMap（）メソッドによって、地図上にマーカーを追加します。

例

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

marker.setMap(map);

»をお試しください

Googleマップ - ドラッグ可能なマーカー

次の例では、マーカーをドラッグして、アニメーションのプロパティを使用する方法について説明します。

例

marker=new google.maps.Marker({
position:myCenter,
animation:google.maps.Animation.BOUNCE
});

marker.setMap(map);

»をお試しください

Googleマップ - アイコン

新しいアイコンがデフォルトのアイコンの代わりに表示されてからタグを定義することができます。

例

var marker=new google.maps.Marker({
position:myCenter,
icon:'pinkball.png'
});

marker.setMap(map);

»をお試しください

Googleマップ - ポリライン

GPolylineオブジェクトは、地図上の線形オーバーレイを作成することができます。 GPolylineは一連の点が含まれており、これらの点を結ぶ整然とした一連のラインを作成します。

ポリラインは、次の属性をサポートしています。

パス - 緯度/経度の座標の複数の行を指定
strokeColor - ライン（形式：「#FFFFFF」）の16進数のカラー値を指定します
strokeOpacity - 透明度の指定行（値0.0〜1.0）
strokeWeightは - ピクセル単位で、線の幅を定義します。
編集可能 - ユーザが直線の定義を編集できるかどうか（真/偽）

例

var myTrip = [stavanger,amsterdam,london];
var flightPath = new google.maps.Polyline({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2
});

»をお試しください

Googleマップ - ポリゴン

彼らが注文した一連の点が含まれているためGPolygonオブジェクトは、同様のGPolylineオブジェクトです。ただし、ポリゴンは2つのエンドポイントであるが、閉ループ領域の設計が形成定義されています。

そしてラインは、あなたがポリゴンエッジ（線）の色、太さ、透明性、ならびに塗りつぶし領域の閉鎖の色や透明度をカスタマイズすることができます。色は、16進数値のHTMLスタイルにする必要があります。

多角形は、次の属性をサポートしています。

パス - 複数のリニア緯度座標を指定します（最初と最後の座標が等しいです）
strokeColor - ライン（形式：「#FFFFFF」）の16進数のカラー値を指定します
strokeOpacity - 透明度の指定行（値0.0〜1.0）
strokeWeightは - ピクセル単位で、線の幅を定義します。
塗りつぶし - 16進数のカラー値（形式：「#FFFFFF」）を指定された閉域
fillOpacity - 透明性が（1.0から0.0である）塗りつぶしの色を指定
編集可能 - ユーザが直線の定義を編集できるかどうか（真/偽）

例

var myTrip = [stavanger,amsterdam,london,stavanger];
var flightPath = new google.maps.Polygon({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});

»をお試しください

Googleマップ - ラウンド

ラウンドは、次の属性をサポートしています。

センター - 円、指定されたパラメータの中心点google.maps.LatLng
半径 - メートルで、円の半径を指定します
strokeColor - アークの16進カラー値（形式：「#FFFFFF」）を指定します
strokeOpacity - 透明指定アーク（値0.0〜1.0）
strokeWeightは - ピクセル単位で、線の幅を定義します。
塗りつぶし - サークルフィル値（形式：「#FFFFFF」）の16進数のカラー値を指定します
fillOpacity - 透明性が（1.0から0.0である）塗りつぶしの色を指定
ユーザーは、直線を編集できるかどうかを定義します（真/偽）

例

var myCity = new google.maps.Circle({
center:amsterdam,
radius:20000,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});

»をお試しください