CSS 不适用于行图

标签 css angular dc.js

我试图隐藏我的行图表上的轴。就像这个问题Hide dc.js chart x-axis .但是无论我做什么,我都无法修改样式。

当我尝试使用 #your-row-chart svg g g.axis.x { 显示:无; },但它不适用于我的图表。

这是我的CSS
div.dc-chart.sampleId.scrolled-row-chart svg g g.axis { 显示:无; 不知道我的错误是什么。它工作正常,直到 div.dc-chart.sampleId.scrolled-row-chart 修改了我的行图表的样式。

下面是预期的结果。我通过在 Chrome 上手动编辑 css 来删除样式。我什至将 HTML 选择器复制到 css 以确保我指向正确的元素,但它仍然不起作用。

rowchart

最佳答案

很抱歉发布重复问题的答案。我知道这违反网站规则,但我认为它有助于人们的谷歌搜索,我正在努力克服“我找到了答案,但它对我不起作用”的 FUD。

正如其他人评论的那样,没有运行示例很难进行测试。所以我从the basic row chart example开始.

我尝试添加 CSS

.dc-chart#test svg g g.axis { display: none; }

而且效果很好。也许您的 CSS 选择器太具体了!

我也试过

chart.margins({left: 0, top: 0, right: 0, bottom: 0});

这也奏效了!

没有轴的屏幕截图,只是为了让我悲伤的重复答案更有趣:

no axis

关于CSS 不适用于行图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54701415/

相关文章:

angular - TypeScript 编译中缺少 in-memory-data.service.ts

javascript - 带时间维度的条形图

css - 如何调整轴文本 - dc.js

html - 如何将 CSS 复制到 Chrome 中的另一个选项卡?

html - 在布局中垂直扩展 div 的内容直到其容器末尾的一些 CSS 问题

SVG的PHP CSS控件

dc.js - 每天来自组的最小值

html - 如何从 <li> 中删除空格

node.js - npm 安装失败于 grpc@1.20.0 安装脚本失败

Angular 2 : how to force an injectable to be a singleton in the app