Drawing Library

DrawingManager クラス

google.maps.drawing.DrawingManager クラス

地図上にマーカー、ポリゴン、ポリライン、矩形、円を描画できます。DrawingManager の描画モードは、ユーザーが作成するオーバーレイのタイプを定義します。地図にコントロールを追加し、ユーザーが描画モードを切り替えられるようにします。

このクラスは MVCObject を拡張します。

const {DrawingManager} = await google.maps.importLibrary("drawing") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
DrawingManager
DrawingManager([options])
パラメータ: 
ユーザーが地図上にオーバーレイを描画し、描画コントロールで描画するオーバーレイのタイプを切り替えられる DrawingManager を作成します。
getDrawingMode
getDrawingMode()
パラメータ: なし
戻り値:  OverlayType|null
DrawingManager の描画モードを返します。
getMap
getMap()
パラメータ: なし
戻り値:  Map
DrawingManager がアタッチされている Map を返します。これは、作成されたオーバーレイが配置される Map です。
setDrawingMode
setDrawingMode(drawingMode)
パラメータ: 
戻り値: なし
DrawingManager の描画モードを変更します。このモードは、地図に追加するオーバーレイのタイプを定義します。指定できる値は 'marker'、'polygon'、'polyline'、'rectangle'、'circle'、null です。描画モードが null の場合、ユーザーは通常どおり地図を操作でき、クリックしても何も描画されません。
setMap
setMap(map)
パラメータ: 
戻り値: なし
DrawingManager オブジェクトを指定された Map に関連付けます。
setOptions
setOptions(options)
パラメータ: 
戻り値: なし
DrawingManager のオプションを設定します。
継承: addListener、 bindTo、 get、 notify、 set、 setValues、 unbind、 unbindAll
circlecomplete
function(circle)
引数: 
  • circle:  Circle ユーザーが描画した円。
このイベントは、ユーザーが円の描画を終了したときに発生します。
markercomplete
function(marker)
引数: 
  • marker:  Marker ユーザーが描画したばかりのマーカー。
このイベントは、ユーザーがマーカーの描画を終了したときに発生します。
overlaycomplete
function(event)
引数: 
  • event:  OverlayCompleteEvent ユーザーが描画したばかりのオーバーレイと、オーバーレイのタイプ。
このイベントは、ユーザーが任意のタイプのオーバーレイの描画を終了したときに発生します。
polygoncomplete
function(polygon)
引数: 
  • polygon:  Polygon ユーザーが描画したばかりのポリゴン。
このイベントは、ユーザーがポリゴンの描画を終了したときに発生します。
polylinecomplete
function(polyline)
引数: 
  • polyline:  Polyline ユーザーが描画したばかりのポリライン。
このイベントは、ユーザーがポリラインの描画を終了したときに発生します。
rectanglecomplete
function(rectangle)
引数: 
  • rectangle:  Rectangle ユーザーが描画したばかりの長方形。
このイベントは、ユーザーが長方形の描画を終了したときに発生します。

DrawingManagerOptions インターフェース

google.maps.drawing.DrawingManagerOptions インターフェース

描画マネージャーのオプション。
circleOptions optional
タイプ:  CircleOptions optional
この DrawingManager で作成された新しいサークルに適用するオプション。center プロパティと radius プロパティは無視され、新しい円の map プロパティは常に DrawingManager のマップに設定されます。
drawingControl optional
タイプ:  boolean optional
デフォルト: true
描画コントロールの有効/無効の状態。
drawingControlOptions optional
タイプ:  DrawingControlOptions optional
描画コントロールの表示オプション。
drawingMode optional
タイプ:  OverlayType optional
DrawingManager の描画モード。地図に追加するオーバーレイのタイプを定義します。指定できる値は 'marker'、'polygon'、'polyline'、'rectangle'、'circle'、null です。描画モードが null の場合、ユーザーは通常どおり地図を操作でき、クリックしても何も描画されません。
map optional
タイプ:  Map optional
DrawingManager がアタッチされる Map。これは、作成されたオーバーレイが配置される Map です。
markerOptions optional
タイプ:  MarkerOptions optional
この DrawingManager で作成された新しいマーカーに適用するオプション。position プロパティは無視され、新しいマーカーの map プロパティは常に DrawingManager のマップに設定されます。
polygonOptions optional
タイプ:  PolygonOptions optional
この DrawingManager で作成された新しいポリゴンに適用するオプション。paths プロパティは無視され、新しいポリゴンの map プロパティは常に DrawingManager の地図に設定されます。
polylineOptions optional
タイプ:  PolylineOptions optional
この DrawingManager で作成された新しいポリラインに適用するオプション。path プロパティは無視され、新しいポリラインの map プロパティは常に DrawingManager のマップに設定されます。
rectangleOptions optional
タイプ:  RectangleOptions optional
この DrawingManager で作成された新しい長方形に適用するオプション。bounds プロパティは無視され、新しい長方形の map プロパティは常に DrawingManager のマップに設定されます。

DrawingControlOptions インターフェース

google.maps.drawing.DrawingControlOptions インターフェース

描画コントロールのレンダリングのオプション。
drawingModes optional
タイプ:  Array<OverlayType> optional
デフォルト: [OverlayType.MARKER, OverlayType.POLYLINE, OverlayType.RECTANGLE, OverlayType.CIRCLE, OverlayType.POLYGON]
描画コントロールに表示する描画モード。表示する順序で指定します。ハンドアイコン（null 描画モードに対応）は常に使用可能であり、この配列で指定する必要はありません。
position optional
タイプ:  ControlPosition optional
デフォルト: ControlPosition.TOP_LEFT
位置 ID。地図上のコントロールの位置を指定するために使用されます。

OverlayCompleteEvent インターフェース

google.maps.drawing.OverlayCompleteEvent インターフェース

DrawingManager の overlaycomplete イベントのプロパティ。
overlay
完了したオーバーレイ。
type
タイプ:  OverlayType
完了したオーバーレイのタイプ。

OverlayType 定数

google.maps.drawing.OverlayType 定数

DrawingManager が作成できるオーバーレイのタイプ。これらは値で指定するか、定数の名前を使用して指定します。たとえば、'polygon' や google.maps.drawing.OverlayType.POLYGON です。

const {OverlayType} = await google.maps.importLibrary("drawing") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
CIRCLE DrawingManager が円を作成し、overlaycomplete イベントで指定されたオーバーレイが円であることを指定します。
MARKER DrawingManager でマーカーを作成し、overlaycomplete イベントで指定されたオーバーレイがマーカーであることを指定します。
POLYGON DrawingManager がポリゴンを作成し、overlaycomplete イベントで指定されたオーバーレイがポリゴンであることを指定します。
POLYLINE DrawingManager がポリラインを作成し、overlaycomplete イベントで指定されたオーバーレイがポリラインであることを指定します。
RECTANGLE DrawingManager が長方形を作成し、overlaycomplete イベントで指定されたオーバーレイが長方形であることを指定します。