Today we're looking at data joins. There are now two different ways to do a data join in d3.
This page demonstrates the "new" way to do joins.
While another page demonstrates the "old" style of join.
For this class the .join("elementName") pattern in a new style data join is often enough. You will start to use the .join(enter => {}, update => {}, exit => {} ) pattern when you have animated transitions or more involved steps in creating elements.
If you're still confused about why we use translate to make scatterplots, Mike Bostock has a handy page discussing chart margins.
Data join demo:
[ - - - - - - - - - ]
Scatterplot: