Data Visualization-brushing and Linking

Link to the GitHub repository: https://github.com/nazanin-tabatabaei/DataViz-Brushing-Linking_P4 

This visualization utilizes multiple coordinated views using brushing and linking. Th general task in this visualization is to figure out the interactivity that allows selections in one view to highlight corresponding data points in the other view (i.e., brushing and linking).

The dataset used for this assignment consists of SAT scores. For the first scatterplot, SAT mathematics scores (SATM) are mapped to the x coordinate and the SAT verbal scores should are assigned to y coordinate. For the second scatterplot, the ACT attribute are mapped to the x coordinate and the GPA attribute should are to the y coordinate. Each scatterplot is drawn in an svg element of size 400x400px.

• When users click on a point in either scatterplot, the actual numerical values of the fields for that particular student are displayed in a separate table (details on demand). 
• When users drag the mouse on either scatterplot, a rectangular brush is drawn on that scatterplot, indicating the region of interest. All the points inside that region are considered selected and should be highlighted on the other scatterplot.
• The rectangular selection is draggable by clicking and dragging the left mouse button.
• When users click on a point (or select multiple points) in either scatterplot, the corresponding point(s) on the other scatterplot are highlighted. 
• When switching brushing between visualizations, the previous brush is cleared. For example, brushing in view 1, then brushing in view 2, the brush in view 1 should be cleared (removed).