Newer
Older
2021-Higuchi / map / last.js
document.addEventListener("DOMContentLoaded", () => {
    var mymap = L.map("gpsmap").setView([38.891, 139.824], 16);
    L.tileLayer('https://{s}.tile.osm.org/{z}/{x}/{y}.png', {
	attribution:
	'&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> \
		contributors'
    }).addTo(mymap);

    var gpsmarker = L.marker(mymap.getCenter()).addTo(mymap);
    gpsmarker.bindPopup("STARTおしてね").openPopup();

    var nTrial = 100
    var watchId = null;		// 最初はnullにしておく
    function stopGPS() {	// watchが動いていたら止めてnullにする
	console.log("watchId="+watchId);
	if (watchId != null) {	// nullかどうかで比較しないとだめ(初期値0)
	    navigator.geolocation.clearWatch(watchId);
	    document.getElementById("title").textContent = "stop";
	    gpsmarker.setPopupContent("停めました");
	}
	watchId = null;
    }
    function tryWatchGPS() {
	stopGPS();		// 二重で動かないように注意する
	watchId = navigator.geolocation.watchPosition(
	    onSuccess, onError,{
		maximumAge: 0, timeout: 3000, enableHighAccuracy: true});
	document.getElementById("title").textContent = "START!!";
    }
    function onSuccess(pos) {	// GPS信号が取れたらここに来る
	var latlng = L.latLng([pos.coords.latitude, pos.coords.longitude]);
	mymap.panTo(latlng);// 地図の中心
	console.log(latlng);
	
	gpsmarker.setLatLng(latlng).setPopupContent(
	    "あと" + latlng.distanceTo(goul) + "m"
	).openPopup();

        function loadItems(){
	    var req=new XMLHttpRequest();
	    req.addEventListener("readystatechange",()=>{
		if(req.readyState === 4 && req.status === 200){
		    items=JSON.parse(req.responseText);
		}
	    });
	    req.open("GET","items.js");
	    req.send();
	}

	function placeItems(){
	    var itemMark=[];
	    for(var i=0; i<items.length; i++){
		var pos=new leaflet.js.map.Length(items[i].lat,items[i].lng;
	        var img={
                    url:items[i].img,
	            scaledSize:new leaflet.js.map.Size(60,60)
		};
                itemsMark[i]=new leaflet.js.map.Marker({
		    position:pos,
		    icon:img,
		    title:items[i].name
		});
						  taken[i]=false;
						 }
	    }
	    
    function onSuccess(pos) {
       var latlng = L.latLng([pos.coords.latitude, pos.coords.longitude]);
       var d = latlng.distanceTo(goal)
       var info = document.getElementById("info");
      if (d < 25) {
         info.innerHTML = "ゲット!";
         alert("ゲット!!!!");
       } else {
     info.innerHTML = "あと " + d + "m だよ!";
     }
    }
	
	
    }
    function onError(err) {
	restN = "あと"+(--nTrial)+"回試行します。";
	gpsmarker.setPopupContent("捕捉失敗:"+restN).openPopup();
	if (nTrial <= 0) {
	    navigator.geolocation.clearWatch(watchId);
	}
    }
    // STARTボタンに開始を仕込む
    document.getElementById("start").addEventListener("click", tryWatchGPS);
    // STOPボタンに停止を仕込む
    document.getElementById("stop").addEventListener("click", stopGPS);
}, false);