Googleマップコントロールセット
Googleマップ - デフォルトのコントロール設定：
標準のGoogleマップを使用する場合、デフォルト設定は次のとおりです。
1.Zoom-マップのズームレベルを制御するスライダーを表示する
2.ppan-マップには平らなボトムのボウルのようなコントロールが表示されます。4つのコーナーをクリックしてマップをパンします
3.maptype-ユーザーがマップタイプ（ロードマップとサタライト）を切り替えることができます
4。StreetView-ストリートビューの悪役アイコンとして表示される、マップ上のポイントにドラッグしてストリートビューを開くことができます
Googleマップ - その他のコントロールセット
上記のデフォルトのコントロールセットに加えて、Googleには次のようにもあります。
。スケール - マップスケールを表示します
.rotate-マップを回転できる小さな円周アイコンを表示します
.verviewマップ - 広い領域の観点からマップを表示する
マップを作成するときは、設定オプションを介して表示されるコントロールセットを指定するか、setoptions（）を呼び出してマップの設定オプションを変更できます。
Googleマップ - デフォルトのコントロールセットをオフにします
デフォルトのコントロールセットをオフにすることができる場合があります。
デフォルトのコントロールセットをオフにするには、マップのDisabledEfaultUIのプロパティをTrueに設定します。
例
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script = <var mapprop = <bar mapprop = </script> </script Google.maps.latlng（51.508742、-0.120850）、Zoom：7、disabledefaultUi：true、maptypeid：google.maps.maptypeid.roadmap}; var map = new Google.maps.map（document.getElementById（ "googlemap"）、mapprop）;} google.maps.adddomlistener（window、 'load'、initialize）; </scripiz）; </scripiz）; </scripiz> </head> <body> <div id = "googlemap"> </div> </html>
Googleマップ - すべてのコントロールセットを開きます
デフォルトではマップにいくつかのコントロールセットが表示されますが、設定しない限り、一部のコントロールセットが表示されます。
コントロールを真に設定して目に見えるようにします - コントロールをfalseに設定して非表示にします。
次の例では、すべてのコントロールが可能になります。
例
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script = <var mapprop = <bar mapprop = </script> </script Google.maps.latlng（51.508742、-0.120850）、Zoom：7、Pancontrol：True、ZoomControl：True、MapTypeControl：True、ScaleControl：True、StreetViewControl：True、OverviewMapControl：true、rotatecontrol：true、true、true、true、true、true、true、true、true、true google.maps.maptypeid.roadmap}; var map = new Google.maps.map（document.getElementById（ "googlemap"）、mapprop）;} google.maps.adddomlistener（window、 'load'、initialize）; </scripiz）; </scripiz）; </scripiz> </head> <body> <div id = "googlemap"> </div> </html>
Googleマップ - コントロールセットを変更します
一部のマップコントロールは構成可能です。制御オプションフィールドを作成して、制御セットを変更します。
fたとえば、ズームコントロールを変更するオプションは、ZoomControptionsで指定されています。 ZoomControloptionsには、次の3つのオプションが含まれています。
1.google.maps.zoomcontrolstyle.small-最小化ズームコントロールを表示します
2.google.maps.zoomcontrolstyle.large-標準ズームスライドコントロールを表示します
3.google.maps.zoomcontrolstyle.default-selectデバイスとマップサイズに基づいて最も適切なコントロール
例
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script = <var mapprop = <bar mapprop = </script> </script google.maps.latlng（51.508742、-0.120850）、Zoom：7、ZoomControl：true、ZoomControloptions：{style：google.zoomcontrolstyle.small}、maptypeid：google.maps.maptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyptyid.roadmapmap}; var map = new Google.maps.map（document.getElementById（ "googlemap"）、mapprop）;} google.maps.adddomlistener（window、 'load'、initialize）; </scripiz）; </scripiz）; </scripiz> </head> <body> <div id = "googlemap"> </div> </html>注：コントロールを変更する必要がある場合は、最初にコントロールをオンにします（Trueに設定します）。
別のコントロールは、MapTypeコントロールです。
MapTypeコントロールは、次のスタイルオプションのいずれかとして表示できます。
1.google.maps.maptypecontrolstyle.horizontal_barは、水平バーのGoogleマップに示すように、ボタンとして一連のコントロールを表示するために使用されます。
2.google.maps.maptypecontrolstyle.dropdown_menu。ドロップダウンメニューからマップタイプを選択できるように、単一のボタンコントロールを表示します。
3.google.maps.maptypecontrolstyle.default。「デフォルト」の動作を表示するために使用されます。
例
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script = <var mapprop = <bar mapprop = </script> </script Google.maps.latlng（51.508742、-0.120850）、Zoom：7、MapTypeControl：true、maptypecontroptions：{style：google.maps.maptypecontrolstyle.dropdown_menu}、Maptyid：Google.maps.maptypeid.; var map = new Google.maps.map（document.getElementById（ "googlemap"）、mapprop）;} google.maps.adddomlistener（window、 'load'、initialize）; </scripiz）; </scripiz）; </scripiz> </head> <body> <div id = "googlemap"> </div> </html>また、制御ポジションプロパティを使用して、コントロールの位置を指定できます。
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script = <var mapprop = <bar mapprop = </script> </script Google.maps.latlng（51.508742、-0.120850）、Zoom：7、Maptypecontrol：true、maptypecontroptions：{style：maptypecontrolstyle.dropdown_menu、google.maps.maps.topteder} google.maps.maptypeid.roadmap}; var map = new Google.maps.map（document.getElementById（ "googlemap"）、mapprop）;} google.maps.adddomlistener（window、 'load'、initialize）; </scripiz）; </scripiz）; </scripiz> </head> <body> <div id = "googlemap"> </div> </html>Googleマップ - カスタムコントロールセット
イベントをクリックするためにロンドンに戻るカスタムコントロールを作成します。（マップがドラッグされている場合）：
例
<html> <head> <scriptsrc = "http://maps.googleapis.com/maps/api/js?key=aizasydy0kkjitpvd2u7atoawhc9ysh6ohxoiym＆sensor = false"> </script> </var london = new google.maps.latlng（51.508742、-0.120850）; //ユーザーをロンドン機能HomeControl（componloldiv、Map）に戻すホームコントロールを追加します{componloldiv.style.padding = '5px'; var controlui = document.createelement（ 'div'）; controlui.style.backgroundcolor = 'Yellow'; controlui.style.border = '1px solid'; controlui.style.cursor = 'pointer'; controlui.style.textalign = 'center'; controlui.title = 'マップをロンドンに設定します'; componloldiv.AppendChild（controlui）; var controltext = document.createelement（ 'div'）; controlText.style.fontfamily = 'arial、sans-serif'; controlText.style.fontsize = '12px'; controlText.style.paddingleft = '4px'; controlText.style.paddingright = '4px'; controlText.innerhtml = '<b> home <b>' controlui.appendChild（controlText）; //クリックイベントリスナー：マップをロンドンに設定するだけでgoogle.maps.event.adddomlistener（controlui、 'click'、function（）{map.setcenter（london）}）;} function initialize（）{var mapdiv = document.getelementbyid（ 'googlemap'）; var myoptions = {zoom：12、center：london、maptypeid：google.maps.maptypeid.roadmap} map = new google.maps.map（mapdiv、myoptions）; // divを作成してコントロールを保持し、homecontrol（）var homecontroldiv = document.createelement（ 'div'）を呼び出します。 var HomeControl = new HomeControl（HomeControldiv、Map）; // homeControldiv.index = 1; map.controls [google.maps.controlposition.top_right] .push（homecontroldiv）;} google.maps.adddomlistener（window、 'load'、initialize）; </head> <body> <div id = "googlemap"> </div> </html>上記は、Googleマップコントロールセットを整理する情報です。将来、関連する知識を追加し続けます。 Google Mapアプリケーションの開発を支援できる友人を願っています。このサイトへのご支援ありがとうございます！