woelpert/biketrack-plainjs
2
0
Fork 0
Code Issues Pull Requests repo.project_board Releases Wiki Activity

added showbikeFunction

Browse Source
This commit is contained in:
Jens Wölpert 2022-07-19 16:26:53 +02:00
parent 47c2fab741
commit 36e529bbbd
4 changed files with 74 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
execution.js
View File

@ -1,11 +1,4 @@
(async () =>{
console.log( getAllCoordinates('route2'))
//var polyline = L.polyline(newArray, {color: 'red'}).addTo(map);
//map.fitBounds(polyline.getBounds());
//connectDB('route2')
})();
//displayRoute();
//showBike()
})();

44
functions.js
View File

@ -12,11 +12,11 @@
initIPFS()
async function createDb(db_name){
async function createDb(db_name){
// Create database instance
const ipfsOptions = { repo: '/orbitdb/examples/browser/new/ipfs/0.33.1', }
const ipfs = await Ipfs.create(ipfsOptions)
//const ipfsOptions = { repo: '/orbitdb/createdb1', }
const ipfs = await Ipfs.create()
const orbitdb = await OrbitDB.createInstance(ipfs)
// Create IPFS instance
const db = await orbitdb.keyvalue(db_name)
@ -24,7 +24,10 @@ initIPFS()
console.log(address)
console.log(db.address.toString())
await db.put('2022-07-01T10:49:07', '49.41185089/8.67646861')
await db.put('2022-07-01T10:49:12', '49.41166303/8.67652893')
await db.put('2022-07-01T10:49:12', '49.41166303/8.67652893')
await db.put('2022-07-01T10:49:20','49.41123636/8.67652849')
await db.put(' 2022-07-01T10:49:25','49.41084041/8.67651128')
await db.put('2022-07-01T10:49:31','49.41049801/8.67656948')
let csv = "./new.csv"
const value = db.all
//console.log(value)
@ -35,8 +38,7 @@ initIPFS()
}
async function loadRoute(db_name){
const ipfsOptions = { repo: '/orbitdb/los', }
const ipfs = await Ipfs.create(ipfsOptions)
const ipfs = await Ipfs.create()
const orbitdb = await OrbitDB.createInstance(ipfs)
const db = await orbitdb.keyvalue(db_name)
@ -54,13 +56,20 @@ async function connectDB(dbname){
const route2 = db_route2.all
console.log(route2);
}
async function getActualCoordinates(){
async function getCurrentCoordinate(){
var db_conn = await createDb('coordinates')
const currentCoordinate = db_conn.all
console.log(currentCoordinate)
var latest_coord_string = (currentCoordinate[Object.keys(currentCoordinate)[Object.keys(currentCoordinate).length - 1]])
var latest_coordinate_str = latest_coord_string.split("/")
latest_coordinate_str[0] = parseFloat(latest_coordinate_str[0])
latest_coordinate_str[1] = parseFloat(latest_coordinate_str[1])
console.log(latest_coordinate_str)
return latest_coordinate_str;
}
async function getAllCoordinates(dbname){
// creater db with name db2
async function getAllCoordinates(dbname){
var db2 = await createDb(dbname)
const all_coordinates = db2.all
// coordinates in this schema 49.123/8.2311
@ -80,9 +89,18 @@ for (var i = 0; i < comma_string.length; i++) {
newArray.push([comma_string[i], comma_string[increment]])
increment = increment+1
i = i+1
}
console.log(newArray);
(function(elem) {
var callee = arguments.callee;
return elem instanceof Array ? elem.map(function(elem2) { return callee(elem2); })
: parseFloat(elem);
})
newArray = newArray.map(function(elem) {
return elem.map(function(elem2) {
return parseFloat(elem2);
});
});
//console.log(newArray)
return newArray;
}

20
index.html
View File

@ -8,11 +8,13 @@
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
crossorigin=""></script>
<script src="jquery-csv.js"> </script>
<script src="https://cdn.jsdelivr.net/npm/d3@7"></script>
<script src="jquery-csv.js"> </script>
<meta charset="utf-8">
<title>Track your bike</title>
</head>
<body>
<button onclick="showBike()"> Locate your Bike!</button>
<ul>
<li>
<div class="wrapper">
@ -99,13 +101,21 @@
<script type="text/javascript" src="map.js"></script>
<script type="text/javascript" src="execution.js"></script>
<script type="file" src="new.csv"></script>
<script>
var csv = './new.csv'
var data = $.csv.toObjects(csv);
console.log(data)
//v//ar csv = './new.csv'
// var data = $.csv.toObjects(csv);
//console.log(data)
//const res = d3.csvParse(csv);
//console.log(res);
</script>
</script>
<style> #map { height: 1000px; width: 1000px; }</style>
<style> #map { height: 600px; width: 600px; margin: auto }</style>
<style>
/*
* {

37
map.js
View File

@ -1,19 +1,32 @@
var map = L.map('map').setView([49.416075235, 8.6722049], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
zoom: 44,
var map = L.map('map').setView([49.41607523, 8.672200499], 19);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 44,
attribution: '© OpenStreetMap'
}).addTo(map);
}).addTo(map)
//L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
//var marker = L.marker([49.41607523,8.67220049]).addTo(map);
//var polyline = L.polyline(newArray, {color: 'red'}).addTo(map);
//map.fitBounds(polyline.getBounds());
// helper function for displayRoute()
async function prepare(){
var allcoordinates = getAllCoordinates('coordinates');
return allcoordinates;
}
async function displayRoute() {
var allcoordinates = await prepare();
console.log(allcoordinates);
//var marker = L.marker([49.41607523,8.67220049]).addTo(map);
var polyline = L.polyline(allcoordinates, {color: 'red'}).addTo(map);
map.fitBounds(polyline.getBounds());
map.fitBounds(polyline.getBounds());
}
async function showBike(){
var current_cord = await getCurrentCoordinate()
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
L.marker(current_cord).addTo(map)
.bindPopup(' Your BIKE!')
.openPopup();
}