comparison matsugaoka/chizu1/gpsgo.js @ 3936:8b449670e1a8

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

yatex.org