document.addEventListener("DOMContentLoaded", () => { var mymap = L.map("mymap").setView([38.91588, 139.83747], 19); L.tileLayer('https://{s}.tile.osm.org/{z}/{x}/{y}.png', { attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' }).addTo(mymap); var cheat = location.search; var gpsmarker = L.marker(mymap.getCenter()).addTo(mymap); gpsmarker.bindPopup("START").openPopup(); var LeafIcon = L.Icon.extend({ options:{ shadowUrl:'src/images/marker-shadow.png', shadowSize:[41,41], shadowAnchor:[10,41], iconSize:[25,41], iconAnchor:[10,41], popupAnchor:[3,-40]}}); var place = new LeafIcon({iconUrl:"image/Yellow.png"}); var geticon = new LeafIcon({iconUrl:"image/green.png"}); var nTrial = 10; var watchId = null; var csvfile = "asaichi.csv"; let titen = []; let marker = []; let comment= []; let judge = []; let image = []; var contents =[]; let r = null; // function RandomNumber(){ // let randomNumber= Math.floor(Math.random() *30)+1; // const otherUsersNumbers = JSON.parse(localStorage.getItem('otherUsersNumbers'))||[]; // while (otherUsersNumbers.includes(randomNumber)) { // randomNumber = Math.floor(Math.random() * (30))+1; // } // otherUsersNumbers.push(randomNumber); // localStorage.setItem('otherUsersNumbers',JSON.stringify(otherUsersNumbers)); // return randomNumber; // } function putValues(row) { for (let key of Object.keys(row)) { } } function init(){ fetch(csvfile). then((resp) => { if (resp.ok) return resp.text(); }).then((txt) => { let csv = new CSV(txt,{header:true}).parse(); for (let x of csv){ putValues(x); var a =(x.number); let p = L.latLng(x.lat,x.lng); let name= (x.name); image.push(x.image); titen.push(p); comment.push(x.comment); contents[a] =`<div class="text">${name}</div><img src="${image[a]}"/></div></div>` console.log(localStorage.getItem(`eleven${a}`)); if (localStorage.getItem(`eleven${a}`)!=="true"){ marker.push(L.marker(p).bindPopup(contents[a]).setIcon(place).addTo(mymap)); } if (localStorage.getItem(`eleven${a}`)=="true"){ marker.push(L.marker(p).bindPopup(contents[a]).setIcon(geticon).addTo(mymap)); } } }); } init(); function load(){ console.log(localStorage.getItem('eleven0')); if (localStorage.getItem('eleven0') == "true") { console.log("OK"); let img = document.getElementById("image0"); img.src = "image/hanyo.png"; console.log(marker); } if (localStorage.getItem('eleven1')=="true"){ let img = document.getElementById("image1"); img.src = "image/hanyo.png"; } } load(); function postForm(value){ var form = document.createElement('form'); var request = document.createElement('input'); form.method = 'POST'; form.action = 'https://script.google.com/macros/s/AKfycbyAK_TatK0nudr-tzIPJHzYiSOoOjmNFd9e1BCGuNZCNN3LQRHAtAxJ7N-mZTPtk9Wj3g/exec'; request.type = 'hidden'; request.name='text'; request.value = value; form.appendChild(request); document.body.appendChild(form); form.submit(); } //GPSの取得に関するコード function stopGPS() { console.log("watchId="+watchId); if (watchId !== null) { navigator.geolocation.clearWatch(watchId); gpsmarker.setPopupContent("止めました"); } watchId = null; } function tryWatchGPS() { stopGPS(); watchId = navigator.geolocation.watchPosition( onSuccess,onError,{ maximumAge: 0, timeout: 3000, enableHighAccuracy: true}); } function onSuccess(pos) { var latlng = L.latLng([pos.coords.latitude, pos.coords.longitude]); mymap.panTo(latlng); console.log(latlng); gpsmarker.setLatLng(latlng).setPopupContent( "ここは lat="+latlng.lat+", lng="+latlng.lng+"です" ).openPopup(); for (var i in titen){ if (latlng.distanceTo(titen[i]) < 15){ if (!judge[i]){ judge[i] = true; alert("スタンプゲット!!!"); let img =document.getElementById(`image${i}`); if(i == 0){ img.src = "image/hanyo.png"; marker[i].setIcon(geticon); localStorage.setItem('eleven0',true); }else if(i==1){ img.src = "image/hanyo.png"; marker[i].setIcon(geticon); localStorage.setItem('eleven1',true); } if (judge[0] == true){ if(judge[1] ==true){ postForm('get'); } } } } } } function onError(err) { restN = "あと"+(--nTrial)+"回試行します"; gpsmarker.setPopupContent("捕捉失敗:"+restN).openPopup(); if (nTrial <= 0) { navigator.geolocation.clearWatch(watchId); } } // function resetstamp() { // for (var i in titen){ // let img = document.getElementById(`image${i}`); // marker[i].setIcon(place).addTo(mymap); // judge[i]=null; // img.src = "image/img.png"; // localStorage.removeItem(`titen${i}`); // } // } //マップクリックで移動できるようにする mymap.options.singleClickTimeout = 250; mymap.on('singleclick', function(e) { if (cheat === "?cheat"){ var latlng = L.latLng(e.latlng); gpsmarker.setLatLng(e.latlng); mymap.panTo(e.latlng); console.log(e.latlng); gpsmarker.setLatLng(e.latlng).setPopupContent( "lat="+latlng.lat+", lng="+latlng.lng+"" ).openPopup(); for (var i in titen){ if (latlng.distanceTo(titen[i]) < 15){ if (!judge[i]){ judge[i] = true; alert("スタンプゲット!!!"); let img = document.getElementById(`image${i}`); if(i == 0){ img.src = "image/hanyo.png"; marker[i].setIcon(geticon); localStorage.setItem('eleven0',true); }else if(i==1){ img.src = "image/hanyo.png"; marker[i].setIcon(geticon); localStorage.setItem('eleven1',true); } console.log(judge); if (judge[0] == true){ if(judge[1] ==true){ postForm('get'); } } } } } } }); document.getElementById("start").addEventListener("click", tryWatchGPS); document.getElementById("stop").addEventListener("click", stopGPS); // document.getElementById("reset").addEventListener("click", resetstamp); }, false);