我在 D3 中得到了一个饼图,并用笔画分隔了每个切片。但是,我想仅向切片的外部区域添加边框,而不是在连续线上添加边框,而是尊重原始切片中的笔划创建的间隙。请参阅我的图片以进行澄清。关于如何做到这一点有什么想法吗?
See http://jsfiddle.net/4xk58/ http://jsfiddle.net/4xk58/
arcs.append("path")
.attr("fill", function (d, i) {
return color(i);
})
.attr("d", arc).style('stroke', 'white')
.style('stroke-width', 5);
我通过添加两个额外的拱形组来解决这个问题,总共三个。
第一个是普通的馅饼,没有笔画
arcs.append("path")
.attr("fill", function (d, i) {
return color(i);
}).attr("d", arc);
第二个是我想首先添加的边框。它只是围绕我们原来的拱门的一组拱门,但颜色不同。还没有中风。
最后,第三个架构将是真正绘制我想要的笔画的架构
//Draw phantom arc paths
phantomArcs.append("path")
.attr("fill", 'white')
.attr("fill-opacity", 0.1)
.attr("d", arcPhantom).style('stroke', 'white')
.style('stroke-width', 5);
这样就弥补了效果,参见http://jsfiddle.net/odiseo/4xk58/4/ http://jsfiddle.net/odiseo/4xk58/4/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)