我觉得我在这里疯了。我一直在凝视和凝视,必须遗漏一些明显的东西。
我希望弯曲的路径是蓝色的,并且这个词下面的直线路径是红色的。
我注意到我总是设置笔画宽度,笔画和填充,所以我做了一个辅助方法
lineColor = (color, node) ->
node
.attr 'stroke', color
.attr 'stroke-width', 2
.attr 'fill', 'none'
并绘制这样的路径
#curvy
lineColor 'blue', svg
.append 'path'
.attr 'd', line indentations
并且喜欢这个
#underline
lineColor 'red', svg
.append 'path'
.attr 'd', usageLine usageCol
你会认为第一行是蓝色,第二行是红色,但它们都是红色(或者最后使用的颜色)!
我没有得到它,这里没有延迟执行,如果我将执行命令放在函数外的每个节点上,它就可以工作。
我错过了什么?
修改: Here's the same thing without the helper function - everything's working great.
答案 0 :(得分:3)
如果我将stroke命令放在它运行的函数之外的每个节点上。
我没有看到这种情况:http://jsbin.com/woxehetobe/2/edit
对我来说,改变对svg
的引用的属性会改变它们是有道理的,因为它必须保留你所附加的所有属性的引用,从而将它们的所有属性更改为蓝色。
如果你有第二个参考,你可以得到两种不同的颜色。我确信有更好的方法可以克隆更多的“d3”,但我没有太多经验。
答案 1 :(得分:0)
它不会让我添加注释所以这里是一个尝试的答案:我认为问题是你传入lineColor函数中的整个SVG元素,该函数全局设置笔触颜色,即SVG上的所有行。在每个行的SVG上附加一个“g”元素,然后将其传递给lineColor函数。这应该可以解决你的问题!
很抱歉缺少代码示例,我不熟悉CoffeeScript ......