在Angular-NVD3中更改折线图区域颜色答案

【问题标题】：Change line chart area color in Angular-NVD3在Angular-NVD3中更改折线图区域颜色
【发布时间】：2015-11-17 06:40:02
【问题描述】：

我正在使用 Angular-NVD3 库来显示一些折线图，我已经看到我可以在数据中将“区域”属性设置为“真”，这样图形的区域就会被着色。

{
    values: [/** some data **/],
    key: 'Cosine Wave',
    color: '#2ca02c',
    area: true
}

但我找不到如何更改该区域的颜色。默认情况下，图表将该区域着色为线条颜色的较浅色调，但我需要它为浅灰色。

API ($scope.options) 是否允许这样的选项？有没有办法“破解”它？

【问题讨论】：

你有没有深究过这个？！？！
好吧.. 从技术上讲 d3 是 svg 而 svg 是 DOM 的一部分，我尝试使用 css 选择区域并可能以某种方式对其进行操作，但无法正确处理，但它是可能的。我认为它是功能请求的主要候选者。
@iggymoran 查看发布的解决方案

【解决方案1】：

我打开了issue in github，得到了作者的回复，他建议更改区域的css规则并提供了这个sn-p

.nvd3 .nv-group.nv-series-0 {
     fill: lightgray!important; /* color for area */
}

（0 是行索引）。

我在plunk 中对其进行了测试，它可以根据需要运行！

【讨论】：