block by curran 5e3c1bed7c9cdd2b431c

Reactive Mixins for Visualizations

Full Screen

This is one example from the screencast Introduction to Chiasm. It shows how you can use “reactive mixins” to encapsulate chunks of dynamic behavior in data visualizations, and use Chiasm to put multiple visualizations on the same page.

Check out the resize behavior.

This example was the starting point for chiasm-charts, a collection of reactive mixins and reusable visualizations including bar chart, histogram, scatter plot, line chart, and box plot.

web counter

index.html

barChart.js

barChartData.csv

barChartData.json

lineChart.js

lineChartData.csv

lineChartData.json

main.js

mixins.js

package.json

scatterPlot.js

scatterPlotData.csv

scatterPlotData.json