diff --git a/map/domon/mapobj.js b/map/domon/mapobj.js
index 61588d5..43cb70f 100644
--- a/map/domon/mapobj.js
+++ b/map/domon/mapobj.js
@@ -1,48 +1,99 @@
-/* Add some objects on a Map */
+(() => {
+function MyMap(id) {
+ mymap;
+ function init(id) {
+ mymap = L.map("mymap").setView([38.8877,139.8363], 15);
+ // OpenStreetMap
+ L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
+ attribution:
+ '© OpenStreetMap \
+ contributors'
+ }).addTo(mymap);
+ // 国土地理院
+ /*
+ L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
+ attribution:
+ '国土地理院'
+ }).addTo(mymap);
+ */
+ }
+ function mapObjs() {
+ var pl = [ // Polyline: 連続線分
+ [38.89329,139.81881],
+ [38.89327,139.81905],
+ [38.89212,139.81900],
+ [38.89211,139.81949],
+ [38.89114,139.81954],
+ [38.89115,139.82017],
+ [38.88996,139.82061],
+ [38.8844,139.8236],
+ [38.8844,139.8236],
+ [38.8831,139.8243],
+ [38.88209,139.82514],
+ [38.88147,139.82580],
+ [38.8810,139.8266],
+ [38.88065,139.82744],
+ [38.88033,139.82889],
+ [38.88021,139.83236],
+ [38.88050,139.83550],
+ [38.88075,139.83835],
+ [38.8822,139.8379],
+ [38.88304,139.83797],
+ [38.88379,139.83849],
+ [38.88444,139.83936],
+ [38.89017,139.84797],
+ [38.89122,139.84913],
+ [38.89188,139.85013],
+ [38.89096,139.85113],
+ [38.89121,139.85153],
+ [38.89212,139.85214],
+ [38.89197,139.85260]
+ ];
+ var plProp = { // polylineに与えるオプション
+ color: "green", // 線分の色
+ opacity: 0.4, // 線分の透明度
+ weight: 9 // 線分の太さ
+ };
+ var plobj = L.polyline(pl, plProp).addTo(mymap);
-var pl = [ // Polyline: 連続線分
- [38.892123,139.818884],
- [38.892123,139.8200],
- [38.89099,139.82015],
- [38.8844,139.8236],
- [38.8844,139.8236],
- [38.8814,139.8258],
- [38.88027,139.82866],
- [38.8806,139.8384],
- [38.8822,139.8379],
- [38.8838,139.8386],
- [38.89275,139.85142,],
- [38.89195,139.85260,]
-];
-var plProp = { // polylineに与えるオプション
- color: "green", // 線分の色
- opacity: 0.4, // 線分の透明度
- weight: 9 // 線分の太さ
+ var pg = [ // Polygon: ポリゴン
+ // 終点と始点は連結される
+ [38.89267,139.85264],
+ [38.89242,139.85328],
+ [38.89127,139.85252],
+ [38.89151,139.85189]
+ ];
+ var pgOpt = { // polygonに与えるオプション
+ color: "#ba55d3", // 線分の色
+ fillColor: "#ba55d3", // 塗りつぶし部分の色
+ fillOpacity: 0.2 // 塗りつぶし部分の透明度
+ };
+ var pgobj = L.polygon(pg, pgOpt).addTo(mymap);
+
+ var sIcon = L.icon({
+ iconUrl: 'start.png',
+ iconAnchor: [15, 40],
+ });
+ var gIcon = L.icon({
+ iconUrl: 'goal.png',
+ iconAnchor: [13, 40],
+ });
+
+ var marker1 = pl[0], marker2 = pg[0]; // polylineとpolygon各々の始点
+ var m1opt = {icon: sIcon, title: "東北公益文科大学"}, m2opt = {icon: gIcon, title: "イオン酒田南店"};
+ var m1 = L.marker(marker1, m1opt).addTo(mymap);
+ var m2 = L.marker(marker2, m2opt).addTo(mymap);
+
+ /* オブジェクトレイヤ.bindPopup() でクリック時のポップアップを定義できる */
+ plobj.bindPopup("東北公益文科大学からイオン酒田南店までの道のり");
+ pgobj.bindPopup("イオン酒田南店ですよ！");
+ m1.bindPopup("東北公益文科大学！");
+ m2.bindPopup("イオン酒田南店！");
+ }
+ // ↓初期化時にすぐ実行される
+ init(id);
+ mapObjs();
};
-var plobj = L.polyline(pl, plProp).addTo(mymap);
-
-var pg = [ // Polygon: ポリゴン
- // 終点と始点は連結される
- [38.89263,139.85264],
- [38.89244,139.85324],
- [38.89127,139.85248],
- [38.89147,139.85186]
-];
-var pgOpt = { // polygonに与えるオプション
- color: "#ba55d3", // 線分の色
- fillColor: "red", // 塗りつぶし部分の色
- fillOpacity: 0.2 // 塗りつぶし部分の透明度
-};
-var pgobj = L.polygon(pg, pgOpt).addTo(mymap);
-
-var marker1 = pl[0], marker2 = pg[0]; // polylineとpolygon各々の始点
-var m1opt = {title: "東北公益文科大学"}, m2opt = {title: "イオン酒田南店"};
-var m1 = L.marker(marker1, m1opt).addTo(mymap);
-var m2 = L.marker(marker2, m2opt).addTo(mymap);
-
-/* オブジェクトレイヤ.bindPopup() でクリック時のポップアップを定義できる */
-plobj.bindPopup("ポリラインですよ!");
-pgobj.bindPopup("ポリゴンですよ!");
-m1.bindPopup("東北公益文科大学ですよ!");
-// 次のようにあらかじめ1つのポップアップを開いておくことも可能
-m2.bindPopup("イオン酒田南店ですよ!").openPopup();
+document.addEventListener("DOMContentLoaded", function(){
+ MyMap("mymap");}, false);
+})();
\ No newline at end of file