Why are both of these lines the same color?
I think I'm losing my mind. I looked and looked and must have missed something obvious.
I would like the curved path to be blue and the straight path underlying the word to be red.
I noticed that I always set the stroke width, stroke and fill, so I made a helper method
lineColor = (color, node) ->
node
.attr 'stroke', color
.attr 'stroke-width', 2
.attr 'fill', 'none'
And draw paths like this
#curvy
lineColor 'blue', svg
.append 'path'
.attr 'd', line indentations
etc.
#underline
lineColor 'red', svg
.append 'path'
.attr 'd', usageLine usageCol
you think the first line will be blue and the second will be red, but they both come out in red (or whatever color is used last)!
I don't understand, there is no deferred execution here, and if I put the stroke command on each node outside of the function, it works.
What am I missing?
Edit: It's the same here without the helper function - everything works great.
source to share
if I put a hit command on each node outside of the function in which it runs.
I can't see this happening: http://jsbin.com/woxehetobe/2/edit
It seems to me that changing the attribute in your link to svg
changes them all, since it should contain a link to all the ones you have connected, and thus change all their attributes to blue.
If you have a second link, you can get both colors. I'm sure there is a better way to clone more "d3", but I don't have much experience with that.
Working example: http://jsbin.com/woxehetobe/3/edit
source to share
This won't allow me to add a comment, so the answer was put here: I think the problem is that you are passing the entire SVG element in your lineColor function, which sets the stroke color to the entire world, i.e. for all lines in SVG. Attach the "g" element to the SVG for each of the lines, and pass that instead of the lineColor function. This should fix your problem!
Sorry for the lack of sample code, I'm not familiar with CoffeeScript ...
source to share