🌍 Public
Viewing a saved revision (read-only)
e1e1fb7127a748caa42c548e1c88ae72
D3 Course 11: Scatter Plot with Menus
This interactive scatter plot lets users explore the relationship between any two numeric columns from the auto-mpg dataset by selecting axes from dropdown menus. The visualization demonstrates a unidirectional data flow pattern, where menu selections trigger re-renders of the entire chart. Built with D3 v5, it uses scaleLinear, axisBottom, axisLeft, and transition methods to animate circles from the center to their positions. The General Update Pattern is applied through enter/merge selections, and the subtle animations use staggered delays for a cascading effect.
AI-generated descriptionData Visualization with D3 course; Cars Scatter Plot
<h3>Creating a Scatter Plot wih menus</h3> <table> <th align="left">Topics</th> <tr> <td> <ul> <li><b>Creating a dropdown menu component</b></li> <li><b>Adopting Unidirectional Data Flow</b></li> <li><b>Creating a Scatter Plot component</b></li> <ul><li><b>General Update Pattern refactoring</b></li></ul> <li><b>Fancy animated transitions</b></li> </ul> </td> </tr> </table>