d3.js条形图内联笔画

我想实现一个堆叠条形图，其中一个条形数据集具有半透明颜色和不透明笔画。但是，笔划应该放置在内部而不是外部，这是默认行为。我不知道这可能实现的任何可能的属性或样式设置？d3.js条形图内联笔画

我定义行程与

.attr("stroke", function(d) { return zStroke(d.key); }) 
.attr("stroke-width", (function(d) { return zStrokeWidth(d.key) + "px"; }))

其中zStroke和zStrokeWidth返回杆数据系列的颜色和宽度。

来源

2017-01-23 medonja

不可能：http://stackoverflow.com/questions/7241393/can-you-control-how-an-svgs-stroke-width-is-drawn。等待SVG 2.0，在2047年发布。 –

在这种情况下，是否有可能仅缩小我需要为笔画占据几个像素的轮廓的系列的宽度？ – medonja

看看我分享的答案，它有一些选择。 –

只需更改宽度和高度，因为使用SVG时，边框位于要应用边框的条形图系列的所有边上，或者不是边框。例如。

.attr("width", function(d) { return d.withBorder ? 20 : 24; }) 
.attr("height", function(d) { return d.height + d.withBorder ? 0 : 4; })

来源

2017-01-23 11:29:40

我想过做类似的事情，并尝试了你的例子，但在我的情况下，当我通过函数而不是x.bandwidth（）返回值时，d参数只是一个由两个元素组成的数组。你应该怎么做？ – medonja

我没有看到你输入的是什么数据，所以也许两个元素的数组可以代表位置和高度，或者类似的东西。在这种情况下，最好在调用这些'attr'方法之前对数据进行'映射'，并将每个数组放入一个对象中，并且该对象还应该具有如'withBorder'为我的例子工作。如果两个元素的数组表示两个堆积的值，那么数据需要首先拆分，或者您可以使用'selection.filter'，但很难告诉您在没有看到代码和数据的情况下所拥有的。顺便说一句。如果d是一个数组，d.key如何工作？ –

d3.js条形图内联笔画

回答

相关问题