diff --git a/html/defaults.js b/html/defaults.js
index a6dd803..4c59490 100644
--- a/html/defaults.js
+++ b/html/defaults.js
@@ -105,7 +105,7 @@ var ColorByAlt = {
selected : { h: 0, s: 10, l: 5 },
// Changes added to the color of planes that have stale position info
- stale : { h: 0, s: -50, l: 12 },
+ stale : { h: 0, s: -35, l: 9 },
// Changes added to the color of planes that have positions from mlat
mlat : { h: 0, s: 0, l: 0 }
diff --git a/html/formatter.js b/html/formatter.js
index 6304737..71fb285 100644
--- a/html/formatter.js
+++ b/html/formatter.js
@@ -59,9 +59,9 @@ function format_altitude_brief(alt, vr, displayUnits) {
// Vertical Rate Triangle
var verticalRateTriangle = "";
- if (vr > 128){
+ if (vr > 192){
verticalRateTriangle = UP_TRIANGLE;
- } else if (vr < -128){
+ } else if (vr < -192){
verticalRateTriangle = DOWN_TRIANGLE;
} else {
verticalRateTriangle = NBSP;
@@ -82,9 +82,9 @@ function format_altitude_long(alt, vr, displayUnits) {
alt_text = Math.round(convert_altitude(alt, displayUnits)).toLocaleString() + NBSP + get_unit_label("altitude", displayUnits);
- if (vr > 128) {
+ if (vr > 192) {
return UP_TRIANGLE + NBSP + alt_text;
- } else if (vr < -128) {
+ } else if (vr < -192) {
return DOWN_TRIANGLE + NBSP + alt_text;
} else {
return alt_text;
diff --git a/html/planeObject.js b/html/planeObject.js
index de8be83..bdfaf58 100644
--- a/html/planeObject.js
+++ b/html/planeObject.js
@@ -201,7 +201,7 @@ PlaneObject.prototype.updateTrack = function(receiver_timestamp, last_timestamp)
feature: null,
estimated: false,
ground: on_ground,
- altitude: this.altitude
+ altitude: this.alt_rounded,
};
this.track_linesegs.push(newseg);
this.history_size ++;
@@ -269,7 +269,8 @@ PlaneObject.prototype.updateTrack = function(receiver_timestamp, last_timestamp)
feature: null,
estimated: false,
ground: on_ground,
- altitude: this.altitude });
+ altitude: this.alt_rounded,
+ });
this.history_size += 2;
return this.updateTail();
@@ -282,14 +283,15 @@ PlaneObject.prototype.updateTrack = function(receiver_timestamp, last_timestamp)
if (!isNaN(true_change)) {
track_change = isNaN(track_change) ? true_change : Math.max(track_change, true_change);
}
- var alt_change = Math.abs(this.altitude - lastseg.altitude);
+ var alt_change = Math.abs(this.alt_rounded - lastseg.altitude);
var since_update = this.prev_time - this.tail_update;
if (
- lastseg.ground != on_ground
- || (!on_ground && isNaN(alt_change))
- || (alt_change > 700)
- || (alt_change > 375 && this.altitude < 9000)
- || (alt_change > 150 && this.altitude < 5500)
+ this.alt_rounded !== lastseg.altitude
+ //lastseg.ground != on_ground
+ //|| (!on_ground && isNaN(alt_change))
+ //|| (alt_change > 700)
+ //|| (alt_change > 375 && this.alt_rounded < 9000)
+ //|| (alt_change > 150 && this.alt_rounded < 5500)
) {
// Create a new segment as the ground state or the altitude changed.
// The new state is only drawn after the state has changed
@@ -306,8 +308,9 @@ PlaneObject.prototype.updateTrack = function(receiver_timestamp, last_timestamp)
this.track_linesegs.push({ fixed: new ol.geom.LineString([projPrev]),
feature: null,
estimated: false,
- altitude: this.altitude,
- ground: on_ground });
+ altitude: this.alt_rounded,
+ ground: on_ground,
+ });
this.history_size += 2;
@@ -391,7 +394,7 @@ PlaneObject.prototype.getMarkerColor = function() {
var h, s, l;
- var colorArr = this.getAltitudeColor(this.altitude_cached);
+ var colorArr = this.getAltitudeColor(this.alt_rounded);
h = colorArr[0];
s = colorArr[1];
@@ -403,7 +406,7 @@ PlaneObject.prototype.getMarkerColor = function() {
s += ColorByAlt.stale.s;
l += ColorByAlt.stale.l;
}
- if (this.altitude == "ground") {
+ if (this.alt_rounded == "ground") {
l += 15;
}
@@ -439,7 +442,7 @@ PlaneObject.prototype.getMarkerColor = function() {
PlaneObject.prototype.getAltitudeColor = function(altitude) {
if (typeof altitude === 'undefined') {
- altitude = this.altitude;
+ altitude = this.alt_rounded;
}
return altitudeColor(altitude);
}
@@ -508,7 +511,9 @@ PlaneObject.prototype.updateIcon = function() {
//var opacity = 1.0;
var outline = (this.dataSource == "mlat" ? OutlineMlatColor : OutlineADSBColor);
var add_stroke = (this.selected && !SelectedAllPlanes) ? (' stroke="'+outline+'" stroke-width="1px"') : '';
- var baseMarkerKey = (this.category ? this.category : "A0") + "_" + this.typeDescription + "_" + this.wtc + "_" + this.icaoType;
+ var baseMarkerKey = (this.category ? this.category : "A0") + "_"
+ + this.typeDescription + "_" + this.wtc + "_" + this.icaoType;
+
if (!this.baseMarker || this.baseMarkerKey != baseMarkerKey) {
this.baseMarkerKey = baseMarkerKey;
this.baseMarker = getBaseMarker(this.category, this.icaoType, this.typeDescription, this.wtc);
@@ -530,40 +535,37 @@ PlaneObject.prototype.updateIcon = function() {
//var transparentBorderWidth = (32 / this.baseMarker.scale / scaleFactor).toFixed(1);
- var svgKey = col + '!' + outline + '!' + this.baseMarker.svg + '!' + add_stroke;
+ const svgKey = col + '!' + outline + '!' + this.baseMarker.svg + '!' + add_stroke;
- if (this.markerStyle == null || this.markerIcon == null || this.markerSvgKey != svgKey) {
+ if (this.markerStyle == null || this.markerIcon == null || (this.markerSvgKey != svgKey)) {
//console.log(this.icao + " new icon and style " + this.markerSvgKey + " -> " + svgKey);
+ if (!iconCache[svgKey]) {
+ iconCache[svgKey] = new Image();
+ iconCache[svgKey].src = svgPathToURI(this.baseMarker.svg, outline, col, add_stroke);
+ } else {
+ this.logSel("iconCache hit!");
+ }
+
this.markerSvgKey = svgKey;
this.scaleCache = scaleFactor * this.baseScale;
- var icon = new ol.style.Icon({
- anchor: [0.5, 0.5],
- anchorXUnits: 'fraction',
- anchorYUnits: 'fraction',
+ this.markerIcon = new ol.style.Icon({
scale: this.scaleCache,
imgSize: this.baseMarker.size,
- src: svgPathToURI(this.baseMarker.svg, outline, col, add_stroke),
+ img: iconCache[svgKey],
rotation: (this.baseMarker.noRotate ? 0 : rotation * Math.PI / 180.0),
- //opacity: opacity,
rotateWithView: (this.baseMarker.noRotate ? false : true)
});
-
- this.markerIcon = icon;
this.markerStyle = new ol.style.Style({
image: this.markerIcon
});
-
-
- if (this.marker) {
- this.marker.setStyle(this.markerStyle);
- }
+ this.marker.setStyle(this.markerStyle);
}
- if (this.rotationCache == null || Math.abs(this.rotationCache - rotation) > 0.25) {
+ if (this.rotationCache == null || Math.abs(this.rotationCache - rotation) > 0.15) {
this.rotationCache = rotation;
- this.markerIcon.setRotation(rotation * Math.PI / 180.0);
+ this.markerIcon.setRotation(this.baseMarker.noRotate ? 0 : rotation * Math.PI / 180.0);
}
if (this.scaleCache != scaleFactor * this.baseScale) {
@@ -618,6 +620,15 @@ PlaneObject.prototype.updateData = function(receiver_timestamp, data, init) {
this.alt_baro = data.altitude;
} else {
this.alt_baro = null;
+ this.altitude = data.alt_geom;
+ }
+
+ if (this.altitude == "ground") {
+ this.alt_rounded = this.altitude;
+ } else if (this.altitude > 5500) {
+ this.alt_rounded = (this.altitude/500).toFixed(0)*500;
+ } else {
+ this.alt_rounded = (this.altitude/250).toFixed(0)*250;
}
// don't expire the track, even display outdated track
@@ -629,9 +640,6 @@ PlaneObject.prototype.updateData = function(receiver_timestamp, data, init) {
if (init)
return;
- var alt_change = Math.abs(this.altitude - this.altitude_cached);
- if (isNaN(alt_change) || alt_change >= 75)
- this.altitude_cached = this.altitude;
// Update all of our data
this.messages = data.messages;
@@ -709,12 +717,6 @@ PlaneObject.prototype.updateData = function(receiver_timestamp, data, init) {
this.nav_altitude = null;
}
-
- // Use geometric altitude if plane doesn't transmit alt_baro
- if (this.altitude == null && 'alt_geom' in data) {
- this.altitude = data.alt_geom;
- }
-
// Pick vertical rate from either baro or geom rate
// geometric rate is generally more reliable (smoothed etc)
if ('geom_rate' in data) {
@@ -770,17 +772,14 @@ PlaneObject.prototype.updateMarker = function(moved) {
return;
}
- this.updateIcon();
- if (this.marker) {
- if (moved) {
- this.marker.setGeometry(new ol.geom.Point(ol.proj.fromLonLat(this.position)));
- }
- } else {
+ if (!this.marker) {
this.marker = new ol.Feature(new ol.geom.Point(ol.proj.fromLonLat(this.position)));
this.marker.hex = this.icao;
- this.marker.setStyle(this.markerStyle);
PlaneIconFeatures.push(this.marker);
+ } else if (moved) {
+ this.marker.setGeometry(new ol.geom.Point(ol.proj.fromLonLat(this.position)));
}
+ this.updateIcon();
};
diff --git a/html/script.js b/html/script.js
index 1d0a95e..65a6c90 100644
--- a/html/script.js
+++ b/html/script.js
@@ -10,6 +10,8 @@ var StaticFeatures = new ol.Collection();
var SiteCircleFeatures = new ol.Collection();
var PlaneIconFeatures = new ol.Collection();
var trailGroup = new ol.Collection();
+var iconsLayer;
+var iconCache = {};
var Planes = {};
var PlanesOrdered = [];
var PlaneFilter = {};
@@ -254,7 +256,6 @@ function fetchData() {
processReceiverUpdate(data);
}
-
// update timestamps, visibility, history track for all planes - not only those updated
for (var i = 0; i < PlanesOrdered.length; ++i) {
var plane = PlanesOrdered[i];
@@ -265,12 +266,12 @@ function fetchData() {
}
selectNewPlanes();
+
refreshSelected();
refreshHighlighted();
refreshTableInfo();
refreshClock(new Date(now * 1000));
- OLMap.render();
// Check for stale receiver data
if (last == now) {
StaleReceiverCount++;
@@ -691,7 +692,7 @@ function initialize_map() {
layers = createBaseLayers();
- var iconsLayer = new ol.layer.Vector({
+ iconsLayer = new ol.layer.Vector({
name: 'ac_positions',
type: 'overlay',
title: 'Aircraft positions',
@@ -2029,7 +2030,7 @@ function toggleMapDim() {
}
$('#mapdim_checkbox').addClass('settingsCheckboxChecked');
}
- OLMap.renderSync();
+ OLMap.render();
}
function toggleAltitudeChart(switchToggle) {