GoogleマップJavaScript APIを使用してマイマップをレンダリング

Question

カスタムマイマップを作成したとき、デフォルトではiframeの方法で共有できます。

しかし、これは非常に遅く、代わりにJS APIを使用してレンダリングしたいと考えています。

これを行う最も簡単な方法は何ですか？

Answer 1

カスタムマイマップの「エクスポートされたKML」を使用して、データをGoogle Maps Javascript API v3 KmlLayerに表示することもできます。

コードスニペット：（this MyMapからのデータ）

var geocoder; 
 
var map; 
 

 
function initialize() { 
 
    var map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    var layer = new google.maps.KmlLayer({ 
 
    url: "http://www.google.com/maps/d/kml?mid=zNPjLbo835mE.k3TvWfqGG-AU", 
 
    map: map 
 
    }) 
 

 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>