annotate weather_server/static/script.js @ 12:9e6289598d8c

Add script to draw charts with initial functions.
author Paul Fisher <paul@pfish.zone>
date Sun, 06 Oct 2019 15:21:03 -0400
parents
children 4eaa9d69c4e2
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
12
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
1 'use strict';
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
2
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
3 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
4 * Converts Celsius to Fahrenheit.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
5 * @param {number} tempC
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
6 * @return {number} The temperature in Fahrenheit.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
7 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
8 function cToF(tempC) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
9 return tempC * 9 / 5 + 32;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
10 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
11
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
12 const MAGNUS_B = 17.62;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
13 const MAGNUS_C = 243.12;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
14
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
15 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
16 * The gamma function to calculate dew point.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
17 *
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
18 * @param {number} tempC The temperature, in degrees Celsius.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
19 * @param {number} rhPct The relative humidity, in percent.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
20 * @return {number} The value of the gamma function.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
21 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
22 function gammaFn(tempC, rhPct) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
23 return Math.log(rhPct / 100) + MAGNUS_B * tempC / (MAGNUS_C + tempC);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
24 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
25
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
26 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
27 * Calculates the dew point.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
28 *
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
29 * @param {number} tempC The temperature, in degrees Celsius.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
30 * @param {number} rhPct The relative humidity, in percent.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
31 * @return {number} The dew point, in degrees Celsius.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
32 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
33 function dewPointC(tempC, rhPct) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
34 const gamma = gammaFn(tempC, rhPct);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
35 return MAGNUS_C * gamma / (MAGNUS_B - gamma);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
36 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
37
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
38 /** The height of the chart in degrees. */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
39 const CHART_HEIGHT = 15;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
40
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
41 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
42 * Charts some data.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
43 *
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
44 * @param {CanvasRenderingContext2D} ctx The context to draw in.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
45 * @param {[number, number][]} data The data to chart, as `[x, y]` pairs.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
46 * @param {[number, number]} xRange The bounds of the X axis to draw.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
47 * @param {[number, number]} size The `[width, height]` of the context.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
48 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
49 function drawChart(ctx, data, xRange, size) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
50 const yRange = calculateYRange(data.map(d => d[1]));
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
51
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
52 ctx.lineWidth = 1.5;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
53
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
54 ctx.beginPath();
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
55 const first = project(data[0], size, xRange, yRange);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
56 ctx.moveTo(...first);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
57 for (const pt of data) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
58 const projected = project(pt, size, xRange, yRange);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
59 ctx.lineTo(...projected);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
60 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
61 ctx.stroke();
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
62 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
63
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
64 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
65 * Determines what the Y range of the chart should be.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
66 * @param {number[]} ys The Y values of the chart.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
67 * @return {[number, number]} The lowest and highest values of the range.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
68 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
69 function calculateYRange(ys) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
70 const yMax = Math.max(...ys);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
71 const yMin = Math.min(...ys);
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
72 const yMid = (yMin + yMax) / 2;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
73 const lastY = ys[ys.length - 1];
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
74
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
75 // We want the last value to be, at most, at the top or bottom 1/4 line
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
76 // of the chart.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
77
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
78 // If the middle of the range is already close enough, just use that.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
79 if (CHART_HEIGHT / 4 <= Math.abs(yMid - lastY)) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
80 return [yMid - CHART_HEIGHT / 2, yMid + CHART_HEIGHT / 2];
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
81 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
82 // Otherwise, clamp the chart range.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
83 if (lastY < yMid) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
84 return [lastY - CHART_HEIGHT / 4, lastY + 3 * CHART_HEIGHT / 4];
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
85 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
86 return [lastY - 3 * CHART_HEIGHT / 4, lastY + CHART_HEIGHT / 4];
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
87 }
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
88
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
89 /**
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
90 * Projects a Cartesian coordinate into Canvas space.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
91 *
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
92 * @param {[number, number]} coord The `[x, y]` coordinate to project.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
93 * @param {[number, number]} size The `[width, height]` of the context.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
94 * @param {[number, number]} xRange The range of X values in the context.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
95 * @param {[number, number]} yRange The range of Y values in the context.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
96 * @return {[number, number]} The `[x, y]` coordinate in Canvas space.
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
97 */
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
98 function project(coord, size, xRange, yRange) {
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
99 const [x, y] = coord;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
100 const [xMin, xMax] = xRange;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
101 const xSpan = xMax - xMin;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
102 const [yMin, yMax] = yRange;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
103 const ySpan = yMax - yMin;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
104 const [xSize, ySize] = size;
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
105 return [
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
106 (x - xMin) / xSpan * xSize,
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
107 (yMax- y) / ySpan * ySize,
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
108 ]
9e6289598d8c Add script to draw charts with initial functions.
Paul Fisher <paul@pfish.zone>
parents:
diff changeset
109 }