diff --git a/dump1090.c b/dump1090.c
index 6e31c57..ee11512 100644
--- a/dump1090.c
+++ b/dump1090.c
@@ -2142,8 +2142,10 @@ char *aircraftsToJson(int *len) {
if (a->lat != 0 && a->lon != 0) {
l = snprintf(p,buflen,
"{\"hex\":\"%s\", \"flight\":\"%s\", \"lat\":%f, "
- "\"lon\":%f, \"altitude\":%d, \"track\":%d},\n",
- a->hexaddr, a->flight, a->lat, a->lon, a->altitude, a->track);
+ "\"lon\":%f, \"altitude\":%d, \"track\":%d, "
+ "\"speed\":%d},\n",
+ a->hexaddr, a->flight, a->lat, a->lon, a->altitude, a->track,
+ a->speed);
p += l; buflen -= l;
/* Resize if needed. */
if (buflen < 256) {
diff --git a/gmap.html b/gmap.html
index a1c9d38..9d8cf3d 100644
--- a/gmap.html
+++ b/gmap.html
@@ -7,6 +7,30 @@
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
+ #info {
+ position: absolute;
+ width:20%;
+ height:100%;
+ bottom:0px;
+ right:0px;
+ top:0px;
+ background-color: white;
+ border-left:1px #666 solid;
+ font-family:Helvetica;
+ }
+ #info div {
+ padding:0px;
+ padding-left:10px;
+ margin:0px;
+ }
+ #info div h1 {
+ margin-top:10px;
+ font-size:16px;
+ }
+ #info div p {
+ font-size:14px;
+ color:#333;
+ }
@@ -18,16 +42,19 @@
CenterLat=45.0;
CenterLon=9.0;
Planes={};
+ NumPlanes = 0;
+ Selected=null
function getIconForPlane(plane) {
var r = 255, g = 255, b = 0;
var maxalt = 40000; /* Max altitude in the average case */
var invalt = maxalt-plane.altitude;
+ var selected = (Selected == plane.hex);
if (invalt < 0) invalt = 0;
b = parseInt(255/maxalt*invalt);
return {
- strokeWeight: 1,
+ strokeWeight: (selected ? 2 : 1),
path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
scale: 5,
fillColor: 'rgb('+r+','+g+','+b+')',
@@ -36,6 +63,39 @@
};
}
+ function selectPlane() {
+ if (!Planes[this.planehex]) return;
+ var old = Selected;
+ Selected = this.planehex;
+ if (Planes[old]) {
+ /* Remove the highlight in the previously selected plane. */
+ Planes[old].marker.setIcon(getIconForPlane(Planes[old]));
+ }
+ Planes[Selected].marker.setIcon(getIconForPlane(Planes[Selected]));
+ refreshSelectedInfo();
+ }
+
+ function refreshGeneralInfo() {
+ var i = document.getElementById('geninfo');
+
+ i.innerHTML = NumPlanes+' planes on screen.';
+ }
+
+ function refreshSelectedInfo() {
+ var i = document.getElementById('selinfo');
+ var p = Planes[Selected];
+
+ if (!p) return;
+ var html = 'ICAO: '+p.hex+'
';
+ if (p.flight.length) {
+ html += ''+p.flight+'
';
+ }
+ html += 'Altitude: '+p.altitude+' feets
';
+ html += 'Speed: '+p.speed+' knots
';
+ html += 'Coordiates: '+p.lat+', '+p.lon+'
';
+ i.innerHTML = html;
+ }
+
function fetchData() {
$.getJSON('/data.json', function(data) {
var stillhere = {}
@@ -52,6 +112,12 @@
var newpos = new google.maps.LatLng(plane.lat, plane.lon);
marker.setPosition(newpos);
marker.setIcon(getIconForPlane(plane));
+ myplane.altitude = plane.altitude;
+ myplane.speed = plane.speed;
+ myplane.lat = plane.lat;
+ myplane.lon = plane.lon;
+ if (myplane.hex == Selected)
+ refreshSelectedInfo();
} else {
marker = new google.maps.Marker({
position: new google.maps.LatLng(plane.lat, plane.lon),
@@ -59,13 +125,18 @@
icon: getIconForPlane(plane)
});
plane.marker = marker;
+ marker.planehex = plane.hex;
Planes[plane.hex] = plane;
+
+ /* Trap clicks for this marker. */
+ google.maps.event.addListener(marker, 'click', selectPlane);
}
if (plane.flight.length == 0)
marker.setTitle(plane.hex)
else
marker.setTitle(plane.flight+' ('+plane.hex+')')
}
+ NumPlanes = data.length;
/* Remove idle planes. */
for (var p in Planes) {
@@ -74,7 +145,6 @@
delete Planes[p];
}
}
-
});
}
@@ -89,11 +159,20 @@
/* Setup our timer to poll from the server. */
window.setInterval(function() {
fetchData();
+ refreshGeneralInfo();
}, 1000);
}
+
Click on a plane for info.
+