Making a Basic Scatter Plot Interactive

In the last chapter, we created a static scatter plot. In this chapter, we'll make it interactive so that we can add, update, and delete runs. You'll learn how to do the following:

  • Create a click handler
  • Remove data
  • Drag an element
  • Update data after a drag
  • Create a zoom behavior that scales elements
  • Update axes when zooming/panning
  • Update click points after a transform
  • Avoid redrawing the entire screen during rendering
  • Hide elements beyond axes

The complete code for this section can be found here: https://github.com/PacktPublishing/D3.js-Quick-Start-Guide/tree/master/Chapter04.

Get D3.js Quick Start Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.