//GitBucket GitBucket //Toggle navigation //Find a repository //Pull requests Issues Snippets //@c120087-kodama Files Branches1 Releases Issues //Pull requests Labels Priorities Milestones Wiki Fumiya238 / AR-project AR-project / leaflet / leaflet.js //@Satou Fumiya Satou Fumiya on 2 Nov 4 KB clean:ファイルを整理、hrefを整理 let map = L.map('map').fitWorld(); L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors', maxZoom: 18, tileSize: 512, zoomOffset: -1 }).addTo(map); map.setView([38.70010302736321, 139.88572398517292],16); // map.locate({setView:true, maxZoom: 16}); よくわかんないけど中心位置がtrueで自分の今いる位置が表示される let threshold = 50; //50メートル以内に設定 let id,marker,circle; // マーカーと緯度経度の設定 // 松ヶ丘開墾記念館 let a = L.marker([38.70029457103109, 139.88541162806743]).addTo(map); a = L.latLng(38.70029457103109, 139.88541162806743); // 松ヶ岡開墾場 -MATSUGAOKA CRAFT PARK- let b = L.marker([38.70012988942131, 139.8863486910772]).addTo(map); b = L.latLng(38.70012988942131, 139.8863486910772); // kibisoショップin松ヶ岡 let c = L.marker([38.69988113993072, 139.8855818280956]).addTo(map); c = L.latLng(38.69988113993072, 139.8855818280956); // 松ヶ丘農村公園 let x = L.marker([38.69964477687674, 139.88544274760642]).addTo(map); x = L.latLng(38.69964477687674, 139.88544274760642); // 松ヶ丘本陣 let y = L.marker([38.699988075257004, 139.8843537707502]).addTo(map); y = L.latLng(38.699988075257004, 139.8843537707502); // 松岡物産(株) let z = L.marker([38.69988671925472, 139.88613962535007]).addTo(map); z = L.latLng(38.69988671925472, 139.88613962535007); function onLocationFound(e) { let radius = e.accuracy/2; if (marker) map.removeLayer(marker); //マーカー削除 marker = L.marker(e.latlng).addTo(map); //マーカー追加 marker.bindPopup('現在地').openPopup(); if (circle) map.removeLayer(circle); circle = L.circle(e.latlng, radius).addTo(map); map.setView(e.latlng); // 現在地と目的地の距離を計測 let d = a.distanceTo(e.latlng); let g = b.distanceTo(e.latlng); let f = c.distanceTo(e.latlng); // 50メートル以内に近づいた時の処理 if (d < threshold) { alert("おはよう"); } else if(g < 10){ window.location.href=('https://www.yatex.org/gitbucket/Fumiya238/AR-project/pages/AR/AR-location_based.html'); } else if (f < threshold){ alert("こんばんわ"); } } // 位置情報取得できなかったときの処理 function onLocationError(e) { alert(e.message); } // 位置情報を持ってくる関数 function watchFound(e) { onLocationFound({ latlng: L.latLng([ e.coords.latitude, e.coords.longitude]), accuracy: e.coords.accuracy}); } // id = navigator.geolocation.watchPosition(watchFound,onLocationError); let $start = document.getElementById('start'); // スタートボタンクリック時の位置情報を定期的に取得 $start.addEventListener("click", function(e) { this.setAttribute("disabled", true); id = navigator.geolocation.watchPosition(watchFound,onLocationError); }); // 位置情報取得中止 let i=1; let $stop = document.getElementById('stop') $stop.addEventListener("click", function(e) { $start.removeAttribute("disabled"); $zuru.removeAttribute("disabled"); navigator.geolocation.clearWatch(id); i=1; }); // マップクリックしたら経度、緯度の表示 const $zuru = document.getElementById('zuru'); let popup = L.popup(); function onMapClick(e) { if (i===0){ if (marker) map.removeLayer(marker); marker = L.marker(e.latlng).addTo(map); marker.bindPopup('現在地').openPopup(); if (circle) map.removeLayer(circle); circle = L.circle(e.latlng).addTo(map); map.setView(e.latlng); let d = a.distanceTo(e.latlng); let g = b.distanceTo(e.latlng); let f = c.distanceTo(e.latlng); // 50メートル以内に近づいた時の処理 if (d < threshold) { alert("おはよう"); } else if(g < 20){ alert('みつかった〜!') window.location.href=('https://www.yatex.org/gitbucket/Fumiya238/AR-project/pages/AR/AR-location_based.html'); } else if (f < threshold){ alert("こんばんわ"); } } } $zuru.addEventListener('click',function (){ i=0; this.setAttribute("disabled", true); map.on('click', onMapClick); }); // setViewまたはcenterで最初に表示される中心位置を設定できる // zoomで最初に表示される近さを設定できる // .bindPopupメソッドでHTMLコンテンツを含むポップアップを表示する // .popup()で表示されるコンテンツを設定できる // .latlngでその場所の経度、を緯度調べられる // distanceTo(<LatLng> otherLatLng)で距離が図れる // LatLng.distanceTo(otherLatLng)で書いたらうまく行った // let map = L.map('map').setView([38.89232, 139.82221], 15); // L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { // attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' // }).addTo(map);