質問 1.) ROADMAP を選択すると、特定の overlayMapType が表示され (他のモードでは非表示になります)、test.html にコピー & ペーストして、表示して楽しむことができる例を作成しました。うまくいけば、ニーズに合わせてこれを編集できます。
<!DOCTYPE html>
<html>
<head>
<title>Google Maps JavaScript API v3 Example: Overlay MapTypes</title>
<link href="https://developers.google.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
function CoordMapType(tileSize) {
this.tileSize = tileSize;
}
CoordMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
var div = ownerDocument.createElement('div');
div.innerHTML = coord;
div.style.width = this.tileSize.width + 'px';
div.style.height = this.tileSize.height + 'px';
div.style.fontSize = '10';
div.style.borderStyle = 'solid';
div.style.borderWidth = '1px';
div.style.borderColor = '#AAAAAA';
return div;
};
var map;
var chicago = new google.maps.LatLng(41.850033,-87.6500523);
function initialize() {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(-33, 151),
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);
// Insert this overlay map type as the first overlay map type at
// position 0. Note that all overlay map types appear on top of
// their parent base map.
map.overlayMapTypes.insertAt(0, new CoordMapType(new google.maps.Size(256, 256)));
// we check mapType when it is changing
google.maps.event.addListener( map, "maptypeid_changed", function( evnt ) {
if(map.mapTypeId === "roadmap") {
// show my custom map layer - but only if its not already there
// note: you could also check more specifily your map type here
if(map.overlayMapTypes.getLength() == 0) {
map.overlayMapTypes.insertAt(0, new CoordMapType(new google.maps.Size(256, 256)));
}
} else {
// if something else, remove it
// note: you could also check more specifily your map type here, but for now
// we just check if something is already there
if (map.overlayMapTypes.getLength() > 0){
map.overlayMapTypes.removeAt(0);
}
}
});
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 640px; height: 480px;">map div</div>
</body>
</html>
質問 2.)試してみましたが不可能でした (高度に保護されています)。代わりに Google カスタム マップ コントロールを使用してください - それは唯一のオプションのようです :(
https://developers.google.com/maps/documentation/javascript/controls#CustomControls
編集：
この例のように独自の名前を付けることができるように、独自のベースレイヤーとしてGoogleロードマップタイプを追加しようとしましたか(右上隅の選択を表示): https://google-developers.appspot.com/maps/documentation/javascript/examples /maptype-base?hl=fiそして、CoordMapType グリッド (または必要なオーバーレイ マップ) を表示する Google マップにオーバーレイ マップ (私の例のように) を追加します。このようにして、まだそのチェックボックスを取得することはできませんが、少なくとも通常の Google マップ コントローラー内で独自の選択と名前で表示できますか? 私は今、この理論をテストする時間がありません。仕事中です笑。:)
しかし、基本的には、ドロップダウンの場所を達成できます
- 地図（グーグルロードマップ）
- 私のレイヤー（オーバーレイマップがその上にあるグーグルロードマップ、またはいくつか）？
あるいは、console.log(map); を使用することもできます。だけでなく、より多くの方法を見つけようとします。
CoordMapType.prototype.name = 'My base layer';
CoordMapType.prototype.alt = 'My base layer map type';
..これがすでにベースレイヤーの選択として作成されている場合、そのチェックボックスオプションが非表示になっている可能性があります。これらのチェックボックスは常にオーバーレイ マップ選択トグルでなければなりません。