This topic is for listing and review of Scatterplot Graph Visualization projects built as a part of FCC challenges. Please stick to these basic rules to keep the topic clean:-
Post your Codepen (or other) link to your project as a general reply to this topic.
For Codepen links use the following format to avoid embedding the pen:-
Project Link - [http://codepen.io/santakmishra/full/pgqOYq/](http://codepen.io/santakmishra/full/pgqOYq/)
Post reviews as a specific reply to the link which you are reviewing.
Iām considering adjusting both of my D3 projects to display a placeholder if the screen-size is too small and maybe automatically re-generate the chart on window resize. I imagine solutions for responsive charting exist.
Thereās also an issue with the example chart when the window size is narrow enough for the hidden div to overlay chart components. Perhaps either a different method of hiding or adding āpointer-events: none;ā to the CSS would fix it.
I have put together a rudimentary scatter plot and would like to submit it to FCC and move on. But before I do so, any feedback from fellow campers is appreciated.
I see that you are using d3 v4 not v3. I am also using v4 and have found one thing that I just can not get working. I can not get the mouseover to add a border to the circle. Every time that I try, the entire circle goes black, even if I try to set the border to some other color (like purple). I ended up just changing the color of the circle, which is what you are also doing. I was wondering if that was because you also had the same problem, or if you just liked the idea of changing the color. I would really like to be able to add a border if anyone reads this and can get it to work in v4.
Your page seems to work well and does what it is supposed to do. Iām not a fan of the white on gray when hovering over a name, however. Not enough contrast. I also find the tooltip moving with the mouse to be a bit distracting.
I am using d3 v4 not v3. I have found one thing that I just can not get working. I can not get the mouseover to add a border to the circle. Every time that I try, the entire circle goes black, even if I try to set the border to some other color (like purple). I ended up just changing the color of the circle, which works just fine. I would really like to be able to add a border if anyone reads this and can get it to work in v4.
Thanks for the feedback. As for the problem you mentioned, check my chart out again - Iāve added an outline to the circle when you mouseover, by giving the class (.mouseover) a stroke (black) and a stroke-width (2) property. The same should work for you, Iād think.
Thanks. Itās working now. I had tried changing classes to start with, but it had not worked. Iām pretty sure that my problem was that it is not a good idea to mix up jQuery objects and D3 objects and their respective CSS. Using ābackground-colorā and āborderā instead of āfillā, āstrokeā and āstroke-weightā on a D3 object just does not work well.
Yeah, I encountered a bit of that as well. I never really bothered with any of the svg or canvas stuff before getting into D3, so Iām just getting familiar with the different vocabulary they use. Itās finally starting to make a bit of sense to me, but it has been fairly tough to wrap my head around.
