javascript - d3 剪辑路径不适用于填充折线图

标签 javascript css d3.js clip

我有一个实线图,我正在尝试设置一个剪辑路径。现在,填充区域下降到图形边界下方并进入轴符号。

enter image description here

这是我的代码的 JS fiddle :http://jsfiddle.net/HgP6D/6/

即使将 clip-path 设置为较小的值似乎也没有任何改变:

// Add the clip path.
g.append("clipPath")
.attr("id", "rect")
.append("rect")
.attr("width", 100)
.attr("height", 100)

有人知道吗?谢谢。

最佳答案

我不知道剪辑路径,但这修复了区域,因此它不会下降到 0 以下:

var area = d3.svg.area()
    .interpolate( "monotone" )
    .x(function(d,i) { return x(i); })
    .y0(-y(0))
    .y1(function(d) { return -y(d); })

关于javascript - d3 剪辑路径不适用于填充折线图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18476265/

相关文章:

javascript - 将 D3 与 Angular JS 结合使用

javascript - 如何在没有 "Requested unknown parameter"错误的情况下动态添加行

html按钮图像适配

d3.js - 为什么 d3js exit().remove() 不起作用?

css - 2 列 100% 高度使用 HTML

javascript - 提交表单后用文本替换 html 按钮元素

JavaScript、使用 CSV 的 D3 条形图错误

javascript - 我可以将 bootstrap 折叠更改为仅在单击图标时显示/展开吗?

javascript - Bluebird Promise.any() 提前拒绝?

javascript - 在 useEffect 重新渲染后 React Page Scrolls on top