<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"></script>
<div id="map" style="width: ***px; height: ***px;"></div>
<script type="text/javascript">
window.onload() = function() {
// 地図オブジェクト
var myMap = L.map("map", {
// ズームレベル
zoom: 13, //
// 中心点緯度経度
center: [35.701306, 139.700044],
// 地図上をクリックされたときにPopupを閉じない設定
closePopupOnClick: false
});
// タイルレイヤにはオープンストリートマップを拝借
var osm = L.tileLayer("https://tile.openstreetmap.jp/{z}/{x}/{y}.png", {
attribution: "<a href='https://www.openstreetmap.org/copyright'>OpenStreetMap</a> contributors"
});
osm.addTo(myMap);
// マーカー
var myMarker = L.marker([35.690921, 139.700258]);
myMarker.addTo(myMap);
// 吹き出し
var myPopup = L.popup();
// 吹き出しに表示する文
myPopup.setContent("新宿駅で~す");
// マーカーと吹き出しの関連付け
myMarker.bindPopup(myPopup);
// 吹き出しを開く
myMarker.openPopup();
}
</script>