我正在 nvd3.js 中制作条形图,类似于以下示例:http ://nvd3.org/ghpages/discreteBar.html 。我想知道是否有办法删除网格线,这样背景就会变成纯白色。所有示例都使用网格线。我还检查了源代码,并没有在discreteBar 模型中看到任何使这成为可能的东西。
问问题
14210 次
5 回答
25
.tick {
opacity: 0;
}
不适用于离散条形图中的垂直线,因为它们使用内联 css 将不透明度设置为 1。但这有效:
.tick {
display: none;
}
这也将隐藏轴上的标签。如果要删除行但保留标签,请使用:
.tick line {
display: none;
}
于 2013-12-13T19:35:20.040 回答
18
您可以在 CSS 中选择这些网格线并将其不透明度设置为 0:
.tick {
opacity: 0;
}
如果您仍想查看基线,可以将其修改为:
.tick:not(.zero) {
opacity: 0;
}
使用浏览器的检查器工具查看您想要修改的各个元素的类,并使用 CSS 的强大功能。
于 2013-01-22T23:41:02.777 回答
3
我找到了一个效果更好的更具体的解决方案:
(这会删除所有网格,但您可以有选择性,即:.y1.axis)
.nvd3.multiChart .axis .nv-axis line {
stroke: none;
fill: none;
}
于 2014-03-17T23:28:50.643 回答
2
摆脱准则并保持标签使用
.tick line {
opacity: 0;
}
于 2015-04-23T17:36:10.547 回答
0
只需要更新css
.tick line {
display: none;
}
于 2016-07-01T11:01:06.963 回答