Scatterplot with marginal ticks

This is among the first charts made in d3.js. And it was made long before I knew what a scatterplot with marginal ticks is.

The code for it was written ~4 years ago and I didn’t revise it, so there should be space for improvement.

Initially, the chart took input data from the table below and sent it to a remote endpoint for processing. After processing, the segmented data returned and was visualized in the chart. However, for demonstration purpose, I’ve refactored it a bit to make all the computations inplace.

The chart displays the data points’ distribution and shows which points fall above/below one standard deviation. You can also visualize the Biggest Series 1 and Biggest Series 2 data.

Below the chart there are 2 buttons. The Randomize&Update generates random variables and process them. The Update button requires you to first make some changes to the table (it is editable) and then updates the table with the newly computed coefficients.

On mouseover, the axis labels fade away, leaving you with precise labels for the point you are focused on at the moment.

Enjoy!

Dependencies: D3.js, jQuery 1.11.3, tipsy