ブラウザにGPS座標を記録していく

外部ライブラリneko.jsを使います

var GPS_DATA;

function myGps(pos) {
  var myIdo = pos.coords.latitude;
  var myKeido = pos.coords.longitude;
 
GPS_DATA = [myIdo, myKeido];
dataSave();
//console.log(GPS_DATA);

}

///----ここからデータセーブのライブラリ
var myData = localStorage;//”localstorage”というのは変えてはいけない
function dataSave() {
  var myDate = new Date().toLocaleString();
  //var myPos = GPS_DATA.toString();
  //myData.setItem(myDate, myPos);
  myData.setItem(myDate, JSON.stringify(GPS_DATA));//日付にJSON形式に変換したGPS座標を入力
  //console.log(GPS_DATA);
  showData();
}

function showData(){
var result = "";
 for(var i=0; i <5; i++){//5個表示
var k = myData.key(i);
result += k + " , " + JSON.parse(myData.getItem(k)) + "<br />";
}
  //  var k = myData.key(i);

  //上のループで作成されたテキストを表示する
 document.getElementById("myReturn").innerHTML = result;
//console.log(result);
}


function erase() {
  myData.clear();
}
////ここまで

 

これを使うhtmlです

<!DOCTYPE html>
<html>
<head>
<title>nekoライブラリ</title>
<meta charset="UTF-8">
<script src="./neko.js"></script>
</head>
<body>
    <div id="myReturn"></div>
<input type="button" value="この場所を記録する" onclick="gpsget()">
<input type="button" value="これまでの結果5件表示" onclick="showData()">
<input type="button" value="データ消去" onclick="erase()">
<script type="text/javascript">
//---GPSはここから

function gpsget(){
	if(window.confirm('GPSを記録しますか?')){
	if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(myGps);//GPS取得用
	}
}else{
		window.alert('キャンセルされました'); // 警告ダイアログを表示
	}
}

</script>


</body>
</html>