我正在尝试使用d3.js开发一个sunburst图,但是想要删除弧之间的填充。我不想将它们合并为一个项目,因为我需要能够深入到它们中,而我希望从它们的兄弟弧中获得不可见的分隔符。我修改了Mike开发的原始图像,你可以在下面找到它。
在图的右半部分,我已经摆脱了填充,因为我想要编程,左边的一半你仍然可以看到我正在谈论的填充。
我复制了Mike Bostocks的代码,但无法找到有关填充的任何内容。有没有办法通过增加固定量的弧的大小来做到这一点?
由于
答案 0 :(得分:1)
通过在d3中进行默认设置,每个圆弧之间都有一个狭窄的填充区,这似乎是水平线错误和垂直线错误。您可以通过将圆弧的每个 sweep-flag 值设置为来修复垂直线错误通过编辑脚本<script src="http://d3js.org/d3.v3.min.js"></script>
arc: function (t, n, e, r, i, o) {
t = +t, n = +n;
var u = (e = +e) * Math.cos(r),
a = e * Math.sin(r),
c = t + u,
s = n + a,
f = 0,
l = o ? r - i : i - r;
if (e < 0) throw new Error("negative radius: " + e);
null === this._x1 ? this._ += "M" + c + "," + s : (Math.abs(this._x1 - c) > 1e-6 || Math.abs(this._y1 - s) > 1e-6) && (this._ += "L" + c + "," + s), e && (l < 0 && (l = l % mh + mh), l > xh ? this._ += "A" + e + "," + e + ",0,1," + f + "," + (t - u) + "," + (n - a) + "A" + e + "," + e + ",0,1," + f + "," + (this._x1 = c) + "," + (this._y1 = s) : l > 1e-6 && (this._ += "A" + e + "," + e + ",0," + +(l >= yh) + "," + f + "," + (this._x1 = t + e * Math.cos(i)) + "," + (this._y1 = n + e * Math.sin(i))))
}