Transformation Methods

Now we have a good understanding of how to make selections. After making a selection, we will need to make changes to the selection. This is where transformation methods come into play.

What are transformation methods?

On the D3 selection documentation page, there is a section called Modifying Elements. You can find that here. This is what D3 has to say about its modification methods:

After selecting elements, use the selection’s transformation methods to affect document content.

In layman’s terms, transformation methods are a way to modify a selection. The phrase transformation method is fancy terminology for functions that modify an element’s properties. They are functions that are available after making a selection. We can use them to add attributes, change the inner content, or add styles. Actually, we have already used one transformation method. In this part of the documentation, you will come across the append() method.

The append() method allowed us to insert a new element into the selection. It transformed the selection into a new one. Hence why they are called a transformation method. There is one important point to understand about transformation methods. They will always return a new selection. The new selection will be the previous selection, but with the changes the function made to it.

Let’s explore some of the other transformation methods at our disposal.

Attributes