From 1bf2b1ca7e192f154e9239c08bd52dccc770b355 Mon Sep 17 00:00:00 2001 From: nbonniere Date: Sat, 19 Aug 2017 15:41:21 -0400 Subject: [PATCH] Add files to support barogram display. --- barogram.js | 186 ++++++++++++++++++++++++++++++++++++++++++++ horizZoom.png | Bin 0 -> 425 bytes horizZoomControl.js | 54 +++++++++++++ 3 files changed, 240 insertions(+) create mode 100644 barogram.js create mode 100644 horizZoom.png create mode 100644 horizZoomControl.js diff --git a/barogram.js b/barogram.js new file mode 100644 index 0000000..587760f --- /dev/null +++ b/barogram.js @@ -0,0 +1,186 @@ +/* + ____ _____ _ _ _ _ _ _ _ + / __ \ / ____| (_) | | | \ | | | | | | + | | | |_ __ ___ _ __ | | __| |_ __| | ___ _ __ | \| | ___| |___ _____ _ __| | __ + | | | | '_ \ / _ \ '_ \ | | |_ | | |/ _` |/ _ \ '__| | . ` |/ _ \ __\ \ /\ / / _ \| '__| |/ / + | |__| | |_) | __/ | | | | |__| | | | (_| | __/ | | |\ | __/ |_ \ V V / (_) | | | < + \____/| .__/ \___|_| |_| \_____|_|_|\__,_|\___|_| |_| \_|\___|\__| \_/\_/ \___/|_| |_|\_\ + | | + |_| +*/ +// barogram option +var baroCanvas; +var baroScale; +var baroMarker; +var baroCtx; +var baroScaleCtx; +var baroMarkCtx; +var X_max; +var X_min; +var Y_max; +var Y_min; +var xScale; +var yScale; +var xWidth; +var yHeight; +var xAxis = []; // optional scale labels +var yAxis = []; // optional scale labels +var margin = 10; // all around line graph +var X_legend = 0; +var Y_legend = 0; +var maxAlt = 5000; +var X_lines = 5+1; +var Y_lines = 5+1; +var currentUnit = ""; +var scaleFlag = 0; +var X_offset = 0; +var Y_offset = margin+X_legend; + +// show altitude scale on the graph +function plotScale() { +// var TxtWidth = baroCtx.measureText(xAxis[0]).width; +// var TxtHeight = baroCtx.measureText(xAxis[0]).height; + var TxtHeight = 10; + baroScaleCtx.strokeStyle="#c0c0c0"; // color of axis text + baroScaleCtx.beginPath(); + // print parameters on X axis + if (xAxis.length == X_lines) { + for (i=0;i 1) { + // plot the altitude data + baroCtx.strokeStyle=dColor; // color of line + baroCtx.beginPath(); + baroCtx.moveTo((dataSet[0][0]-X_min) * xScale + X_offset, yHeight-(dataSet[0][1] * yScale) + Y_offset); + for (i=1 ;i60 ? 900 : pathl*10); // 5, 10 else 15 minutes + xScale = (xWidth) / (X_max - X_min); + // update the altitude scale + var maxRange = maxAlt * m2ft[unit]; + // auto adjust the range +// (unit == "i") ? maxRange = Math.ceil((maxRange+250)/2000)*2000 : maxRange = Math.ceil((maxRange+100)/1000)*1000; // 2000 ft or 1000 m increments + (unit == "i") ? maxRange = Math.ceil((maxRange+500)/1000)*1000 : maxRange = Math.ceil((maxRange+250)/500)*500; // 1000 ft or 500 m increments + if ((maxRange != Y_max) || (unit != currentUnit)) { + currentUnit = unit; + Y_max = maxRange; + yScale = (yHeight) / (Y_max - Y_min) * m2ft[unit]; // adjust scale with unit here to avoid and extra multiply every y point + // auto adjust the grid spacing +// (unit == "i") ? Y_lines = (Y_max / 1000) + 1 : Y_lines = (Y_max / 500) + 1; // 1000 ft or 500 m grid steps + (unit == "i") ? Y_lines = (Y_max / 1000) + 1 : Y_lines = (Y_max / 250) + 1; // 1000 ft or 250 m grid steps + baroScaleCtx.clearRect(0, 0, baroScale.width, baroScale.height); + plotScale(); + } + // erase the plot (and grid) +// baroCtx.clearRect(0, margin+X_legend, margin+X_legend+xWidth, margin+X_legend+yHeight); + baroCtx.clearRect(0, 0, baroCanvas.width, baroCanvas.height); + plotGrid(); // re-plot the grid + // erase the markers + baroMarkCtx.clearRect(0, 0, baroMarker.width, baroMarker.height); + // reset the flag + scaleFlag = 0; +} + +// set the time and altitude scales on the barogram +function Set_XY_Scale(tim,alt) { + if (scaleFlag++ == 0) { // use first item as a reference + X_max = tim.toSeconds(); + maxAlt = +alt; // '+' used for conversion from string to integer + } else { + if (X_max < tim.toSeconds()) { + X_max = tim.toSeconds(); + } + if (maxAlt < +alt) { + maxAlt = +alt; + } + } +} diff --git a/horizZoom.png b/horizZoom.png new file mode 100644 index 0000000000000000000000000000000000000000..0a40fd0557a285ebd90a6de6e69af0510fa71c0a GIT binary patch literal 425 zcmV;a0apHrP)Px#1ZP1_K>z@;j|==^1poj532;bRa{vGi!~g&e!~vBn4jTXf0X|7YK~z{r?U>JM zgfI}sKX>~NLFr5M?m_6o_#8fkkKk3$rRQEsFYUpD=R)s26a-_n+udc`Nz+B7c0+cN zO~?<1Nyg~#C6f?zo}R1C_0=Vop9`Fxox>E~*a|PN4V=w4>-7rr`H6UB4)2TZN1*5% z$xL`-u>ucGp68-94R!@}M@b-+S(>JkmzxSo0?V>QQ54)CJGMl1N9ra+d#zuNj4{w_ zj^n`dJP`$gAV3sFqW3rSt^dXhbB!UBi;!Buwrx?@_11ppgnU0vAOH_BPK;5x_)pUmoWFIx}m`2r9nBCspz`O9#Ejtl5gQjcn@OY0er+9)) T?+f{T00000NkvXXu0mjfnjW{* literal 0 HcmV?d00001 diff --git a/horizZoomControl.js b/horizZoomControl.js new file mode 100644 index 0000000..6effeb9 --- /dev/null +++ b/horizZoomControl.js @@ -0,0 +1,54 @@ + +/* + * The ZoomControl adds horizontal [+/-] buttons for the map + * to replace the standard vertical one + */ + +function ZoomControl(controlDiv, map) { + + // Creating divs & styles for custom zoom control + controlDiv.style.padding = '10px'; + + // Set CSS for the control wrapper + var controlWrapper = document.createElement('div'); + controlWrapper.style.cursor = 'pointer'; + controlWrapper.style.width = '56px'; + controlWrapper.style.height = '28px'; + controlWrapper.style.backgroundImage = 'url("horizZoom.png")'; + controlDiv.appendChild(controlWrapper); + + // Set CSS for the zoomIn + var zoomInButton = document.createElement('div'); + zoomInButton.style.float = "left"; + zoomInButton.style.width = '28px'; + zoomInButton.style.height = '28px'; + controlWrapper.appendChild(zoomInButton); + + // Set CSS for the zoomOut + var zoomOutButton = document.createElement('div'); + zoomOutButton.style.float = "left"; + zoomOutButton.style.width = '28px'; + zoomOutButton.style.height = '28px'; + controlWrapper.appendChild(zoomOutButton); + + // Setup the click event listener - zoomIn + google.maps.event.addDomListener(zoomInButton, 'click', function() { + map.setZoom(map.getZoom() + 1); + }); + + // Setup the click event listener - zoomOut + google.maps.event.addDomListener(zoomOutButton, 'click', function() { + map.setZoom(map.getZoom() - 1); + }); + +} + +function horizZoomControl_initialize() { + // Create the DIV to hold the control and call the ZoomControl() constructor + // passing in this DIV. + var zoomControlDiv = document.createElement('div'); + var zoomControl = new ZoomControl(zoomControlDiv, map); + + zoomControlDiv.index = 1; + map.controls[google.maps.ControlPosition.TOP_CENTER].push(zoomControlDiv); +}