One big gotcha:
select actually has side effects. It updates the bound data.
On the other hand,
selectAll doesn’t update data, so we see this a lot:
.data part is where it updates the data.
It gets tricker when your parent div has children, because the children divs’ bound data will not update automatically. To update the bound data on a certain child, you need to
// The side effect select has: update data d3.selectAll('.parent').data(...).select('.child');
After getting used to frameworks like React and Angular, it’s easy to forget that views don’t automatically update just because data does. For d3, at least, it doesn’t happen automatically. After dealing with the
exits and the transitions, to update the current view, don’t forget to show the existing ones some love:
$selection.select('text').text(d => d.name);