Fundamental Visualizations

Fundamental visualization techniques as Chiasm plugins. Inspired by:

• Graphical Perception: Theory, Experimentation, and Apllication to the Development of Graphical Methods by William S. Cleveland and Robert McGill
• Chiasm Boilerplate
• D3 Bar Chart example
• D3 Line Chart example
• D3 Pie Chart example
• D3 Scatter Plot example
• D3 Choropleth example

Goals of this example:

• Provide a starting point for developing more advanced visualization components. Directions to go from here include adding axes, labels, legends, tooltips, and brushing.

• Show how each visualization technique can be encapsulated as a standalone piece of code, with no shared dependencies between components. This is why, for example, code for margins and styling is duplicated code in many components. These things could conveivably be refactored out into common modules shared between visualization components.

For a more advanced example that adds brushing interaction to a scatter plot, check out Focus + Context Scatter Plots.

Data includes:

• barChartData.csv barChartData.json Fake data to approximate the Cleveland & McGill bar charts.
• lineChartData.json This data is from William Playfair’s famous visualization of England trade imports and exports from the 1700s. This data was extracted from this example, part of the blog post Dimple as htmlwidget.
• pieChartData.csv pieChartData.json Copied from this D3 Pie Chart example
• scatterPlotData.csv scatterPlotData.json This is a random sample of 25 entries from Fisher’s Iris Data Set.
• choroplethData.json This is a topoJSON file containing outlines for US States and demographic data. This data is published as a Shapefile as part of US Census: TIGER/Line® with Selected Demographic and Economic Data. Mapshaper was used to simplify lines and generate the topoJSON file.