so although the user story doesn’t specify it, I attempted to replicate the example by labeling each data point with biker names.
I’ve tried to do something like this
svg.selectAll(“circle”).data(data).enter().append(“circle”)
.attr(“class”, “dot”)
.attr(“cx”, function(d) { return x(d.x); })
.attr(“cy”, function(d) { return y(d.y); })
.attr(“r”, 5);
svg.selectAll(“text”).data(data).enter().append(“text”)
.attr(“x”, function(d) { return x(d.x)+5; })
attr(“y”, function(d) { return y(d.y); })
text(function(d) { return y(d.y); });
but strangely half the names disappeared.
After a little bit of searching, I found that the solution is to use a different identifier with selectAll, like “.txt”, but I don’t understand why half the elements disappeared, or why just adding a period in front of text would solve the problem.
Can anyone explain to me what happened?
Is there a way you could post the non-working version of this on CodePen and share it? In this snippet, I can see a couple of syntax errors, but I don’t think that would cause your problem.
I would need to know how you were implementing the identifier text to be able to tell you what happened.
Instead of .selectAll(“text”), I just added a period to the front of text, into selectAll(".text"), and that solved the problem.
There were no preexisting text elements before the call.
If I didn’t answer your question, then I want to say I probably didn’t know what you meant. I just did it the same way I created the data points, just instead of circles, I added text, but for some reason only 18 names appeared
What’s really interesting is that it’s not the .text that fixes it. It’s actually anything other than text. I just tried d3.selectAll('poop') and it worked. Honestly, I have no idea why this is happening. Very strange.
edit: Also, appending a 'g' for the text fixes it.
It bothers me that I don’t know why it’s happening. It’s pretty much the exact same code, yet one doesn’t work the same as the other