Data Visualization
Parent: Data Analysis · Published reference · snapshot 2026-09-08 · skill da-applied-and-communication/references/da-8-data-visualization.md
↓ Facts as markdownall context files
Taxonomy context: Data Analysis > Data Visualization
These notes link each claim to its source. Some citations identify archived research reports that are no longer hosted on this site. A published reference means the content is available; it does not certify independent review or accuracy.Read the editorial policy and follow the sources before relying on a claim.
Data Visualization
- Taxonomy context: Data Analysis > Data Visualization [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#data-visualization]
- Data visualization is the principled translation of data into visual form so that the human visual system - which is fast, parallel, and pattern-seeking - can extract structure that the verbal system alone cannot. Done well, a chart compresses a table of numbers into a single glance and surfaces the comparison the audience needs to make a decision. Done poorly, it distorts, distracts, or actively deceives. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#data-visualization]
- Two modes recur: exploratory visualization (analyst draws many quick charts to find something; iteration speed > polish; matplotlib, seaborn, ggplot2, altair) and explanatory visualization (analyst has found the point and needs the audience to see it; polish, narrative, accessibility > iteration speed; Tableau / Power BI dashboards, D3 / Plotly for web, publication matplotlib / ggplot2). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#data-visualization]
1. Perceptual foundation (Cleveland & McGill 1984)
- Encodings ranked by accuracy of magnitude estimation (most to least accurate): position along common scale > position along non-aligned scales > length / direction / angle > area > volume / curvature > shading / color saturation / hue. Implication: encode the focal comparison along position. Reach for area, angle, or color only when position is taken or the chart's job is pattern recognition rather than precise estimation. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#1-perceptual-foundation-cleveland-mcgill-1984]
2. Tufte's principles
- Data-ink ratio. Maximize ratio of data-ink to total ink. Erase non-data-ink and redundant data-ink within reason. Heuristic, not commandment - accessibility and clarity can override. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#2-tuftes-principles]
- Chartjunk. Unnecessary elements (3D bevels, animated gradients, decorative iconography, moiré). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#2-tuftes-principles]
- Small multiples. Grid of the same chart type repeated for each level of a categorical variable, with shared scales. Replaces stacked bars and multi-series spaghetti. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#2-tuftes-principles]
- Sparklines. Word-sized, axis-free trend lines inline with prose or next to a value. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#2-tuftes-principles]
- Graphical integrity / Lie Factor. (Visual change shown) / (actual change in data). Should be ~1. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#2-tuftes-principles]
3. Knaflic / Few — explanatory design
- Preattentive attributes. Color, size, position, orientation are processed by visual system in ~200ms, before conscious attention. Use to direct attention to the one thing the chart is about; grey out the rest. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#3-knaflic-few-explanatory-design]
- Decluttering. Remove border, gridlines, redundant tick marks. Soften axis labels. Push legend onto the line. Apply preattentive emphasis last. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#3-knaflic-few-explanatory-design]
- Action titles. Title states the finding ("Revenue declined 12% in Q3, driven by APAC"), not a description ("Quarterly Revenue"). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#3-knaflic-few-explanatory-design]
- Few's dashboard rules. Single screen, no scroll. Inverted pyramid of detail. Encode by importance. Consistent encoding across panels. Context always (target, prior period, sparkline). No gratuitous decoration. Refresh timestamp on screen. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#3-knaflic-few-explanatory-design]
- BAN tiles (Big-Ass Numbers). Large headline KPI value with small trend indicator or sparkline. Dashboard analog of an action title. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#3-knaflic-few-explanatory-design]
4. Gestalt principles
- Proximity, similarity, enclosure, closure, continuity, connection - describe how the visual system groups elements. Turn data-ink abstractions into concrete layout decisions: removing a border works (closure), small multiples scan quickly (similarity + proximity), stray red dot pops (similarity-violation). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#4-gestalt-principles]
6. Color theory
- Sequential palettes - single-hue ramp for continuous ordered data with no meaningful midpoint. Viridis (perceptually uniform, colorblind-safe), Cividis (optimized for protanopia / deuteranopia), Magma, Inferno, Plasma, ColorBrewer Blues / Greens. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
- Diverging palettes - two contrasting hues meeting at a neutral midpoint, for continuous data with a meaningful reference. ColorBrewer RdBu, BrBG, PiYG, PuOr. Midpoint must match the reference value, not dataset median. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
- Categorical palettes - distinct unordered hues for nominal categories. Hard limit ~6-8 hues. Okabe-Ito (Wong palette, colorblind-safe), ColorBrewer Set2 / Dark2, Tableau 10. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
- Never color alone. Pair with shape, pattern, direct label, or position (WCAG 1.4.1). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
- Grayscale test. Viridis and Cividis pass; jet / rainbow does not. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
- Avoid rainbow / jet. Not perceptually uniform; distorts magnitude reads. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#6-color-theory]
7. WCAG accessibility for charts
- Alt-text template: [chart type] of [what is measured] by [grouping]. [Headline finding]. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#7-wcag-accessibility-for-charts]
8. Grammar of graphics (Wilkinson 1999 / Wickham 2010 layered)
- Chart = data + aesthetic mapping (x, y, color, size, shape) + geom + stat (identity, bin, count, smooth, boxplot, density) + position adjustment (identity, dodge, stack, fill, jitter) + scales + coordinate system + faceting. The named-chart taxonomy (bar / pie / line) is a cache of common grammar configurations. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#8-grammar-of-graphics-wilkinson-1999-wickham-2010-layered]
9. Tooling map
- Python notebook / static: matplotlib (imperative foundation, max control), seaborn (statistical convenience), altair (Vega-Lite declarative), plotly express, plotnine (ggplot2 in Python), bokeh. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#9-tooling-map]
- R: ggplot2 (the layered grammar reference), lattice. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#9-tooling-map]
- JS interactive: D3 (low-level, max control), Observable Plot (high-level by D3 team), Vega-Lite (declarative JSON), Plotly.js (WebGL), Chart.js (simple), ECharts (enterprise dashboards). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#9-tooling-map]
- BI / dashboard platforms: Tableau (long-time category leader), Power BI (Microsoft ecosystem default), Looker Studio (free, Google ecosystem), Looker enterprise (semantic-modeling-first, LookML), Metabase (open source, easy for non-technical), Apache Superset (open source, enterprise, 40+ connectors), MongoDB Atlas Charts (native to Atlas, document-aware). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#9-tooling-map]
- Selection heuristic: notebook / paper → matplotlib / seaborn / ggplot2; public web → plotly / observable plot / vega-lite / D3; dashboard → BI tool; product surface → plotly / ECharts / React-charting library bound to design system. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#9-tooling-map]
10. Dashboard design — Few's at-a-glance rules
- Single screen, no scroll. Inverted pyramid of detail (BANs top, trends middle, detail bottom). Encode by importance. Consistent encoding across panels. Context always. No gratuitous decoration. Color carries meaning, not personality. Drill-down paths, not detail-everywhere. Refresh cadence visible on screen. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#10-dashboard-design-fews-at-a-glance-rules]
11. Anti-patterns
- Truncated y-axis on a bar chart - bars encode magnitude; truncating lies. (Line charts exempt when range is small relative to absolute value; state baseline.) [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- 3D charts - distort perception, add chartjunk. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Pie charts with > 3 slices - angle and area are low-accuracy encodings. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Dual y-axis charts - independent scales fabricate apparent relationships. Use small multiples, connected scatter, or index normalization instead. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Rainbow / jet colormap - not perceptually uniform. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Color as only encoding - fails for colorblind viewers. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Spaghetti line charts - small multiples or grey-out non-focal instead. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Choropleth of raw counts - dominated by population. Use rates or cartogram. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Cumulative-only line hiding rate - show daily/weekly delta alongside cumulative. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Mixing absolute and relative scales without labeling. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Stacked bars when audience must compare segments - use grouped bar or small multiples. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Bubble charts encoding diameter instead of area. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Mercator for global statistical maps - use equal-area (Robinson, Equal Earth, Mollweide). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
- Animated bar-chart races - fun to watch, terrible for comparing specific values. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#11-anti-patterns]
12. Workflow
- Write the headline finding as a one-sentence claim before touching the chart tool. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Identify audience and medium. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Pick the intent (comparison / composition / distribution / relationship / temporal / spatial). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Pick chart type (apply Cleveland & McGill; avoid pie / 3D / dual-axis unless required). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Draft and declutter (remove border, soften gridlines, push legend onto line). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Apply preattentive emphasis (grey for non-focal, color for focal, direct labels). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Write the action title (the headline claim, not a description). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Verify graphical integrity (zero baseline on bars, 100% pie sum, no 3D, no dual axis). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Accessibility pass (contrast, alt text, color-alone check, grayscale test, screen-reader description). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
- Show to someone who has not seen the data; if the headline does not land within 5 seconds, iterate. [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#12-workflow]
13. References
- Tufte 1983 Visual Display of Quantitative Information; Tufte 1990 Envisioning Information; Few 2013 Information Dashboard Design; Few 2009 Now You See It; Knaflic 2015 Storytelling with Data; Cairo 2016 The Truthful Art; Cairo 2019 How Charts Lie; Wilkinson 2005 Grammar of Graphics; Wickham 2016 ggplot2; Munzner 2014 Visualization Analysis and Design; Cleveland & McGill 1984 Graphical Perception (JASA 79); Wickham 2010 A Layered Grammar of Graphics (JCGS 19); Heer & Bostock 2010 Crowdsourcing Graphical Perception (CHI); ColorBrewer 2.0 (colorbrewer2.org); Viridis (matplotlib documentation); Cividis (Nuñez Anderton Renslow 2018 PLoS One); Wong 2011 Color blindness (Nature Methods, Okabe-Ito); W3C WCAG 2.2; Lundgard & Satyanarayan 2022 Accessible Visualization via Natural Language Descriptions (IEEE VIS). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#13-references]
- Full installed skill: ~/.claude/skills/da-8-data-visualization/SKILL.md (815 lines). [archived source: https://llms-explorer.com/sources/mdb-context-hub/da-8-data-visualization/#13-references]
Where this helps
- Choosing between a bar chart, a line chart, and a scatter plot when you need to show a comparison, a trend over time, or a correlation, respectively. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Building an executive dashboard that must be understood at a glance rather than studied. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Deciding whether a color encoding should be sequential, diverging, or categorical based on the underlying data type. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Auditing an existing chart or dashboard for accessibility (WCAG contrast) or a misleadingly truncated axis before it ships. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
Project ideas
- Build a chart-type picker checklist that maps data shape (categorical vs. continuous, time series vs. cross-section) to the right mark type, grounded in Cleveland & McGill's perceptual ranking. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Redesign an existing cluttered dashboard using Few's at-a-glance principles — remove chartjunk, group related KPIs, and cut the palette down to a validated set of colors. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Implement a grammar-of-graphics layer (e.g. Vega-Lite or a ggplot2-style library) so charts are composed from data plus mark plus encoding rather than hand-drawn per chart type. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Run an automated contrast/accessibility check against your chart color palette and swap out any pair that fails WCAG for color-vision-deficient viewers. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
Common mistakes
- Using 3D charts or heavy chartjunk (decorative gridlines, icons, shadows) that Tufte's data-ink-ratio principle would strip out because it obscures rather than clarifies. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Truncating a bar chart's y-axis to exaggerate a small difference, which misleads even when the intent wasn't deceptive. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Picking a rainbow or spectral color scale for continuous data, which has no perceptual ordering and misrepresents magnitude. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Encoding a categorical variable in area or angle (pie charts, bubble size) when position or length would let readers compare values far more accurately. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
Known issues
- Perceptually "best" encodings (position, length) aren't always practical in cramped dashboard real estate, forcing a tradeoff toward less-accurate encodings like color or area. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- A grammar-of-graphics library gives composability but has a steeper authoring curve than a templated charting tool, which slows down one-off exploratory charts. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Accessible color palettes that pass a contrast check can still be visually indistinguishable for some color-vision-deficiency types if hue alone carries the encoding without a redundant channel like pattern or label. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
- Dashboard-level "at-a-glance" design can hide the detail a power user actually needs, forcing a real tradeoff between summary and drill-down views. [source] — AI-suggested, synthesized from this pack's existing facts — not extracted from a source document.
Children
- Customer-Facing and Embedded Analytics Dashboards
- Perceptual foundation (Cleveland & McGill) (frontier)
- Tufte's principles (frontier)
- Knaflic / Few storytelling and dashboard design (frontier)
- Gestalt principles for charts (frontier)
- Chart selection by intent (frontier)
- Color theory and palettes (frontier)
- WCAG accessibility for charts (frontier)
- Grammar of graphics (Wilkinson, Wickham layered) (frontier)
- Visualization tooling map (frontier)
- Dashboard design rules (frontier)
- Visualization anti-patterns (frontier)
- Visualization workflow (frontier)
Frontier under this node: Chart selection by intent, Color theory and palettes, Dashboard design rules, Gestalt principles for charts, Grammar of graphics (Wilkinson, Wickham layered), Knaflic / Few storytelling and dashboard design, Perceptual foundation (Cleveland & McGill), Tufte's principles, Visualization anti-patterns, Visualization tooling map, Visualization workflow, WCAG accessibility for charts