Angular nvd3 LineChart上的黑色背景

Question

我正在尝试使用angular-nvd3库实现角度D3折线图。我们正在使用AngularJS 1.6与ES6。这是angular-nvd3的连接方式：

app.js

import angularnvd3 from '../node_modules/angular-nvd3/index';
export default angular.module('myApp', othermodules,..angularnvd3)
.
.

controller.js

this.linechartOptions = {
    chart: {
      type: 'lineChart',
      height: 300,
      width:500,
      x: function(d){ return d.x },
      y: function(d){ return d.y },
      useInteractiveGuideline: true,
      xAxis: {
          axisLabel: 'X Label'
      },
      yAxis: {
          axisLabel: 'Y Label',
      },
    },
    title: {
      enable: true,
      text: 'Some text',
      css: {
        'font-size' : '15px',
        'font-weight' : 'bold',
        'text-align' : 'left'
      }
    },
};

this.linechartData = [{
    values: lineChartData,
    key: 'Some Key',
    color: '#1f77b4'
}]

template.html

<nvd3 options="controller.linechartOptions" data="controller.linechartData"></nvd3>

但是，这些图形用黑色背景绘制。

我一直在指这些资源：

• http://krispo.github.io/angular-nvd3/#/quickstart
• http://plnkr.co/edit/lBKFld?p=preview

但是我不知道如何删除黑色背景和创建填充区域的线条。我只需要查看上面提到的plunker中所示的折线图。

Answer 1

只需包括nv.d3.cssfrom node_modules/nvd3/build/nv.d3.css，它将解决此问题。