2f:T4d4,chart = { const mean = Math.round(employeesWithBossesMean); return Plot.plot({ height: 200, width: width, marginRight: 50, marginTop: 35, x: { tickFormat: (d) => j.formatNumber(d / 1000, { prefix: "$", suffix: "K" }), grid: true, label: "Tài sản", type: "log", domain: [1e4, 1e10] //domain: [0, 1000_000] }, marks: [ Plot.dotX( employeesWithBosses, Plot.dodgeY("middle", { x: "salary", stroke: "stroke", fill: "fill", r: "r" }) ), Plot.ruleX([mean], { strokeDasharray: 4 }), Plot.ruleX([employeesWithBossesMedian], { stroke: "grey", strokeDasharray: 4 }), Plot.text([{ salary: Math.round(employeesWithBossesMedian) }], { x: "salary", text: (d) => `Tài sản Median\n${j.formatNumber(d.salary, { prefix: "$" })}`, dy: -65, fill: "grey", stroke: "white" }), Plot.text([{ salary: mean }], { x: "salary", text: (d) => `Tài sản Mean\n${j.formatNumber(d.salary, { prefix: "$" })}`, dy: -85, fill: "black", stroke: "white" }) ] }); }30:T4e4,txt1 = radios == "Cụ Thương" ? md`With the ${highlight("Tài sản cụ Thương", "orange")}, ${highlight( "Tài sản cụ Giang", "red" )}, ${highlight("Tài sản cụ Linh", "green")}, and ${highlight( "Tài sản cụ Tuấn", "blue" )}, the mean wealth is **${j.formatNumber(employeesWithBossesMean, { round: true, prefix: "$" })}**. Without them, it's **${j.formatNumber(employeesMean, { round: true, prefix: "$" })}**, which is a **${j.formatNumber( Math.round(employeesWithBossesMean) - Math.round(employeesMean), { prefix: "$" } )}** difference.` : md`With the ${highlight("Tài sản Vượng Vin", "black")}, ${highlight( "Tài sản cụ Giang", "red" )}, ${highlight("Tài sản cụ Linh", "green")}, and ${highlight( "Tài sản cụ Tuấn", "blue" )}, the mean wealth is **${j.formatNumber(employeesWithBossesMean, { round: true, prefix: "$" })}**. Without them, it's **${j.formatNumber(employeesMean, { round: true, prefix: "$" })}**, which is a **${j.formatNumber( Math.round(employeesWithBossesMean) - Math.round(employeesMean), { prefix: "$" } )}** difference.`31:T4f8,txt2 = radios == "Cụ Thương" ? md`With the ${highlight("Tài sản cụ Thương", "orange")}, ${highlight( "Tài sản cụ Giang", "red" )}, ${highlight("Tài sản cụ Linh", "green")}, and ${highlight( "Tài sản cụ Tuấn", "blue" )}, the median wealth is **${j.formatNumber(employeesWithBossesMedian, { round: true, prefix: "$" })}**. Without them, it's **${j.formatNumber(employeesMedian, { round: true, prefix: "$" })}**, which is a **${j.formatNumber( Math.round(employeesWithBossesMedian) - Math.round(employeesMedian), { prefix: "$" } )}** difference.` : md`With the ${highlight("Tài sản Vượng Vin", "black")}, ${highlight( "Tài sản cụ Giang", "red" )}, ${highlight("Tài sản cụ Linh", "green")}, and ${highlight( "Tài sản cụ Tuấn", "blue" )}, the median wealth is **${j.formatNumber(employeesWithBossesMedian, { round: true, prefix: "$" })}**. Without them, it's **${j.formatNumber(employeesMedian, { round: true, prefix: "$" })}**, which is a **${j.formatNumber( Math.round(employeesWithBossesMedian) - Math.round(employeesMedian), { prefix: "$" } )}** difference.`32:T4a2,{ const width = 400; const domain = d3.extent(geojsonfsa.features, (d) => d.properties.values); const canadaMap = Plot.plot({ width, projection: { type: "conic-conformal", rotate: [100, -60], domain: geojsoncanada }, color: { type: colorScale, n: 5, scheme: "blues", legend: true, width: width - 75, label: "Average income per FSA (2021 Census)", tickFormat: (d) => j.formatNumber(d, { round: true, prefix: "$" }) }, marks: [ Plot.geo(rewind(geojsonfsa), { fill: (d) => d.properties.value, stroke: (d) => d.properties.value }) ] }); const montrealMap = Plot.plot({ width, projection: { type: "mercator", domain: rewind(montrealcma) }, color: { type: colorScale, n: 10, scheme: "blues" }, marks: [ Plot.geo(rewind(geojsonfsa), { fill: (d) => d.properties.value, stroke: (d) => d.properties.value }) ] }); return htl.html`

Canada

${canadaMap}

Montreal metropolitan area

${montrealMap}

`; }33:T646,{ const minRaw = d3.min(torontoTemp, (d) => d.t); const maxRaw = d3.max(torontoTemp, (d) => d.t); const scaleMin = d3.scaleLinear([1, maxDaysRollingAverage], [minRaw, 7.85]); const scaleMax = d3.scaleLinear([1, maxDaysRollingAverage], [maxRaw, 9.85]); const minValue = scaleMin(k); const maxValue = scaleMax(k); let maxDate = new Date("2021-12-31"); let minDate; if (anchorRollingAverage === "end") { minDate = new Date(new Date("1900-01-01").getTime() + (k - 1) * 86_400_000); maxDate = new Date("2021-12-31"); } else if (anchorRollingAverage === "middle") { minDate = new Date( new Date("1900-01-01").getTime() + ((k - 1) * 86_400_000) / 2 ); maxDate = new Date( new Date("2021-12-31").getTime() - ((k - 1) * 86_400_000) / 2 ); } else if (anchorRollingAverage === "start") { minDate = new Date("1900-01-01"); maxDate = new Date(new Date("2021-12-31").getTime() - (k - 1) * 86_400_000); } return Plot.plot({ y: { domain: [minValue, maxValue] }, x: { domain: [minDate, maxDate] }, color: { scheme: "BuRd" }, marks: [ Plot.dot(torontoTemp, { x: "time", y: "t", fill: "t", opacity: 1, r: 1, filter: (d) => d.t >= minValue && d.t <= maxValue && d.time >= minDate && d.time <= maxDate }), Plot.line( torontoTemp, Plot.windowY( { k, strict: true, anchor: anchorRollingAverage }, { x: "time", y: "t", stroke: "grey" } ) ) ] }); }34:T40d,{ if (yVariable === "Coffee sales") { return md`The correlation between the **coffee sales** and the **temperature** is **${salesCorrelation.toFixed( 2 )}**. This is close to 0, meaning the two variables **are not related**. People don't buy more or less coffee depending on the temperature. They buy coffee all the time!`; } else if (yVariable === "Hot soup sales") { return md`The correlation between the **hot soup sales** and the **temperature** is **${salesCorrelation.toFixed( 2 )}**. This is close to -1, meaning the two variables **are related**. When one is going down (the temperature), the other is likely to go up (the hot soup sales).`; } else if (yVariable === "Ice cream sales") { return md`The correlation between the **ice cream sales** and the **temperature** is **${salesCorrelation.toFixed( 2 )}**. This is close to 1, meaning the two variables **are related**. When one is going up (the temperature), the other is likely to go up as well (the ice cream sales).`; } }35:T527,{ const lineData = shopSalesLR .map((d) => { return { x: d["Temperature"], y: d["Temperature"] * salesLR.m + salesLR.b }; }) .filter((d) => d.y > 0) .sort((a, b) => (a.x > b.x ? 1 : -1)); const chart = Plot.plot({ insetLeft: 10, insetBottom: 10, x: { domain: d3.extent(shopSalesLR, (d) => d["Temperature"]), tickFormat: (d) => `${d} C` }, y: { domain: [0, d3.max(shopSalesLR, (d) => d[yVariableLR])] }, marks: [ Plot.dot(shopSalesLR, { x: "Temperature", y: yVariableLR, fill: "Temperature", opacity: 0.5 }), Plot.line(lineData, { x: "x", y: "y", stroke: "black", strokeDasharray: 4 }) ] }); return htl.html`

y = ${salesLR.m.toFixed( 3 )}*x + ${salesLR.b.toFixed(3)}

y = 0 when x = ${startLR.toFixed( 3 )}

r2 = ${rSquared.toFixed( 4 )}

${chart}

`; }36:T463,{ if (yVariableLR === "Coffee sales") { return md`The **r-squared value** of the **coffee sales** over the **temperature** is **${rSquared.toFixed( 4 )}**. This is close to 0, meaning there is **no linear trend**.`; } else if (yVariableLR === "Hot soup sales") { return md`The **r-squared value** of the **hot soup sales** over the **temperature** is **${rSquared.toFixed( 2 )}**. This is close to 1, meaning there is ** a linear trend**. On average, **${Math.round( -salesLR.m )} more soup** is sold each time it gets **1 C colder**. This trend is visible when the temperature is **below ${Math.round( startLR )} C**.`; } else if (yVariableLR === "Ice cream sales") { return md`The **r-squared value** of the **ice cream sales** over the **temperature** is **${rSquared.toFixed( 2 )}**. This is close to 1, meaning there is ** a linear trend**. On average, **${Math.round( salesLR.m )} more ice creams** are sold each time it gets **1 C warmer**. This trend is visible when the temperature is above ${Math.round( startLR )} C.`; } }37:T521,The z-score is a number associated with each value, telling us how far the value is from the mean. The z-score unit is the [standard deviation](https://en.wikipedia.org/wiki/Standard_deviation), also known as sigma (σ). The z-score is interesting because we know that for random values following a [normal distribution](https://en.wikipedia.org/wiki/Normal_distribution): - 68.27% of values should be within one σ - 95.45% of values should be within two σ - 99.73% of values should be within three σ - 99.9937% of values should be within four σ - 99.9999998% of values should be within five σ So we can use the z-score to determine if a value is exceptional because values with: - one σ or more have one chance in 3 to happen - two σ or more have one chance in 22 to happen - three σ or more have one chance in 370 to happen - four σ or more have one chance in 15,787 to happen - five σ or more have one chance in 1,744,278 to happen Of course, this is true only if we can assume that our values have a normal distribution, easily identifiable as a [bell shape](https://en.wikipedia.org/wiki/Bell-shaped_function). In our case, we can assume that the temperatures for a given month in Vancouver are normally distributed. Update the inputs below and see which data points are considered exceptional.38:T544,{ const maxTemp = d3.max(zScores, (d) => d[variableZ]); const minTemp = d3.min(zScores, (d) => d[variableZ]); const rules = [ { x: meanZ, text: `0 σ` }, { x: meanZ + stdDevZ, text: "1 σ" }, { x: meanZ + stdDevZ * 2, text: "2 σ" }, { x: meanZ + stdDevZ * 3, text: "3 σ" }, { x: meanZ + stdDevZ * 4, text: "4 σ" }, { x: meanZ + stdDevZ * 5, text: "5 σ" }, { x: meanZ - stdDevZ, text: "-1 σ" }, { x: meanZ - stdDevZ * 2, text: "-2 σ" }, { x: meanZ - stdDevZ * 3, text: "-3 σ" }, { x: meanZ - stdDevZ * 4, text: "-4 σ" }, { x: meanZ - stdDevZ * 5, text: "-5 σ" } ].filter((d) => d.x >= minTemp && d.x <= maxTemp); return Plot.plot({ height: 425, marginTop: 20, x: { tickFormat: (d) => `${d} C` }, marks: [ Plot.dotX( zScores, Plot.dodgeY({ x: variableZ, r: 1.2, fill: (d) => { if (d.zScore >= sigmaZ) { return "red"; } else if (d.zScore <= -sigmaZ) { return "blue"; } else { return "lightGrey"; } } }) ), rules.map((d) => Plot.ruleX([d.x], { strokeDasharray: 4, stroke: "lightgrey" }) ), Plot.text(rules, { x: "x", text: "text", fill: "grey", dy: -200 }) ] }); }39:T721,percentageChangeChart = function (start, end) { { const data = [ { year: 2022, salary: start }, { year: 2023, salary: end } ]; const arrow = [{ x1: 2022, y1: start, x2: 2023, y2: end }]; const textCentered = [ { x: 2022, y: start / 2, text: j.formatNumber(start, { prefix: "$", round: true }) }, { x: 2023, y: end / 2, text: j.formatNumber(end, { prefix: "$", round: true }) } ]; const textUp = [ { x: 2023, y: end, text: `Difference: ${j.formatNumber(end - start, { round: true, prefix: "$" })}\nPercentage change: ${j.formatNumber( ((end - start) / start) * 100, { round: true, sign: true, suffix: "%" } )}` } ]; return Plot.plot({ marginLeft: 60, marginTop: 50, height: 200, y: { tickFormat: (d) => j.formatNumber(d, { prefix: "$" }), grid: true }, x: { tickFormat: (d) => String(d) }, marks: [ Plot.barY(data, { x: "year", y: "salary", fill: "orange" }), Plot.arrow(arrow, { x1: "x1", y1: "y1", x2: "x2", y2: "y2", stroke: "grey", bend: true }), Plot.text(textUp, { x: "x", y: "y", text: "text", dy: -30, fill: "black", stroke: "white", fontSize: 12, textAnchor: "middle" }), Plot.text(textCentered, { x: "x", y: "y", text: "text", fill: "black", stroke: "white", fontSize: 12, textAnchor: "middle" }) ] }); } }3a:[{"id":"737a6def603dc630f917da4eb5e8a191ac753e968d9887e180ca3d3d01fdacd8efd3435f67685f8ccdd05ba67dfe67cb2c6c4e242d466408e30ade0c8d22e8d7","href":"https://static.observableusercontent.com/files/737a6def603dc630f917da4eb5e8a191ac753e968d9887e180ca3d3d01fdacd8efd3435f67685f8ccdd05ba67dfe67cb2c6c4e242d466408e30ade0c8d22e8d7","name":"vancouver@5.csv","type":"text/csv","lastModified":1699019734913.979,"size":923905},{"id":"f884a3e74b7de420eda3787928b8d8d928047257cee798baa6d27bf87c7d740d518ecdc49da28ff301d7cd43100c66c33adb556f91dc83829c13711e16c20305","href":"https://static.observableusercontent.com/files/f884a3e74b7de420eda3787928b8d8d928047257cee798baa6d27bf87c7d740d518ecdc49da28ff301d7cd43100c66c33adb556f91dc83829c13711e16c20305","name":"torontoTemp.csv","type":"text/csv","lastModified":1699019734913.979,"size":1092001},{"id":"08d1ceaa15fa31dac4a466fe16aac1ee66b4e5c5d2df107c589749156a61dc12e8f1a808041f2aef35faf8bf9e088efccc321e18e901f9bbdd5d714fc9890fab","href":"https://static.observableusercontent.com/files/08d1ceaa15fa31dac4a466fe16aac1ee66b4e5c5d2df107c589749156a61dc12e8f1a808041f2aef35faf8bf9e088efccc321e18e901f9bbdd5d714fc9890fab","name":"fsa2021.csv","type":"text/csv","lastModified":1699019734913.979,"size":108562},{"id":"da06f02733c6315e899d229e354c3442c43fcb94b2cd280d413e271138aff26dc5ba739ebe17d8b9bf70bfbc71c1c6cab63a364bd4912a812f97191cdd50a3c5","href":"https://static.observableusercontent.com/files/da06f02733c6315e899d229e354c3442c43fcb94b2cd280d413e271138aff26dc5ba739ebe17d8b9bf70bfbc71c1c6cab63a364bd4912a812f97191cdd50a3c5","name":"geojsonFSA.json","type":"application/json","lastModified":1699019734913.979,"size":4441792},{"id":"1d1867a24d119b4d26e5a6f08eeddcb121e1a32fe854aa5820a2889cff5092371d6f2701923d9697248e65f7eec13ef510f1a83bc966f7ff0ab0281dd66eba52","href":"https://static.observableusercontent.com/files/1d1867a24d119b4d26e5a6f08eeddcb121e1a32fe854aa5820a2889cff5092371d6f2701923d9697248e65f7eec13ef510f1a83bc966f7ff0ab0281dd66eba52","name":"geojsonCanada.json","type":"application/json","lastModified":1699019734913.979,"size":394930},{"id":"91fdef74a6d2be7b1cbd066d89e9e4c4ec8e487bd57e25ae04f72c4f9465360d2b1c91b5fcbdd3175450c37c50b571446b42b2912f50c6d52940d584f5395cb0","href":"https://static.observableusercontent.com/files/91fdef74a6d2be7b1cbd066d89e9e4c4ec8e487bd57e25ae04f72c4f9465360d2b1c91b5fcbdd3175450c37c50b571446b42b2912f50c6d52940d584f5395cb0","name":"montrealCMA@1.json","type":"application/json","lastModified":1699019734913.979,"size":314747},{"id":"5a440b34a9abcfa937254c1945a1b2312228b9ea5f643d8606a3a1c33bf8028acbcb4907f9d79dbf6ab68b864d9dd4b2b9ab6e6d07d44822e49c67997d19351b","href":"https://static.observableusercontent.com/files/5a440b34a9abcfa937254c1945a1b2312228b9ea5f643d8606a3a1c33bf8028acbcb4907f9d79dbf6ab68b864d9dd4b2b9ab6e6d07d44822e49c67997d19351b","name":"spurious-correlation.jpeg","type":"image/jpeg","lastModified":1699019734913.979,"size":102800},{"id":"520e101e8617681ceec0e7c8a41c649b6f6869aa9ee54b525b77a7b3a07304cde0c6699415e9a3ca87fa9be384778602c6632f8983fc48fa0d8f538a47a25f21","href":"https://static.observableusercontent.com/files/520e101e8617681ceec0e7c8a41c649b6f6869aa9ee54b525b77a7b3a07304cde0c6699415e9a3ca87fa9be384778602c6632f8983fc48fa0d8f538a47a25f21","name":"distribution.jpeg","type":"image/jpeg","lastModified":1699019734913.979,"size":112475}] 2d:{"title":"Math for journalists","cells":[{"id":0,"value":"# Math for journalists\n\nThis interactive notebook aims to help journalists understand math concepts often used in news stories.\n\nQuestions? Comments? Reach out: [nael.shiab@cbc.ca](mailto:nael.shiab@cbc.ca).\n\nThank you to [Arthur Charpentier](https://freakonometrics.github.io/), professor in the mathematics department of the Université du Québec à Montréal, who kindly reviewed this notebook. 🙏 ","pinned":false,"hidden":false,"mode":"md"},{"id":567,"value":"## Table of contents","pinned":false,"hidden":false,"mode":"md"},{"id":1511,"value":"- **Averages and medians**\n - [Averages](https://observablehq.com/@nshiab/math-for-journalists#cell-1118)\n - [Medians](https://observablehq.com/@nshiab/math-for-journalists#cell-1314)\n - [Which one to use?](https://observablehq.com/@nshiab/math-for-journalists#cell-1500)\n - [Quantiles](https://observablehq.com/@nshiab/math-for-journalists#cell-1523)\n - [Rolling averages](https://observablehq.com/@nshiab/math-for-journalists#cell-1636)","pinned":false,"hidden":false,"mode":"md"},{"id":1110,"value":"- **Proportions and ratios**\n - [Calculating proportions and ratios](https://observablehq.com/@nshiab/math-for-journalists#cell-748)\n - [Ratios](https://observablehq.com/@nshiab/math-for-journalists#cell-811)\n - [Different decimal bases](https://observablehq.com/@nshiab/math-for-journalists#cell-1011)\n - [Using plain language](https://observablehq.com/@nshiab/math-for-journalists#cell-1016)","pinned":false,"hidden":false,"mode":"md"},{"id":533,"value":"- **Percentage change**\n - [Calculating the percentage change](https://observablehq.com/@nshiab/math-for-journalists#cell-346)\n - [Finding the end value](https://observablehq.com/@nshiab/math-for-journalists#cell-349)\n - [Finding the start value](https://observablehq.com/@nshiab/math-for-journalists#cell-443)\n - [Per cent and percentage point](https://observablehq.com/@nshiab/math-for-journalists#cell-655)\n - [Reverting a percentage change](https://observablehq.com/@nshiab/math-for-journalists#cell-2635)\n - [Compounding](https://observablehq.com/@nshiab/math-for-journalists#cell-2871)\n - [Comparing percentage variations](https://observablehq.com/@nshiab/math-for-journalists#cell-173)\n - [Percentage change and small numbers](https://observablehq.com/@nshiab/math-for-journalists#cell-529)\n - [Big percentage change](https://observablehq.com/@nshiab/math-for-journalists#cell-722)\n ","pinned":false,"hidden":false,"mode":"md"},{"id":2380,"value":"- **Correlations and linear regressions**\n - [Correlations](https://observablehq.com/@nshiab/math-for-journalists#cell-1874)\n - [Linear regressions (trend lines)](https://observablehq.com/@nshiab/math-for-journalists#cell-2216)\n - [Which one to use?](https://observablehq.com/@nshiab/math-for-journalists#cell-2309)","pinned":false,"hidden":false,"mode":"md"},{"id":3056,"value":"- **Outliers and extreme values**\n - [Quantiles](https://observablehq.com/@nshiab/math-for-journalists#cell-3058)\n - [Interquartile range](https://observablehq.com/@nshiab/math-for-journalists#cell-2359)\n - [Z-score](https://observablehq.com/@nshiab/math-for-journalists#cell-2361)","pinned":false,"hidden":false,"mode":"md"},{"id":1115,"value":"To summarize many values into one number, we often use averages and medians.","pinned":false,"hidden":false,"mode":"md"},{"id":1118,"value":"### Averages","pinned":false,"hidden":false,"mode":"md"},{"id":1124,"value":"The average is also often called the mean. It's easy to understand, but it can be sensitive to outliers and extreme values.\n\nFor example, let's imagine a company with 50 employees. Below we've assigned a random salary between $10,000 and $100,000 to 47 of them.\n\nFor the last three (let's say the ${highlight(\"CEO\", \"red\")}, ${highlight(\"CTO\", \"green\")}, and ${highlight(\"CFO\", \"blue\")}), update their salaries using the sliders below and see the impact on the average salary.","pinned":false,"hidden":false,"mode":"md"},{"id":1112,"value":"title = md`## Means and medians`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1188,"value":"viewof ceo = Inputs.range([0, 1000_000], {\n label: \"Tài sản cụ Giang\",\n step: 1,\n value: 1000000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1267,"value":"viewof cto = Inputs.range([0, 1000_000], {\n label: \"Tài sản cụ Linh\",\n step: 1,\n value: 1000_000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1270,"value":"viewof cfo = Inputs.range([0, 1000_000], {\n label: \"Tài sản cụ Tuấn\",\n step: 1,\n value: 1000_000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":7608,"value":"viewof radios = Inputs.radio([\"Cụ Thương\", \"Vượng Vin\"], {\n label: \"Tài sản\",\n value: \"Cụ Thương\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1134,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs"},{"id":6950,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":6987,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":1379,"value":"txt3 = md`As you can see, much higher wealths of Thương/Vượng Vin, Giang, Linh, Tuấn don't impact the median. The median only changes when the four wealths move from the upper or lower 50%.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1308,"value":"When the bosses salaries are close to the rest of the pack, the average gives us a good idea of most employee's salaries. But when these three salaries are extreme outliers, the average loses its relevance.","pinned":false,"hidden":false,"mode":"md"},{"id":1334,"value":"To calculate an average, you need to:\n1. Sum up all values\n2. Divide the result of step 1 by the number of values","pinned":false,"hidden":false,"mode":"md"},{"id":1489,"value":"In Google Sheets, you can use the _AVERAGE_ function and the formula would look like _=AVERAGE(A:A)_.","pinned":false,"hidden":false,"mode":"md"},{"id":1336,"value":"The general formula is ${tex`average=\\dfrac{value1 + value2 + ...}{\nvaluesCount\n}`}.","pinned":false,"hidden":false,"mode":"md"},{"id":1975,"value":"Remember that an average of averages is not a good idea. It's always best to calculate an average from the raw non-aggregated values.\n\nFor example, let’s imagine that you drove 300 km at 100 km/h on average and then 300 km at 60 km/h on average. What was your overall average speed?\n\nThe answer… is not 80 km/h! The first half took 3 hours and the second half took 5 hours. So the right answer is 600 km / 8 hours = 75 km/h.\n","pinned":false,"hidden":false,"mode":"md"},{"id":1314,"value":"### Medians","pinned":false,"hidden":false,"mode":"md"},{"id":1355,"value":"The median is the value that splits the data in two. So 50% of the data would be lower than the median and 50% would be greater. It's not sensitive to outliers and extreme values.","pinned":false,"hidden":false,"mode":"md"},{"id":1361,"value":"Let's take our company again. Update the ${highlight(\"CEO\", \"red\")}, ${highlight(\"CTO\", \"green\")}, and ${highlight(\"CFO\", \"blue\")} salaries one more time.","pinned":false,"hidden":false,"mode":"md"},{"id":1365,"value":"viewof ceoMedian = Inputs.range([0, 500_000], {\n label: \"CEO salary\",\n step: 1,\n value: 125000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1367,"value":"viewof ctoMedian = Inputs.range([0, 500_000], {\n label: \"CTO salary\",\n step: 1,\n value: 115_000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1369,"value":"viewof cfoMedian = Inputs.range([0, 500_000], {\n label: \"CFO salary\",\n step: 1,\n value: 110_000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1375,"value":"{\n return Plot.plot({\n height: 200,\n marginRight: 50,\n marginTop: 35,\n x: {\n tickFormat: (d) => j.formatNumber(d, { prefix: \"$\" }),\n grid: true,\n domain: [0, 500_000]\n },\n marks: [\n Plot.dotX(\n employeesWithBossesMedianData,\n Plot.dodgeY(\"middle\", {\n x: \"salary\",\n stroke: \"stroke\",\n fill: \"fill\",\n r: \"r\"\n })\n ),\n Plot.ruleX([employeesWithBossesMedian], { strokeDasharray: 4 }),\n Plot.text([{ salary: Math.round(employeesWithBossesMedian) }], {\n x: \"salary\",\n text: (d) =>\n `Median salary\\n${j.formatNumber(d.salary, { prefix: \"$\" })}`,\n dy: -85,\n fill: \"black\",\n stroke: \"white\"\n })\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1386,"value":"To calculate the median, you need to:\n1. Sort your data from the lowest value to the greatest\n2. Check if the number of values is odd or even\n - If it's odd, the median is the value in the middle (so if you have five values, the third position value is the median)\n - If it's even, the median is the average of the two values in the middle (so if you have four values, the average of the values in the second and third position is the median)","pinned":false,"hidden":false,"mode":"md"},{"id":1497,"value":"In Google Sheets, you can use the _MEDIAN_ function and the formula would like _=MEDIAN(A:A)_.","pinned":false,"hidden":false,"mode":"md"},{"id":1978,"value":"Remember that a median of medians is not a good idea. It's always best to calculate a median from the raw non-aggregated values.","pinned":false,"hidden":false,"mode":"md"},{"id":1500,"value":"### Which one to use?","pinned":false,"hidden":false,"mode":"md"},{"id":1502,"value":"Compute both the average and median and compare them. If they are very different, you probably have extreme values and outliers.\n\nConsider using the median when you have extreme values and outliers. Language like _half of the company employees earn less than $50,000 per year_ could be very effective in your story.\n\nAverages are easy for audiences to understand, but may not make sense when you have outliers. \n\nLook at the data and the story to figure out which works best for you. You can also ask the experts interviewed.","pinned":false,"hidden":false,"mode":"md"},{"id":7325,"value":"And don't forget: always visualize your data when you're analyzing it. Descriptive statistics like the mean and the median _summarize_ your data, but it could hide something. For example, the datasets below all have the same averages ([source](https://twitter.com/flowingdata/status/1702725270942392744)).","pinned":false,"hidden":false,"mode":"md"},{"id":7334,"value":"distribution = FileAttachment(\"distribution.jpeg\").image({ width: 500 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1523,"value":"### Quantiles","pinned":false,"hidden":false,"mode":"md"},{"id":1526,"value":"Quantiles refer to the rank of your values after sorting them ascendingly. The quantiles go from 0 to 1. The median, for example, is the quantile 0.5.\n\nQuantiles are also known as quartiles (when used with 0.25, 0.5, 0.75), deciles (when used with 0.1, 0.2, 0.3, 0.4, etc.), and percentiles (when used with 0.01, 0.02, 0.03, 0.04, etc.).\n\nAs an example, let's imagine a company with 500 employees, with random salaries. Update the slider below to see what the quantile refers to.","pinned":false,"hidden":false,"mode":"md"},{"id":1584,"value":"viewof quantile = Inputs.range([0, 1], { label: \"Quantile\", step: 0.01 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1550,"value":"{\n return Plot.plot({\n height: 250,\n marginRight: 50,\n marginLeft: 50,\n marginTop: 30,\n x: {\n tickFormat: (d) => j.formatNumber(d, { prefix: \"$\" }),\n grid: true\n },\n marks: [\n Plot.dot(\n manyEmployees,\n Plot.dodgeY(\"middle\", {\n x: \"salary\",\n fill: (d) => (d.salary <= manyEmployeesQuantile ? \"blue\" : \"orange\")\n })\n ),\n Plot.ruleX([manyEmployeesQuantile], { strokeDasharray: 4 }),\n Plot.text([{ salary: manyEmployeesQuantile }], {\n x: \"salary\",\n text: (d) =>\n `Quantile: ${quantile}\\nSalary: ${j.formatNumber(\n manyEmployeesQuantile,\n {\n prefix: \"$\"\n }\n )}`,\n dy: -115,\n fill: \"black\",\n stroke: \"white\"\n })\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1609,"value":"A quantile of **${quantile}** means that **${highlight(`${Math.round(quantile*100)}%`, \"blue\")}** of the employees earn **${j.formatNumber(manyEmployeesQuantile, {prefix: \"$\"})} or less**. Inversely, it also means that **${highlight(`${100 - Math.round(quantile*100)}%`, \"orange\")}** earn **more than ${j.formatNumber(manyEmployeesQuantile, {prefix: \"$\"})}**.","pinned":false,"hidden":false,"mode":"md"},{"id":1981,"value":"Quantiles are great for relative comparisons. For example, you can use the first decile (quantile 0.1) and last decile (0.9) of Canadians' incomes over time. It's a way to see how the top 10% of earners in Canada compare to the bottom 10%. Are the rich getting wealthier? Are income inequalities increasing in Canada? Quantiles can help you answer these questions.\n\nYou can also use quantiles to make color scales, especially on choropleth maps. When your data has extreme values and outliers, linear color scales will emphasize these values. Quantile scales help you show the range of values in your data.\n\nUpdate the color scale for the two maps below to see the difference. The quantile scale deals pretty well with the very high average income of some metropolitan areas' neighbourhoods, while the linear scale makes most of the country look pale.","pinned":false,"hidden":false,"mode":"md"},{"id":7213,"value":"viewof colorScale = Inputs.radio([\"linear\", \"quantile\"], {\n label: \"Select a color scale\",\n value: \"linear\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":7140,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":1614,"value":"To calculate a quantile value, you need to:\n1. Sort your data from the lowest value to the greatest\n2. Multiply the number of values by the quantile (which is a value between 0 and 1)\n3. The result of step 2 is a rank in your data\n - If there is a value at this specific rank in your data, it's your quantile value.\n - Otherwise, your quantile value is the average of the values just before and after this position.","pinned":false,"hidden":false,"mode":"md"},{"id":1619,"value":"In Google Sheets, you can use the _PERCENTILE_ function and the formula would look like _=PERCENTILE(A:A, 0.5)_.","pinned":false,"hidden":false,"mode":"md"},{"id":1636,"value":"### Rolling averages","pinned":false,"hidden":false,"mode":"md"},{"id":1708,"value":"Rolling averages help simplify data that varies a lot over time.\n\nFor example, the chart below shows the daily temperature in Toronto from January 1, 1900 to December 31, 2021. The temperatures go from -27.2 C to 33.1 C. It's hard to understand what is going on.\n\nIncrease the number of days (also called the _window_) in the rolling average. The maximum value is equivalent to 30 years, the World Meteorological Organization's recommended timeframe for climate analysis.\n\nYou can also change the rolling average _anchor_:\n- _start_ means the average will include values from a given date and the window _after_ it.\n- _middle_ means the average will include values from a given date, half the window _before_ it and half the window _after_ it.\n- _end_ means the average will include values from a given date and the window _before_ it.","pinned":false,"hidden":false,"mode":"md"},{"id":1682,"value":"viewof k = Inputs.range([0, maxDaysRollingAverage], {\n label: \"Number of days in the rolling average\",\n step: 1,\n value: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":7416,"value":"viewof anchorRollingAverage = Inputs.radio([\"start\", \"middle\", \"end\"], {\n label: \"Select the anchor\",\n value: \"middle\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1640,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":1744,"value":"$${k === 1 ? `Increase the number of days in the rolling average` : `As we increase the number of days for the rolling average, we cut through the noise. In the chart, any given point on the line represents the temperature of the last **${k} days**. For example, the beginning of the line on the right (**${rollingAverageAnchorDate}**) shows the average temperature from **${rollingAverageDateStart}** to **${rollingAverageDateEnd}**`}.","pinned":false,"hidden":false,"mode":"md"},{"id":1779,"value":"To calculate a rolling average in Google Sheets, use the _AVERAGE_ function next to the first cell of your data and include in the formula the cells you want to average for this specific point in time (for example the six following cells). Then apply the formula to the cells below. The average range should shift while keeping the same number of cells. So if you averaged _A1_ to _A7_ in cell _B1_, then _A2_ to _A8_ would be averaged in B2, _A3_ to _A9_ in _B3_, etc.","pinned":false,"hidden":false,"mode":"md"},{"id":740,"value":"---\n## Proportions and ratios","pinned":false,"hidden":false,"mode":"md"},{"id":745,"value":"Proportions are useful to simplify numbers. Ratios are great for comparing numbers with context. They are calculated the same way, often with a decimal base (100 for per cent, 1,000 for per thousand, etc.).","pinned":false,"hidden":false,"mode":"md"},{"id":748,"value":"### Calculating proportions and ratios","pinned":false,"hidden":false,"mode":"md"},{"id":752,"value":"The unemployment rate is a proportion. Let's use it as an example.","pinned":false,"hidden":false,"mode":"md"},{"id":760,"value":"viewof unemployed = Inputs.range([0, 1_000_000], {\n label: \"Unemployed population\",\n value: 25000,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":766,"value":"viewof labourForce = Inputs.range([0, 1_000_000], {\n label: \"Labour force\",\n value: 1_000_000,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":772,"value":"$${unemployed > labourForce ? `The unemployed population can't be greater than the total population.`: `If there are **${j.formatNumber(unemployed)}** unemployed people in a labour force of **${j.formatNumber(labourForce)}**, the unemployment rate is ${highlight(j.formatNumber(unemployed / labourForce * 100, {round: true, suffix: \"%\"}), \"orange\")}.`}","pinned":false,"hidden":false,"mode":"md"},{"id":913,"value":"{\n if (unemployed > labourForce) {\n return \"No chart\";\n }\n const data = [\n {\n population: labourForce,\n name: \"Total population\",\n fill: \"lightgrey\"\n },\n {\n population: unemployed,\n name: \"Unemployed\",\n fill: \"orange\"\n }\n ];\n\n return Plot.plot({\n marks: [Plot.barX(data, { x1: (d) => 0, x2: \"population\", fill: \"fill\" })]\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":795,"value":"To calculate a proportion, you need to:\n1. Divide the part of a population or amount by the total population or amount\n2. Multiply the result of step 1 by a decimal base (100 for per cent, 1,000 for per thousand, etc.)","pinned":false,"hidden":false,"mode":"md"},{"id":1404,"value":"In Google Sheets, the formula would look like _=(A1 / B1) * 100_ for a proportion with a base of 100 (percentage).","pinned":false,"hidden":false,"mode":"md"},{"id":1423,"value":"The general formula is\n${tex`\nproportion = \\dfrac{part}{whole} * decimalBase\n`}.","pinned":false,"hidden":false,"mode":"md"},{"id":811,"value":"### Ratios\n\nRatios are used to make comparisons with a context.\n\nFor example, according to [Wikipedia](https://en.wikipedia.org/wiki/List_of_countries_by_beer_consumption_per_capita), the ${highlight(\"United States\", \"orange\")} beer consumption in 2019 was three times more than ${highlight(\"Germany\", \"#4E79A7\")}. It looks like the Americans are drinking more beer than the Germans.","pinned":false,"hidden":false,"mode":"md"},{"id":1070,"value":"Plot.plot({\n marginLeft: 50,\n height: 200,\n y: {\n label: \"Beer consumption in million litres\"\n },\n marks: [\n Plot.barY(\n [\n { country: \"United States\", beerConsumption: 23920, fill: \"orange\" },\n { country: \"Germany\", beerConsumption: 8160, fill: \"#4E79A7\" }\n ],\n {\n x: \"country\",\n y: \"beerConsumption\",\n fill: \"fill\"\n }\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1067,"value":"But we lack a critical context here: _there are more Americans than Germans_.\n\nThis is what ratios are for. If we divide beer consumption by the population of each country, we get the beer consumption per capita. We can use this ratio to compare beer consumption while taking into account the population difference.\n\nOn average in 2019, an ${highlight(\"American drank 73 litres\", \"orange\")} of beer and a ${highlight(\"German 99 litres\", \"#4E79A7\")}. So, all proportions kept, the Germans drank more beer than the Americans in 2019.\n\nNote that our decimal base is one here, making it an average per person. This is what _per capita_ means.","pinned":false,"hidden":false,"mode":"md"},{"id":1088,"value":"Plot.plot({\n marginLeft: 50,\n height: 200,\n y: {\n label: \"Beer consumption in litre per capita\"\n },\n marks: [\n Plot.barY(\n [\n { country: \"United States\", beerConsumption: 73, fill: \"orange\" },\n { country: \"Germany\", beerConsumption: 99, fill: \"#4E79A7\" }\n ],\n {\n x: \"country\",\n y: \"beerConsumption\",\n fill: \"fill\"\n }\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1011,"value":"### Different decimal bases","pinned":false,"hidden":false,"mode":"md"},{"id":1019,"value":"According to [Wikipedia](https://en.wikipedia.org/wiki/Electric_car_use_by_country), 117 Norwegians per 1,000 own an electric car. The base here is per thousand.\n\nBut the same ratio could be expressed with a base 100, making it a percentage: 11.7 per cent Norwegians. Or even with a base of 1,000,000: 117,000 Norwegians per million. It means the same thing.\n\nWe usually switch to _per thousand_ and greater when the percentages are below 1 but are still very meaningful.\n\nFor example, when writing about a sickness, _0.027 per cent of the population_ could be replaced by _270 people per million_.\n","pinned":false,"hidden":false,"mode":"md"},{"id":1016,"value":"### Using plain language","pinned":false,"hidden":false,"mode":"md"},{"id":1054,"value":"When writing your story, you can easily replace proportions and ratios with plain language:\n- 10% means _one out of ten_\n- 20% means _one out of five_\n- 25% means _one out of four_\n- 33% means _one out of three_\n- 50% means _half_\n- etc.","pinned":false,"hidden":false,"mode":"md"},{"id":17,"value":"---\n## Percentage change","pinned":false,"hidden":false,"mode":"md"},{"id":437,"value":"Percentage changes are widely used to express and compare changes over time.","pinned":false,"hidden":false,"mode":"md"},{"id":346,"value":"### Calculating the percentage change","pinned":false,"hidden":false,"mode":"md"},{"id":20,"value":"Let's take a salary change between 2022 and 2023 as an example.","pinned":false,"hidden":false,"mode":"md"},{"id":35,"value":"viewof salaryStart = Inputs.range([0, 100_000], {\n label: \"Salary in 2022\",\n value: 50_000,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":42,"value":"viewof salaryEnd = Inputs.range([0, 100_000], {\n label: \"Salary in 2023\",\n value: 75_000,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":57,"value":"The salary difference between 2022 and 2023 is **${j.formatNumber(salaryEnd - salaryStart, {prefix: \"$\"})}**, which can be expressed as a **${j.formatNumber((salaryEnd - salaryStart)/salaryStart * 100, {suffix: \"%\", round: true})} ${Math.round((salaryEnd - salaryStart)/salaryStart * 100) < 0 ? \"decrease\" : \"increase\"}** from 2022 to 2023.","pinned":false,"hidden":false,"mode":"md"},{"id":819,"value":"percentageChangeChart(salaryStart, salaryEnd)","pinned":false,"hidden":false,"mode":"ojs"},{"id":122,"value":"To calculate a percentage change, you need to:\n1. Subtract the start value from the end value\n2. Divide the result of step 1 by the absolute value* of the start value\n3. Multiply the result of step 2 by 100\n\n_\\* The absolute value is the distance to zero, which is always positive. For example, the absolute value of -2 is 2. And the absolute value of 2 is 2 as well._","pinned":false,"hidden":false,"mode":"md"},{"id":1458,"value":"In Google Sheets, the formula would look like _=(B1 - A1) / ABS(A1) * 100_.","pinned":false,"hidden":false,"mode":"md"},{"id":153,"value":"The general formula is ${tex`percentageChange = \\dfrac{endValue - startValue}{|startValue|} * 100`}.","pinned":false,"hidden":false,"mode":"md"},{"id":349,"value":"### Finding the end value","pinned":false,"hidden":false,"mode":"md"},{"id":434,"value":"If you have the start value and want to calculate the end value based on the percentage change, you need to:\n1. Divide the percentage change by 100\n2. Multiply the result of step 1 with the start value\n3. Add the start value to the result of step 2","pinned":false,"hidden":false,"mode":"md"},{"id":1466,"value":"In Google Sheets, the formula would look like _=C1 / 100 \\* A1 + A1_.","pinned":false,"hidden":false,"mode":"md"},{"id":378,"value":"The general formula is ${tex`endValue = \\dfrac{percentageChange}{100} * startValue + startValue`}.","pinned":false,"hidden":false,"mode":"md"},{"id":415,"value":"Here's another example with a salary increase.","pinned":false,"hidden":false,"mode":"md"},{"id":382,"value":"viewof salaryBase = Inputs.range([0, 100_000], {\n label: \"Salary\",\n step: 1,\n value: 50_000\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":388,"value":"viewof percChange = Inputs.range([-100, 100], {\n label: \"Percentage change\",\n value: 5,\n step: 0.1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":390,"value":"With a base salary of **${j.formatNumber(salaryBase, {prefix: \"$\"})}** and a **${j.formatNumber(percChange, {suffix: \"%\"})}** ${percChange < 0 ? \"decrease\" : \"increase\"}, the new salary is **${j.formatNumber(salaryBase + (percChange/100)*salaryBase, {prefix: \"$\", round: true})}**.","pinned":false,"hidden":false,"mode":"md"},{"id":875,"value":"percentageChangeChart(salaryBase, salaryBase + (percChange / 100) * salaryBase)","pinned":false,"hidden":false,"mode":"ojs"},{"id":443,"value":"### Finding the start value","pinned":false,"hidden":false,"mode":"md"},{"id":304,"value":"If you have the end value and want to calculate the start value based on the percentage change, you need to:\n1. Divide the percentage change (positive or negative) by 100\n2. Add the result of step 1 to one.\n3. Divide the end value by the result of step 2.","pinned":false,"hidden":false,"mode":"md"},{"id":1480,"value":"In Google Sheets, the formula would look like _=B1 / (1 + C1 / 100)_.","pinned":false,"hidden":false,"mode":"md"},{"id":506,"value":"The general formula is ${tex`\nstartValue = \\dfrac{endValue}{1 + (percentageChange / 100)}\n`}.","pinned":false,"hidden":false,"mode":"md"},{"id":592,"value":"Let's use the salary example one more time.","pinned":false,"hidden":false,"mode":"md"},{"id":310,"value":"viewof percVar = Inputs.range([-100, 100], {\n label: \"Salary change in percentage\",\n value: 5,\n step: 0.1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":314,"value":"viewof salaryAfterPercVar = Inputs.range([0, 100_000], {\n label: \"New salary\",\n value: 52500,\n step: 1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":331,"value":"If the new salary is **${j.formatNumber(salaryAfterPercVar, {prefix: \"$\"})}** after a **${j.formatNumber(percVar, {suffix: \"%\"})}** ${percVar < 0 ? \"decrease\" : \"increase\"}, then the previous salary was **${j.formatNumber(salaryAfterPercVar / (1 + (percVar/100)), {prefix: \"$\", round: true})}**.","pinned":false,"hidden":false,"mode":"md"},{"id":884,"value":"percentageChangeChart(\n salaryAfterPercVar / (1 + percVar / 100),\n salaryAfterPercVar\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":655,"value":"### Per cent and percentage point","pinned":false,"hidden":false,"mode":"md"},{"id":664,"value":"_Per cent_ is often confused with _percentage point_, but they mean two different things in the context of a change over time:\n- _Per cent_ refers to the percentage change\n- _Percentage points_ refers to the difference between two percentages","pinned":false,"hidden":false,"mode":"md"},{"id":681,"value":"Let's use the unemployment rate as an example.","pinned":false,"hidden":false,"mode":"md"},{"id":686,"value":"viewof unemployementStart = Inputs.range([0, 10], {\n label: \"Unemployment rate in January 2022\",\n value: 5,\n step: 0.1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":702,"value":"viewof unemployementEnd = Inputs.range([0, 10], {\n label: \"Unemployment rate in January 2023\",\n value: 7,\n step: 0.1\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":708,"value":"The unemployment rate ${unemployementEnd > unemployementStart ? \"increased\" : \"decreased\"} by **${j.formatNumber(unemployementEnd - unemployementStart, {decimals: 1})} percentage points** in 2023 compared to 2022, which is a **${j.formatNumber((unemployementEnd - unemployementStart)/unemployementStart * 100, {round: true, suffix: \"%\"})} per cent** ${unemployementEnd > unemployementStart ? \"increase\" : \"decrease\"}.","pinned":false,"hidden":false,"mode":"md"},{"id":2635,"value":"### Reverting a percentage change\n\nIf something has increased by _x per cent_, subtracting _x per cent_ won't give you the initial value, because percentage changes are relative to the base value.\n\nFor example, a **5% increase** on a **$50,000** salary results in $52,500.\n\nBut a **5% decrease** on the $52,500 salary gives you **$49,875**, not $50,000!\n\nCheck [Finding the start value](https://observablehq.com/@nshiab/math-for-journalists#cell-443) for the correct formula.","pinned":false,"hidden":false,"mode":"md"},{"id":2871,"value":"### Compounding\n\nIf a salary increases by **2% a year over five years**, it does not mean it increases by **10% overall**, because you need **to compound** the whole salary.\n\nIn year one, a salary of **$50,000** increases to $51,000.\n\nIn year two, the $51,000 salary increases to $52,020.\n\nIn year three, the $52,020 salary increases to $53,060.\n\nIn year four, the $53,060 salary increases to $54,121.\n\nIn year five, the $54,121 salary increases to **$55,203**.\n\nIf the salary had increased by **10%**, the result would have been **$55,000**. As you can see, there is a **$203 difference**.\n\nRemember that you can't add or subtract percentage changes. You always need to work with the absolute values.","pinned":false,"hidden":false,"mode":"md"},{"id":173,"value":"### Comparing percentage variations","pinned":false,"hidden":false,"mode":"md"},{"id":179,"value":"Percentage changes are helpful for comparisons. But you must be aware of both absolute and relative differences.\n\nFor example, let's say that Patricia got a **2%** raise in 2023 while John got a **5%** raise. It looks like John got a bigger salary bump.\n\nBut what if Patricia earned **$150,000** in 2022 and John **$50,000**?\n\nPatricia's salary increase would be **$3,000** while John's would be **$2,500**.\n\n**Relative** to their 2022 salary, John got a bigger salary bump. But in **absolute** terms, Patricia has the biggest increase.\n","pinned":false,"hidden":false,"mode":"md"},{"id":529,"value":"### Percentage change and small numbers","pinned":false,"hidden":false,"mode":"md"},{"id":603,"value":"Percentage changes are great for simplifying big numbers and bringing them down to a 100 base. But when working with small numbers, it's sometimes best to avoid them.\n\nFor example, if your city had two murders in 2022 and three in 2023, it might be tempting to lead with a *50% increase in murders*. It's mathematically true, but is it fair?","pinned":false,"hidden":false,"mode":"md"},{"id":722,"value":"### Big percentage change ","pinned":false,"hidden":false,"mode":"md"},{"id":727,"value":"While a huge percentage change can be striking, it's often better to say _10 times more_ instead of _a 900% increase_ in your story.\n\nAnd always remember that a _100%_ increase means it _doubled_, a _200%_ increase means it _tripled_, etc.","pinned":false,"hidden":false,"mode":"md"},{"id":1842,"value":"---\n## Correlations and linear regressions","pinned":false,"hidden":false,"mode":"md"},{"id":1844,"value":"To identify trends in your data, you can't trust charts. It's too subjective. It's best to rely on correlations and linear regressions.","pinned":false,"hidden":false,"mode":"md"},{"id":1874,"value":"### Correlations","pinned":false,"hidden":false,"mode":"md"},{"id":1877,"value":"A correlation is a number going from -1 to 1. It tells you if two variables are related.","pinned":false,"hidden":false,"mode":"md"},{"id":1883,"value":"Let's imagine a shop selling coffee, hot soup and ice cream. Let's check the correlation between the sales (_y-axis_) and the temperature (_x-axis_).","pinned":false,"hidden":false,"mode":"md"},{"id":1892,"value":"viewof yVariable = Inputs.select(\n [\"Coffee sales\", \"Ice cream sales\", \"Hot soup sales\"],\n {\n label: \"Pick a product\",\n value: \"Coffee sales\"\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1914,"value":"Plot.plot({\n insetLeft: 10,\n insetBottom: 10,\n x: {\n domain: d3.extent(shopSales, (d) => d[\"Temperature\"]),\n tickFormat: (d) => `${d} C`\n },\n y: {\n domain: [0, d3.max(shopSales, (d) => d[yVariable])]\n },\n marks: [\n Plot.dot(shopSales, {\n x: \"Temperature\",\n y: yVariable,\n fill: \"Temperature\",\n opacity: 0.5\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2159,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":2194,"value":"It's crucial to remember that **correlation does not mean causality**. Two variables might be mathematically related, but it does not mean that they explain each other.\n\nWhen using correlations, always double-check your conclusions with an expert.\n\nIn Google Sheets, you can use the _CORREL_ function and the formula would look like _=CORREL(A:A,B:B)_.","pinned":false,"hidden":false,"mode":"md"},{"id":2216,"value":"### Linear regressions (trend lines)","pinned":false,"hidden":false,"mode":"md"},{"id":2219,"value":"The result of linear regression is a function with the shape ${tex`y = a*x + b`}. In statistics, we say that the slope (_a_) and the y-intercept (_b_) predict the dependent variable (_y_) based on the independent variable (_x_). This function describes what is happening within the data for two variables and can be used to draw a trend line.\n\nLinear regressions will always allow you to draw a trend line. But is there a trend? You need to use the _r-squared value_ to answer this question. It goes from 0 to 1. A value close to 0 means there is no linear trend, and the variables are not related, while a value close to 1 means a linear trend is present and the variables are related.","pinned":false,"hidden":false,"mode":"md"},{"id":2229,"value":"Let's use our shop selling coffees, hot soups, and ice creams one more time. This time, we'll focus on days with at least one sale.","pinned":false,"hidden":false,"mode":"md"},{"id":2234,"value":"viewof yVariableLR = Inputs.select(\n [\"Coffee sales\", \"Ice cream sales\", \"Hot soup sales\"],\n {\n label: \"Pick a product\",\n value: \"Coffee sales\"\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2237,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":2315,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":3028,"value":"When using linear regressions, always double-check your conclusions with an expert. As with correlations, **a _r-squared value_ close to 1 does not mean causality**.","pinned":false,"hidden":false,"mode":"md"},{"id":2286,"value":"In Google Sheets, you can use the _LINEST_ function and the formula will look like _=LINEST(B:B,A:A)_. Note that the formula expects the _y_ values as the first parameter. This function will put the slope in the formula's cell and the y-intercept in the cell next to it.\n\nFor the _r-squared value_, you can use the _RSQ_ function. The formula must use the same values.\n\nAnother way to get these values in Google Sheets would be to insert a chart. Under the _Customize_ menu, go to _Series_. Then check _Trendline_ and pick _Use Equation_ under the _Label_ drop-down menu. Check _Show R2_ below.","pinned":false,"hidden":false,"mode":"md"},{"id":2309,"value":"### Which one to use?","pinned":false,"hidden":false,"mode":"md"},{"id":2310,"value":"Correlations and linear regressions can both verify if two variables are related. But there are a few differences.\n\nWhen calculating a correlation, testing _x_ over _y_ or _y_ over _x_ will give you the same result. Correlations are symmetrical. But it's not the case with linear regressions, so you need to decide what should be _x_ and what should be _y_.\n\nCorrelation coefficients don't have a unit. Linear regression equations use the same units as your data, which makes them interesting when you want to describe the linear trend, if any.\n\nAs a reminder, seeing a relationship between two variables does not mean they influence each other. Tyler Vigen's [spurious correlations](https://tylervigen.com/spurious-correlations) shows many examples of totally unrelated events with strong mathematical relationships.\n\nThis one is my favourite.","pinned":false,"hidden":false,"mode":"md"},{"id":7315,"value":"spuriousCorrelation = FileAttachment(\"spurious-correlation.jpeg\").image({\n width: 800\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2357,"value":"---\n## Outliers and extremes","pinned":false,"hidden":false,"mode":"md"},{"id":2402,"value":"News stories often focus on outliers and extremes. And other times you want to exclude them from your analysis. The methods below help you identify them.","pinned":false,"hidden":false,"mode":"md"},{"id":3058,"value":"### Quantiles","pinned":false,"hidden":false,"mode":"md"},{"id":3067,"value":"To identify outliers, you can use quantiles.\n\nFor example, the chart below shows the daily temperature in Vancouver from January 1, 1900, to December 31, 2021.\n\nPick a month, a variable, and a quantile threshold.","pinned":false,"hidden":false,"mode":"md"},{"id":3085,"value":"viewof monthQuantiles = Inputs.select(\n [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\"\n ],\n { label: \"Month\" }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3092,"value":"viewof variableQuantiles = Inputs.radio([\"maximum\", \"minimum\"], {\n label: \"Temperature\",\n value: \"maximum\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3129,"value":"viewof thresholdQuantiles = Inputs.range([0.01, 0.25], {\n label: \"Quantile threshold\",\n value: 0.01,\n step: 0.01\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3103,"value":"Plot.plot({\n marginTop: 50,\n height: 425,\n x: {\n tickFormat: (d) => `${d} C`\n },\n marks: [\n Plot.dotX(\n dataQuantiles,\n Plot.dodgeY({\n x: variableQuantiles,\n r: 1.2,\n fill: (d) => {\n if (d[variableQuantiles] > topQuantile) {\n return \"red\";\n } else if (d[variableQuantiles] < bottomQuantile) {\n return \"blue\";\n } else {\n return \"lightgrey\";\n }\n }\n })\n ),\n Plot.ruleX([bottomQuantile], { strokeDasharray: 4 }),\n Plot.ruleX([topQuantile], { strokeDasharray: 4 }),\n Plot.text(\n [\n {\n x: bottomQuantile,\n text: `Bottom ${(thresholdQuantiles * 100).toFixed(\n 0\n )}%\\n${bottomQuantile.toFixed(1)} C`\n },\n {\n x: topQuantile,\n text: `Top ${(thresholdQuantiles * 100).toFixed(\n 0\n )}%\\n${topQuantile.toFixed(1)} C`\n }\n ],\n { x: \"x\", text: \"text\", dy: -190 }\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3357,"value":"With a quantile of ${thresholdQuantiles}, **${`${(thresholdQuantiles*100).toFixed(0)}%`}** (${nbLowQuantiles} points) of the **${variableQuantiles}** temperatures recorded in **${monthQuantiles}** in Vancouver are below ${highlight(`${bottomQuantile.toFixed(1)} C`, \"blue\")} and **${`${(thresholdQuantiles*100).toFixed(0)}%`}** (${nbTopQuantiles} points) are above ${highlight(`${topQuantile.toFixed(1)} C`, \"red\")}.","pinned":false,"hidden":false,"mode":"md"},{"id":3892,"value":"With this method, you will always have at least one value above and one value below the thresholds.","pinned":false,"hidden":false,"mode":"md"},{"id":3070,"value":"Refer to the [quantiles section](https://observablehq.com/@nshiab/math-for-journalists#cell-1523) on how to calculate quantiles in Google Sheets and talk to experts to decide which quantile threshold to use.","pinned":false,"hidden":false,"mode":"md"},{"id":2359,"value":"### Interquartile range","pinned":false,"hidden":false,"mode":"md"},{"id":2409,"value":"To identify outliers, you can also use the interquartile range method, also based on quantiles.\n\nTo use this method, you need to:\n1. Calculate the first and third quartiles (quantiles 0.25 and 0.75)\n2. Subtract the first quartile value from the third quartile value. This is called the interquartile range (_IQR_).\n3. Multiply the interquartile range by 1.5 to get the extended interquartile range.\n4. The outliers are:\n - Any values smaller than the first quartile minus the extended interquartile range\n - Any values greater than the third quartile plus the extended interquartile range","pinned":false,"hidden":false,"mode":"md"},{"id":2419,"value":"Let's use the Vancouver temperatures again as an example. Change the month and the variable and see the chart update.","pinned":false,"hidden":false,"mode":"md"},{"id":3527,"value":"viewof monthIQR = Inputs.select(\n [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\"\n ],\n { label: \"Month\" }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3529,"value":"viewof variableIQR = Inputs.radio([\"maximum\", \"minimum\"], {\n label: \"Temperature\",\n value: \"maximum\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2389,"value":"{\n const rules = [\n { name: `Q1\\n${q1.toFixed(1)} C`, x: q1 },\n { name: `Q3\\n${q3.toFixed(1)} C`, x: q3 },\n { name: `Q1 - IQR * 1.5\\n${lowIQR.toFixed(1)} C`, x: lowIQR },\n { name: `Q3 + IQR * 1.5\\n${highIQR.toFixed(1)} C`, x: highIQR }\n ];\n\n return Plot.plot({\n marginTop: 30,\n marginLeft: 40,\n marginRight: 40,\n height: 425,\n x: {\n tickFormat: (d) => `${d} C`\n },\n marks: [\n Plot.dotX(\n dataIQR,\n Plot.dodgeY({\n x: variableIQR,\n r: 1.2,\n fill: (d) => {\n if (d[variableIQR] > highIQR) {\n return \"red\";\n } else if (d[variableIQR] < lowIQR) {\n return \"blue\";\n } else {\n return \"lightgrey\";\n }\n }\n })\n ),\n rules.map((d) => Plot.ruleX([d.x], { strokeDasharray: 4 })),\n Plot.text(rules, { x: \"x\", text: \"name\", dy: -200 })\n ]\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":3584,"value":"With the interquartile range method, **${variableIQR}** daily temperatures in **${monthIQR}** in Vancouver that are below **${highlight(lowIQR.toFixed(1) + \" C\", \"blue\")}** (${nbLowIQR} points) or above **${highlight(highIQR.toFixed(1) + \" C\", \"red\")}** (${nbHighIQR} points) are considered outliers.\n\nWith this method, you might or might not have outliers. The number of low and high outliers might not be the same. Because there is no decision to make around the high and low thresholds, this method is easier to use but less flexible.","pinned":false,"hidden":false,"mode":"md"},{"id":3898,"value":"Refer to the [quantiles section](https://observablehq.com/@nshiab/math-for-journalists#cell-1523) on how to calculate quantiles.","pinned":false,"hidden":false,"mode":"md"},{"id":2361,"value":"### Z-score","pinned":false,"hidden":false,"mode":"md"},{"id":3955,"value":"$37","pinned":false,"hidden":false,"mode":"md"},{"id":2602,"value":"viewof monthZ = Inputs.select(\n [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\"\n ],\n { label: \"Month\", value: \"March\" }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3942,"value":"viewof variableZ = Inputs.radio([\"maximum\", \"minimum\"], {\n label: \"Temperature\",\n value: \"maximum\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3977,"value":"viewof sigmaZ = Inputs.range([0, 5], {\n label: \"Sigma (σ)\",\n step: 0.1,\n value: 3\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3980,"value":"$38","pinned":false,"hidden":false,"mode":"ojs"},{"id":4012,"value":"In Vancouver in **${monthZ}**, **${variableZ}** temperatures with an absolute z-score of **more than ${sigmaZ === 1 ? \"1 sigma\": `${sigmaZ} sigmas`}** are temperatures below ${highlight(`${belowTemp.toFixed(1)} C`, \"blue\")} (${nbBelowZ} points) or above ${highlight(`${aboveTemp.toFixed(1)} C`, \"red\")} (${nbAboveZ} points).","pinned":false,"hidden":false,"mode":"md"},{"id":4444,"value":"With this method, you might or might not have extreme values. The number of low and high extremes might not be the same.","pinned":false,"hidden":false,"mode":"md"},{"id":4447,"value":"Make sure to talk to an expert to double-check that the distribution of your data is well-suited to the z-score method and on which sigma threshold to use.\n\nTo calculate the z-score in Google Sheets, you need to:\n1. Compute the mean of your values (_AVERAGE_ function)\n2. Compute the standard deviation of your values (_STDEV_ function)\n3. Subtract the mean from each value\n4. Divide the result of step 3 by the standard deviation for each value","pinned":false,"hidden":false,"mode":"md"},{"id":7031,"value":"The general formula is ${tex`\\dfrac{value - mean}{standardDeviation}`}","pinned":false,"hidden":false,"mode":"md"},{"id":5,"value":"# Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":49,"value":"j = require(\"journalism\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1948,"value":"st = import(\"simple-statistics\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":7181,"value":"import { rewind } from \"@fil/rewind\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":939,"value":"function highlight(string, color) {\n return `${string}`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":7046,"value":"### Averages and means","pinned":false,"hidden":false,"mode":"md"},{"id":1201,"value":"employees = {\n const random = d3.randomNormal();\n\n const randoms = Array.from({ length: 8 }, (d) => random());\n const scale = d3.scaleLinear(\n [d3.min(randoms), d3.max(randoms)],\n [10_000, 100_000]\n );\n const employees = randoms.map((d) => ({\n salary: scale(d),\n stroke: \"black\",\n fill: \"none\",\n r: 5\n }));\n\n return employees;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":6954,"value":"employeesMean = d3.mean(employees, d => d.salary)","pinned":false,"hidden":false,"mode":"ojs"},{"id":6958,"value":"employeesWithBosses = radios == \"Vượng Vin\"\n ? employees.concat([\n { salary: ceo, stroke: \"red\", fill: \"red\", r: 20 },\n { salary: cto, stroke: \"green\", fill: \"green\", r: 20 },\n { salary: cfo, stroke: \"blue\", fill: \"blue\", r: 20 },\n { salary: 4_400_000_000, stroke: \"black\", fill: \"black\", r: 20 }\n ])\n : employees.concat([\n { salary: ceo, stroke: \"red\", fill: \"red\", r: 20 },\n { salary: cto, stroke: \"green\", fill: \"green\", r: 20 },\n { salary: cfo, stroke: \"blue\", fill: \"blue\", r: 20 },\n { salary: 500_000, stroke: \"orange\", fill: \"orange\", r: 20 }\n ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":6961,"value":"employeesWithBossesMean = d3.mean(employeesWithBosses, (d) => d.salary)","pinned":false,"hidden":false,"mode":"ojs"},{"id":6977,"value":"employeesMedian = d3.median(employees, (d) => d.salary)","pinned":false,"hidden":false,"mode":"ojs"},{"id":6979,"value":"employeesWithBossesMedianData = radios == \"Vượng Vin\"\n ? employees.concat([\n { salary: ceo, stroke: \"red\", fill: \"red\", r: 20 },\n { salary: cto, stroke: \"green\", fill: \"green\", r: 20 },\n { salary: cfo, stroke: \"blue\", fill: \"blue\", r: 20 },\n { salary: 4_400_000_000, stroke: \"black\", fill: \"black\", r: 20 }\n ])\n : employees.concat([\n { salary: ceo, stroke: \"red\", fill: \"red\", r: 20 },\n { salary: cto, stroke: \"green\", fill: \"green\", r: 20 },\n { salary: cfo, stroke: \"blue\", fill: \"blue\", r: 20 },\n { salary: 500_000, stroke: \"orange\", fill: \"orange\", r: 20 }\n ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":6980,"value":"employeesWithBossesMedian = d3.median(\n employeesWithBossesMedianData,\n (d) => d.salary\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1547,"value":"manyEmployees = {\n const random = d3.randomNormal();\n\n const randoms = Array.from({ length: 500 }, (d) => random());\n const scale = d3.scaleLinear(\n [d3.min(randoms), d3.max(randoms)],\n [10_000, 100_000]\n );\n const employees = randoms.map((d) => ({\n salary: scale(d),\n stroke: \"black\",\n fill: \"none\"\n }));\n\n return employees;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":7056,"value":"### Quantiles","pinned":false,"hidden":false,"mode":"md"},{"id":1606,"value":"manyEmployeesQuantile = Math.round(\n d3.quantile(\n manyEmployees.map((d) => d.salary),\n quantile\n )\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":7092,"value":"fsa2021 = FileAttachment(\"fsa2021.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":7095,"value":"geojsonfsa = FileAttachment(\"geojsonFSA.json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":7100,"value":"fsa = {\n const features = geojsonfsa.features;\n for (const f of features) {\n const value = fsa2021.find(\n (d) => d.GEO_NAME === f.properties.fsa\n ).C1_COUNT_TOTAL;\n f.properties = { ...f.properties, value: parseInt(value) };\n }\n\n return {\n type: \"FeatureCollection\",\n features: features.filter((d) => typeof d.properties.value === \"number\")\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":7174,"value":"geojsoncanada = FileAttachment(\"geojsonCanada.json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":7221,"value":"montrealcma = FileAttachment(\"montrealCMA@1.json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":7058,"value":"### Rolling averages","pinned":false,"hidden":false,"mode":"md"},{"id":1664,"value":"torontoTemp = FileAttachment(\"torontoTemp.csv\")\n .csv()\n .then((d) => {\n const data = d.map((x) => ({\n time: new Date(x.time),\n t: parseFloat(x.tas)\n }));\n\n for (let i = 0; i < data.length; i++) {\n if (Number.isNaN(data[i].t)) {\n data[i].t = data[i - 1].t;\n }\n }\n\n return data.filter((x) => x.time.getFullYear() >= 1900);\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1761,"value":"rollingAverageDateStart = {\n const date =\n new Date(\"2021-12-31T00:00:00.000Z\").getTime() - (k - 1) * 86_400_000;\n const format = d3.utcFormat(\"%B %e, %Y\");\n return format(date).replace(\" \", \" \");\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":7455,"value":"rollingAverageDateEnd = \"December 31, 2021\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":7468,"value":"rollingAverageAnchorDate = {\n if (anchorRollingAverage === \"start\") {\n const date =\n new Date(\"2021-12-31T00:00:00.000Z\").getTime() - (k - 1) * 86_400_000;\n const format = d3.utcFormat(\"%B %e, %Y\");\n return format(date);\n } else if (anchorRollingAverage === \"middle\") {\n const date = new Date(\n new Date(\"2021-12-31\").getTime() - ((k - 1) * 86_400_000) / 2\n );\n const format = d3.utcFormat(\"%B %e, %Y\");\n return format(date);\n } else if (anchorRollingAverage === \"end\") {\n return \"December 31, 2021\";\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1801,"value":"maxDaysRollingAverage = 365 * 30 + 8","pinned":false,"hidden":false,"mode":"ojs"},{"id":7064,"value":"### Percentage change","pinned":false,"hidden":false,"mode":"md"},{"id":895,"value":"$39","pinned":false,"hidden":false,"mode":"ojs"},{"id":7068,"value":"### Correlations and linear regressions","pinned":false,"hidden":false,"mode":"md"},{"id":1894,"value":"shopSales = {\n const data = [];\n\n for (let i = 0; i < 500; i++) {\n const temperature = Math.min((Math.random() - 0.5) * 40 + 10, 30);\n const coffee = Math.round(Math.abs(Math.random() * 150));\n const iceCream = Math.max(\n Math.round(\n (Math.random() + 1) *\n (Math.max(0, temperature - 10) * (temperature / 10))\n ),\n 0\n );\n const soups = Math.round(\n Math.max(0, Math.random() * (-temperature + Math.random() * 8 + 8)) +\n Math.max(0, (Math.random() + 1) * -temperature)\n );\n data.push({\n Temperature: temperature,\n \"Coffee sales\": coffee,\n \"Ice cream sales\": iceCream,\n \"Hot soup sales\": soups\n });\n }\n return data;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1950,"value":"salesCorrelation = st.sampleCorrelation(\n shopSales.map((d) => d.Temperature),\n shopSales.map((d) => d[yVariable])\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2276,"value":"shopSalesLR = shopSales.filter((d) => d[yVariableLR] > 0)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2294,"value":"shopSalesArray = shopSalesLR.map((d) => [d[\"Temperature\"], d[yVariableLR]])","pinned":false,"hidden":false,"mode":"ojs"},{"id":2240,"value":"salesLR = {\n return st.linearRegression(shopSalesArray);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2290,"value":"salesLRLine = st.linearRegressionLine(salesLR)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2299,"value":"rSquared = st.rSquared(shopSalesArray, salesLRLine)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2989,"value":"startLR = -salesLR.b / salesLR.m","pinned":false,"hidden":false,"mode":"ojs"},{"id":7070,"value":"### Extremes and outliers with quantiles","pinned":false,"hidden":false,"mode":"md"},{"id":2396,"value":"vancouverTemp = FileAttachment(\"vancouver@5.csv\")\n .csv()\n .then((data) =>\n data.map((d) => {\n const time = new Date(d.time);\n const format = d3.utcFormat(\"%B\");\n return {\n time,\n month: format(time),\n maximum: parseFloat(d.maximum) + (Math.random() - 0.5),\n minimum: parseFloat(d.minimum) + (Math.random() - 0.5)\n };\n })\n )","pinned":false,"hidden":false,"mode":"ojs"},{"id":3097,"value":"dataQuantiles = vancouverTemp.filter((d) => d.month === monthQuantiles)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3122,"value":"dataQuantilesArray = dataQuantiles.map((d) => d[variableQuantiles])","pinned":false,"hidden":false,"mode":"ojs"},{"id":3119,"value":"bottomQuantile = d3.quantile(dataQuantilesArray, thresholdQuantiles)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3125,"value":"topQuantile = d3.quantile(dataQuantilesArray, 1 - thresholdQuantiles)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3552,"value":"nbLowQuantiles = dataQuantilesArray.filter((d) => d < bottomQuantile).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":3554,"value":"nbTopQuantiles = dataQuantilesArray.filter((d) => d > topQuantile).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":7072,"value":"### Extremes and outliers with interquartile range","pinned":false,"hidden":false,"mode":"md"},{"id":3531,"value":"dataIQR = vancouverTemp.filter((d) => d.month === monthIQR)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3533,"value":"dataIQRArray = dataIQR.map((d) => d[variableIQR])","pinned":false,"hidden":false,"mode":"ojs"},{"id":3536,"value":"q1 = d3.quantile(dataIQRArray, 0.25)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3538,"value":"q3 = d3.quantile(dataIQRArray, 0.75)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3541,"value":"iqrExtended = (q3 - q1) * 1.5","pinned":false,"hidden":false,"mode":"ojs"},{"id":3543,"value":"lowIQR = q1 - iqrExtended","pinned":false,"hidden":false,"mode":"ojs"},{"id":3545,"value":"highIQR = q3 + iqrExtended","pinned":false,"hidden":false,"mode":"ojs"},{"id":3565,"value":"nbLowIQR = dataIQRArray.filter((d) => d < lowIQR).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":3568,"value":"nbHighIQR = dataIQRArray.filter((d) => d > highIQR).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":7074,"value":"### Extremes and outliers with z-score","pinned":false,"hidden":false,"mode":"md"},{"id":3944,"value":"dataZ = vancouverTemp.filter((d) => d.month === monthZ)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3946,"value":"dataZArray = dataZ.map((d) => d[variableZ])","pinned":false,"hidden":false,"mode":"ojs"},{"id":3948,"value":"stdDevZ = st.standardDeviation(dataZArray)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3950,"value":"meanZ = st.mean(dataZArray)","pinned":false,"hidden":false,"mode":"ojs"},{"id":3953,"value":"zScores = dataZ.map((d) => ({\n ...d,\n zScore: st.zScore(d[variableZ], meanZ, stdDevZ)\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":4005,"value":"nbBelowZ = zScores.filter((d) => d.zScore < -sigmaZ).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":4008,"value":"nbAboveZ = zScores.filter((d) => d.zScore > sigmaZ).length","pinned":false,"hidden":false,"mode":"ojs"},{"id":4024,"value":"belowTemp = meanZ - sigmaZ * stdDevZ","pinned":false,"hidden":false,"mode":"ojs"},{"id":4031,"value":"aboveTemp = meanZ + sigmaZ * stdDevZ","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W3a","stdlib":"1","titling":"auto"}