4 values (13%) are smaller than 20

31:T753,svg``32:[{"id":"92842f17db4f4e7727333144c57668fb7ac5b917234a26f6fd5ccac88acfcb048418057146572bee80b5b95f78170bbe0391fd62c49c62ee094b295157a008ab","href":"https://static.observableusercontent.com/files/92842f17db4f4e7727333144c57668fb7ac5b917234a26f6fd5ccac88acfcb048418057146572bee80b5b95f78170bbe0391fd62c49c62ee094b295157a008ab","name":"image.png","type":"image/png","lastModified":1590548479141.685,"size":455701},{"id":"df3fb496fec726e168e34452b9b2671063d45a1390d4120c51cfb4cb4fb5980631081167c38c9c2000320d869994d0b1ce01e4d155c94923a6eb0dd2572c449b","href":"https://static.observableusercontent.com/files/df3fb496fec726e168e34452b9b2671063d45a1390d4120c51cfb4cb4fb5980631081167c38c9c2000320d869994d0b1ce01e4d155c94923a6eb0dd2572c449b","name":"image@1.png","type":"image/png","lastModified":1590573776843.534,"size":117685}] 2f:{"title":"27 May 2020: Exploratory Histogram","cells":[{"id":0,"value":"md`# 27 May 2020: Exploratory Histogram`","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"md`After [26 May 2020: Histograms and density plots](https://observablehq.com/@didoesdigital/26-may-2020-histograms-and-density-plots?collection=@didoesdigital/journal-getting-started-with-data-viz-collection), I wanted to skip using Vega-Lite and instead use [Datawrapper](https://app.datawrapper.de/chart/create) to explore my data before visualising it using D3 (tomorrow).\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3285,"value":"md`I'm continuing to play with the data I collected about notebooks I have written so far in this collection, [Journal: Getting Started with Data Viz collection](https://observablehq.com/collection/@didoesdigital/journal-getting-started-with-data-viz-collection).`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3187,"value":"md`After pasting my data from Google Sheets into Datawrapper and selecting the \"Number of cells\" column, I can see the value distribution:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3191,"value":"image = {\n const img = await FileAttachment(\"image.png\").image();\n img.alt = \"Screenshot of Datawrapper shows value distribution with min 12, max 78, mean 32, and median 27.\";\n return img;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":3198,"value":"md`As we like to say in Australia, \"too easy\".`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3201,"value":"md`Side note: I initially forgot to include the \\`await\\` keyword for my image attachment of that screenshot so the \\`alt\\` attribute didn't apply. I had to reference my [Observable reference notebook](https://observablehq.com/@didoesdigital/observable?collection=@didoesdigital/reference) to check what I was missing.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3225,"value":"md`## Datawrapper SVG`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3228,"value":"md`I couldn't find a way to use the histogram in the next step, \"Visualize\", so I inspected the histogram element in the browser dev tools, copied the SVG element, and pasted it here:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3222,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":3236,"value":"md`To make the chart legible, I poked through a few elements to find some styles from it and hand picked them out to add here:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3232,"value":"// Comment this cell out to see the unstyled chart\nhtml``","pinned":true,"hidden":false,"mode":"ojs"},{"id":3023,"value":"md`## Asking questions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3214,"value":"md`I noticed in [What’s Going On in This Graph? | Dec. 5, 2018 by The Learning Network, The New York Times](https://www.nytimes.com/2018/11/29/learning/whats-going-on-in-this-graph-dec-5-2018.html) and similar that they suggest asking three questions:\n\n- **What do you notice?**\n- **What do you wonder?** *What are you curious about that comes from what you notice in the graphs?*\n- **What might be going on in these graphs?** *Write a catchy headline that captures the graphs’ main idea. If your headline makes a claim, tell us what you noticed that supports your claim.*\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3273,"value":"md`### What do I notice?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3253,"value":"md`Firstly, I noticed the gap. A quick glance at my spreadsheet assures me that this checks out: there were no days where I wrote between 60 and 70 cells. I guess that makes this an [edge-peaked distribution](https://www.data-to-viz.com/graph/histogram.html) with legit outliers.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3260,"value":"md`Or maybe it's not edge-peaked, as the far-right bin is not the \"peak\", because it's not the highest… Perhaps it's non-symmetric, bimodal? Does it count if the second \"peak\" is tiny, smaller even than all other bars but one? Probably not.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3263,"value":"md`I've just confirmed that the modal in \"bimodal\" in a [multimodal distribution](https://en.wikipedia.org/wiki/Multimodal_distribution) does indeed refer to the \"mode\" in the sense of the value that appears most often. According to Wikipedia, \"When the two modes are unequal the larger mode is known as the major mode and the other as the minor mode.\" I guess it's unlikely my histogram could be said to have a major and minor mode.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3269,"value":"md`Perhaps it is simply \"skewed\" with some outliers.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3276,"value":"md`What else do I notice? The highest bar shows that I most often write between 20 and 30 cells. I also write at least 10–20 cells each day. The binning of the histogram hides the actual minimum of 12, which is instead noted below the histogram.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3284,"value":"md`Hmm, I suppose this histogram breaks the rule of \"don't omit zero values\" by not showing the 0 on the X Axis.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3294,"value":"md`### What do I wonder?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3297,"value":"md`I wonder about the sample size and Y values. By looking at the histogram with no Y Axis labels, it's unclear if the far-right bin is a one-time fluke, or if I wrote 70–80 cells a few times.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3301,"value":"md`I also wonder about what happened the day I wrote so many cells. Was there something special about the material that day that required breaking it up into more cells than usual? I looked up that data point in my spreadsheet and opened the notebook to find out. I guess this is an example of \"Overview first, zoom and filter, then details-on-demand\" in action.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3306,"value":"md`Is it common to make histograms interactive to dig into values? I expect not, because a bar relates to a whole bin of data. I suppose you could choose a representative sample to link to. One example that springs to mind is the use of examples in the tooltip shown in [Interactive Charts with D3.js by Amelia Wattenberger](https://wattenberger.com/blog/d3-interactive-charts):`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3308,"value":"screenshotHistogramTooltip = {\n const img = await FileAttachment(\"image@1.png\").image();\n img.alt=\"Screenshot of histogram charting Hours Over-Estimated showing a tooltip over a bar. Example tasks appear under the tooltip heading followed by '… of 86 tasks'.\";\n return img;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":3359,"value":"md`Oh, I just noticed that the histogram *does* have basic browser tooltips using the \\`title\\` element. I rarely hover over anything long enough to discover these.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3314,"value":"md`### What might be going on in these graphs?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3319,"value":"md`I have been aiming to publish a notebook every day. I set no expectations for myself of minimum length or time required but as I noted in [Learning data viz with D3](https://medium.com/@didoesdigital/learning-data-viz-with-d3-8b54afcef74?sk=614e9d55bdefa22db2680ad3ed539811), I am sure it would feel silly to publish a single sentence. This histogram proves that simply showing up is enough to consistently write at least 12 cells a day. So, I guess my headline could be:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3355,"value":"md`> Showing up is enough`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3251,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs"},{"id":3351,"value":"html``","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}