中心点の緯度経度を指定する
実行結果
次の例では、中心点の緯度経度を指定して地図を表示します。
ソースコードと解説
地図の緯度経度を指定するには、ZDC.Mapの第2引数のオプションcenterを指定します。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- ローダーのURLをscriptでロードする -->
<script src="https://{DOMAIN}/zma_loader.js?key=[APIキー]&auth=[認証方式]"></script>
<script type="text/javascript">
// オブジェクト
var map;
// 中心点の緯度経度(東京駅)
const lat = 35.681406, lng = 139.767132;
// ZMALoader
ZMALoader.setOnLoad(function (mapOptions, error) {
if (error) {
console.error(error)
return
}
// マップオプションをデフォルト値から変更する
mapOptions.center = new ZDC.LatLng(lat, lng); // 中心点の緯度経度を設定
// 地図を生成
map = new ZDC.Map(
document.getElementById('ZMap'),
mapOptions,
function() {
// Success callback
},
function() {
// Failure callback
}
);
});
</script>
</head>
<body>
<div id="ZMap" style="position: relative; max-width: calc(510px * 16 / 9); height:510px; border:1px solid #777777;"></div>
</body>
</html>