comparison matsugaoka/chizu/ko.js @ 3932:ccfc8f7e6427

add silk Re:road
author KOMATSU Kotaro <c118089@roy.e.koeki-u.ac.jp>
date Fri, 29 Nov 2019 14:46:15 +0900
parents
children c0d9d7271189 e2c6858dcc3d
comparison
equal deleted inserted replaced
3931:cc3c9220f6a1 3932:ccfc8f7e6427
1 // 愛
2 function goinit() {
3 var koeki_latlng = [38.725639, 139.826806];
4 var baseLayer = {};
5 var map_osm = new L.tileLayer(
6 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
7 attribution : '&copy; <a href="//osm.org/copyright">OpenStreetMap</a> contributors | <a href="//www.yatex.org/koeki/2018-koryoGO/">KoryoGO</a>'
8 , maxZoom: 20, maxNativeZoom: 18
9 });
10 baseLayer["OpenStreetMap"] = map_osm;
11 var map_gsi = new L.tileLayer( // 国土地理院
12 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
13 attribution: "<a href='//www.gsi.go.jp/kikakuchousei/kikakuchousei40182.html' target='_blank'>国土地理院</a>"
14 , maxZoom: 20, maxNativeZoom: 18
15 });
16 baseLayer["地理院地図"] = map_gsi;
17 function putlog(msg, id = "ok") {
18 var o = document.getElementById(id);
19 if (o) o.innerHTML = msg;
20 }
21 var map = L.map("map").setView(koeki_latlng, 40);
22 map_osm.addTo(map);
23 L.control.scale().addTo(map);
24 var mapControl = L.control.layers(baseLayer, null).addTo(map);
25 var watchTimer = null // geolocation timer
26 function clearWatch() {
27 if (watchTimer) {
28 clearTimeout(watchTimer);
29 watchTimer = null;
30 }
31 watchID && navigator.geolocation.clearWatch(watchID);
32 watchID = null;
33 }
34 function stopChase() {
35 clearWatch();
36 putlog("!", "info");
37 startButton.removeAttribute("disabled");
38 }
39 function gotIt() {
40 stopChase();
41 var g = document.getElementById("get");
42 if (g) {
43 // document.getElementById("map").style.visibility = "hidden";
44 document.getElementById("map").style.zIndex = 0;
45 // alert("みつかったー"+watchTimer);
46 g.style.display = "block";
47 g.style.width = 500;
48 g.style.height = "auto";
49 g.style.top = "20%";
50 g.style.right = "90%";
51 g.style.opacity = 0.8;
52 g.style.zIndex = 20;
53 g.style.transition = 10;
54 }
55 putlog("捕獲!", "rest");
56 tgt && map.removeLayer(tgt);
57 tgt = L.marker(targetLoc).addTo(map);
58 tgt.bindPopup(foundMsg).openPopup();
59 setTimeout(function() {
60 var g = document.getElementById("get");
61 // g.removeChild(g.childNodes[0]);
62 g.style.display = 'none';
63 putlog("", "rest");
64 tgt._popup.setContent("私、松ヶ岡で進化しそう!私の晴れ姿みんなも見に来てね!");
65 }, 10000);
66 }
67
68 //探す始め
69 function dispDistance() {
70 //var d = getDistance(currentLoc, targetLoc);
71 var d = currentLoc.distanceTo(targetLoc);
72 d = Math.abs(Math.round(d-Math.min(curAccuracy, 10), 1));
73 var msg = currentLoc+targetLoc;
74 putlog(msg);
75 putlog("あと"+ d + "m", "rest");
76 putlog("Count: "+ ++repeatCount, "info");
77 if (d < threshold) {
78 gotIt();
79 }
80 }
81 //探す終わり
82
83 var repeatCount = 0, repeatMax = 30;
84 var currentLoc = koeki_latlng;
85 var curMarker, curCircle, curAccuracy;
86 var curMarkerIcon = L.icon({
87 iconUrl: defIcon || "main.png",
88 // iconSize: [80, 120],
89 iconAnchor: [0, 00]
90 });
91 function mainMarker(pos) {
92 return L.marker(pos, {icon: curMarkerIcon});
93 }
94 function onLocationFound(e) {
95 curAccuracy = e.accuracy / 2;
96
97 if (curMarker) map.removeLayer(curMarker);
98 curMarker = mainMarker(e.latlng).addTo(map);
99 curMarker.bindPopup("いまココ").openPopup();
100 currentLoc = e.latlng;
101 if (repeatCount%3 == 0) map.setView(e.latlng); // 3回に1回センタリング
102 if (curCircle) map.removeLayer(curCircle);
103 curCircle = L.circle(e.latlng, curAccuracy).addTo(map);
104 dispDistance();
105 }
106 function onLocationError(e) {
107 putlog(e.message, "err")
108 if (true && !curMarker) {
109 currentLoc = L.latLng(koeki_latlng);
110 curMarker = mainMarker(currentLoc).addTo(map);
111 curMarker.bindPopup("いまココ").openPopup();
112 }
113 }
114
115 var tgt;
116 function setNewLoc(latlng) {
117 putlog(latlng+"に設定しました", 'err');
118 targetLoc = latlng; // タップした地点をゴールにすり替える
119 dispDistance();
120 }
121 map.on("click", function(e) {
122 if (tgt) {
123 map.removeLayer(tgt);
124 map.panTo(e.latlng);
125 if (true) {
126 tgt = L.marker(e.latlng, {draggable: true}).addTo(map);
127 tgt.on("dragend", function (e) {
128 setNewLoc(e.target.getLatLng());
129 });
130 }
131 setNewLoc(e.latlng);
132 }
133 });
134 map.on('zoomend', function (e) {
135 if (map._locateOptions) map._locateOptions.maxZoom = map.getZoom();
136 });
137 var watchID, geoOpt = {maximumAge: 0, timeout: 2000,
138 enableHighAccuracy: true},
139 watchINT = 5000, watchTimer;
140 function watchRestart() {
141 putlog("Sleeping...Count:"+repeatCount, "info");
142 clearWatch();
143 if (watchTimer) {
144 clearTimeout(watchTimer);
145 watchTimer = null;
146 }
147 watchTimer = setTimeout(startWatch, 7500);
148 }
149 function watchFound(pos) {
150 putlog("Sleeping...FOUND!", "info");
151 putlog("", "err");
152 onLocationFound({
153 latlng: L.latLng([
154 pos.coords.latitude, pos.coords.longitude]),
155 accuracy: pos.coords.accuracy});
156 // watchRestart();
157 }
158 function watchError() {
159 onLocationError({
160 message: "GPS信号が弱いようです"});
161 }
162 function startWatch() {
163 putlog("Start...Count:"+repeatCount, "info");
164 clearWatch(); // confirmation
165 watchID = navigator.geolocation.watchPosition(
166 // watchID = navigator.geolocation.getCurrentPosition(
167 watchFound, watchError, geoOpt
168 );
169 }
170 var startButton = document.getElementById("start");
171 startButton.addEventListener("click", function(e) {
172 startWatch();
173 putlog("追跡を開始します", "info");
174 this.setAttribute("disabled", true);
175 if (tgt) { // 開始したらターゲットを消す
176 map.removeLayer(tgt); // マニュアルモード時はマーカが見える
177 tgt = null;
178 }
179 })
180 var endButtonClicks = 0;
181 document.getElementById("stop").addEventListener("click", function(e) {
182 stopChase();
183 if (++endButtonClicks > 9) {
184 document.getElementById("zuru").style.display = "inline";
185 }
186 });
187 document.getElementById("zuru").addEventListener("click", function(e) {
188 gotIt();
189 });
190 document.getElementById("(C)").addEventListener("click", function(e) {
191 tgt && tgt.removeLayer(tgt);
192 tgt = L.marker(targetLoc).addTo(map);
193 putlog("マニュアル設定モード: 好きな位置をタップしてゴールを設定できます。置いたマーカをドラッグして移動できます。「追跡をはじめる」でゴールマーカが消えます。", "info")
194 });
195 // umappop([{'color': 'red', 'file': 'koryo-spots.geojson'}]);
196 function loadgeofile(arg, callback) {
197 var xobj = new XMLHttpRequest();
198 xobj.overrideMimeType("application/json");
199 xobj.open('GET', arg['file'], true);
200 xobj.onreadystatechange = function () {
201 if (xobj.readyState == 4 && xobj.status == "200") {
202 callback(arg, xobj.responseText);
203 }
204 };
205 xobj.send(null);
206 }
207 var json = loadgeofile({file: "koryo-spots.geojson"},
208 function(arg, text) {
209 var geojson = JSON.parse(text);
210 var jL = L.geoJson(geojson);
211 jL.addTo(map);
212 });
213 var now = new Date();
214 var today = ""+now.getFullYear()+"/"+(now.getMonth()+1)+"/"+now.getDate();
215 var koryogo = localStorage.getItem("koryogo-warning");
216 if (koryogo != today) {
217 if (confirm("【koryogo 5つの誓い】\n\
218 ・危険な場所には行かない。\n\
219 ・移動するときはこの画面を見続けない。\n\
220 ・人の話を聞くべきときは画面を閉じる。\n\
221 ・すべては自己責任で楽しむ。\n\
222 ・誰かにやらせるときにはこれらを守らせる。")) {
223 localStorage.setItem("koryogo-warning", today);
224 } else {
225 alert("さようなら...");
226 var body = document.getElementsByTagName("body")[0];
227 body.parentNode.removeChild(body);
228 }
229 }
230 }

yatex.org