地図上に吹き出しを表示（v1）
地図上に吹き出しを表示します。
HTML(サンプルコード)
<div id="map"></div>
<style>
#map {
height: 400px;
width: 700px;
margin: 0 auto;
}
</style>
JavaScript(サンプルコード)
// 地図を中心地の緯度経度を用意します
const center = new navitime.geo.LatLng('35.667395', '139.714896');
// 地図を用意します
const map = new navitime.geo.Map('map', center, 16, {
bounds: new navitime.geo.BoundsInfo(0, $('#map').width(), 0, $('#map').height())
});
// マーカーを用意します
new navitime.geo.overlay.Pin({
map: map, // 描画対象の地図オブジェクト
icon: '../../../img/pin.png', // 表示したい画像
position: center, // 表示する地点
draggable: false // ドラッグ不可
});
// 吹き出しを表示します
new navitime.geo.overlay.InfoWindow({
map: map, // 表示対象地図インスタンス
position: center, // 緯度経度
content: "<span style=\"color:#ffffff\">株式会社ナビタイムジャパン</span>", // 内部に表示させる内容
pixelOffset: { x: 0, y: -40 }, // x: 表示位置X →方向 ＋, y: 表示位置Y ↓方向 ＋
zIndex: 100, // その他のオーバーレイと比較したzIndex
maxWidth: 200, // 吹き出しの最大幅
disableClose: true, // ×ボタン無効化
tailDirection: 'left', // 吹き出しのしっぽの方向指定
backgroundColor: '#006400', // 吹き出しの背景色
borderColor: '#ffffff', // 吹き出しの線色
margin: '5px' // 吹き出しの余白
});