dev-chiefworks
185 lines
5.7 KiB
PHP
185 lines
5.7 KiB
PHP
<?php
|
|
require '../backend.php';
|
|
|
|
//PostgreSQL
|
|
$gps_db_host = $savvyext->cfgReadChar('gpsdatabase.host');
|
|
$gps_db_port = $savvyext->cfgReadLong('gpsdatabase.port');
|
|
$gps_db_name = $savvyext->cfgReadChar('gpsdatabase.name');
|
|
$gps_db_user = $savvyext->cfgReadChar('gpsdatabase.user');
|
|
$gps_db_pass = $savvyext->cfgReadChar('gpsdatabase.pass');
|
|
$conn_string_gps = "host=${gps_db_host} port=${gps_db_port} dbname=${gps_db_name} user=${gps_db_user} password=${gps_db_pass}";
|
|
$pgconn_gps = pg_connect($conn_string_gps);
|
|
|
|
$res = [];
|
|
$min_lat = PHP_INT_MAX;
|
|
$min_lng = PHP_INT_MAX;
|
|
$max_lat = PHP_INT_MIN;
|
|
$max_lng = PHP_INT_MIN;
|
|
$center_lat = 0;
|
|
$center_lng = 0;
|
|
$limit_lat = 48.90972600;
|
|
$limit_lng = 24.78142110;
|
|
$limit_rad = 3500;
|
|
//$q = "select * from members_tracking where member_id=13 and id>1961278 and id<1961766 order by created";
|
|
$q = "select * from members_tracking where member_id=13 and id>1961278 and id<1961766 ";
|
|
$q.= " and ST_DWithin(gps,ST_SetSRID(ST_MakePoint(${limit_lng},${limit_lat}),4326)::geography,${limit_rad}) ";
|
|
$q.= " order by created";
|
|
//echo $q;
|
|
$r = pg_query($pgconn_gps, $q);
|
|
while ($f=pg_fetch_assoc($r)) {
|
|
$res[] = $f;
|
|
if ($f["lat"]<$min_lat) $min_lat = $f["lat"];
|
|
if ($f["lng"]<$min_lng) $min_lng = $f["lng"];
|
|
if ($f["lat"]>$max_lat) $max_lat = $f["lat"];
|
|
if ($f["lng"]>$max_lng) $max_lng = $f["lng"];
|
|
}
|
|
$center_lat = ($min_lat+$max_lat)/2;
|
|
$center_lng = ($min_lng+$max_lng)/2;
|
|
pg_close($pgconn_gps);
|
|
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>GPS speed test</title>
|
|
<style>
|
|
/* Always set the map height explicitly to define the size of the div
|
|
* element that contains the map. */
|
|
#map {
|
|
height: 625px;
|
|
}
|
|
/* Optional: Makes the sample page fill the window. */
|
|
html, body {
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.container div {
|
|
display: inline-block;
|
|
vertical-align: top; /* here */
|
|
}
|
|
</style>
|
|
<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<hr size=-1>
|
|
<div id="map"></div>
|
|
<hr size=-1>
|
|
<div class="container">
|
|
<div class = "one">
|
|
<table>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>GPS</th>
|
|
<th>Speed</th>
|
|
<th>Time</th>
|
|
<th>Created</th>
|
|
</tr>
|
|
<? foreach ($res as $f) { ?>
|
|
<tr>
|
|
<td><?=$f["id"]?></td>
|
|
<td><?=$f["lat"]?>,<?=$f["lng"]?></td>
|
|
<td><?=$f["speed"]?></td>
|
|
<td><?=strtok($f["ttime"],'.')?></td>
|
|
<td><?=strtok($f["created"],'.')?></td>
|
|
</tr>
|
|
<? } ?>
|
|
</table>
|
|
</div>
|
|
<div class = "two">
|
|
<canvas id="line-chart" width="800" height="450"></canvas>
|
|
<br/>
|
|
<?= distanceBetweenTwoGpsCoordinates(48.91037785,24.77400796,48.90451974,24.82994663,'K'); ?>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
var map;
|
|
function initMap() {
|
|
map = new google.maps.Map(document.getElementById('map'), {
|
|
zoom: 13,
|
|
center: {lat: <?=$center_lat?>, lng: <?=$center_lng?>},
|
|
mapTypeId: 'roadmap'
|
|
});
|
|
var flightPlanCoordinates = [
|
|
<? for ($i=0; $i<count($res)-1;$i++) {
|
|
echo " {lat: ".$res[$i]["lat"].", lng: ".$res[$i]["lng"]."},\n";
|
|
} echo " {lat: ".$res[count($res)-1]["lat"].", lng: ".$res[count($res)-1]["lng"]."}\n";?>
|
|
];
|
|
var flightPath = new google.maps.Polyline({
|
|
path: flightPlanCoordinates,
|
|
geodesic: true,
|
|
strokeColor: '#FF0000',
|
|
strokeOpacity: 1.0,
|
|
strokeWeight: 2
|
|
});
|
|
flightPath.setMap(map);
|
|
<? for ($i=0; $i<count($res);$i++) { ?>
|
|
var marker<?=$i?> = new google.maps.Marker({
|
|
position: {lat: <?=$res[$i]['lat']?>, lng: <?=$res[$i]['lng']?>},
|
|
map: map,
|
|
title: '<?=$res[$i]["speed"]?>'
|
|
});
|
|
<? } ?>
|
|
var gpsCircle = new google.maps.Circle({
|
|
strokeColor: '#FF0000',
|
|
strokeOpacity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: '#FF0000',
|
|
fillOpacity: 0.35,
|
|
map: map,
|
|
center: {lat:<?=$limit_lat?>,lng:<?=$limit_lng?>},
|
|
radius: <?=$limit_rad?>
|
|
});
|
|
}
|
|
</script>
|
|
<script>
|
|
$(function() {
|
|
let chart = new Chart(
|
|
document.getElementById("line-chart"), {
|
|
type: 'line',
|
|
data: {
|
|
labels: [''<? foreach ($res as $f) echo ",'".strtok($f["ttime"],'.')."'"; ?>],
|
|
datasets: [{
|
|
data: [0<? foreach ($res as $f) echo ",".$f["speed"]; ?>],
|
|
label: "Speed",
|
|
borderColor: "#3e95cd",
|
|
fill: false
|
|
}],
|
|
},
|
|
options: {
|
|
title: {
|
|
display: true,
|
|
text: 'Speed'
|
|
}
|
|
}
|
|
}
|
|
);
|
|
});
|
|
</script>
|
|
<script async defer
|
|
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDvjiRTxngOQyBP4zpqFlZuiquc0ROvo9c&libraries=visualization&callback=initMap">
|
|
</script>
|
|
</body>
|
|
</html>
|
|
<?
|
|
function distanceBetweenTwoGpsCoordinates($lat1,$lon1,$lat2,$lon2,$unit) {
|
|
//error_log("public function distanceBetweenTwoGpsCoordinates($lat1,$lon1,$lat2,$lon2,$unit)");
|
|
if (($lat1 == $lat2) && ($lon1 == $lon2)) {
|
|
return 0;
|
|
}
|
|
$theta = $lon1 - $lon2;
|
|
$dist = sin(deg2rad($lat1)) * sin(deg2rad($lat2)) + cos(deg2rad($lat1)) * cos(deg2rad($lat2)) * cos(deg2rad($theta));
|
|
$dist = acos($dist);
|
|
$dist = rad2deg($dist);
|
|
$miles = $dist * 60 * 1.1515;
|
|
$unit = strtoupper($unit);
|
|
if ($unit == "K") {
|
|
return ($miles * 1.609344);
|
|
}
|
|
if ($unit == "N") {
|
|
($miles * 0.8684);
|
|
}
|
|
return $miles;
|
|
}
|