Drawing our data in React
Next, we fill out our Line component for a flexible way to draw our data.
Drawing our data#
We already imported our
Line component from our chart library. Let's render one instance inside of our
Chart, passing it our data and scaled accessor functions.
If we inspect our webpage in the Elements panel, we can see a new
Let's see what's going on in
We have a basic element that renders a
<path> element with a class name.
data and accessor props, along with a
type string. A
Line can have a
"area" — it makes more sense to combine these two types of elements because they are more similar than they are different. There is one more prop (
interpolation), which we'll get back to later.