Hey everyone! I'm currently working with SVG lines and have come across an example object that looks like this:
{
_id: 5,
coordinates:{
x1: 100,
y1: 100,
x2: 500,
y2: 500,
}
Now, imagine I have an array of these objects stored in a variable called data.
My goal is to set all the relevant line attributes in just one attr() call.
I know that you can pass an object as an attribute, allowing d3 to set all attributes accordingly.
Since I have an array of objects, I decided to create a function that returns the object:
let objectsRender = svg.selectAll("line")
.data(data)
.enter()
.append("line")
.attr(function(d) { return d.coordinates;})
.attr("id", function(d){ return prefix +d._id;});
However, it seems like this approach isn't working for me since none of the x or y values are being set. Could anyone help me find a solution to this issue?