Angular2 C3图表颜色很奇怪

Question

我在Angular 2上测试了不同的图表库，所以我在不同的图表库上编写了serval指令，比如D3，Flot，uvChart等。 我做了一个C3图表之后，我有一个奇怪的图从C3 this is the image

你可以看到线之间的颜色反转为黑色，当我将鼠标悬停它的提示颜色被逆转，以白色

下面是我的一些代码的一部分

c3.directive.ts：

个

import { Directive, ElementRef, Renderer, Input } from '@angular/core'; 
declare var jQuery: any; 
declare var c3: any; 

@Directive({ 
    selector: '[c3-chart]' 
}) 

export class C3ChartDirective { 
    $el: any; 
    @Input() data: any; 
    @Input() options: string; 

    constructor(el: ElementRef, renderer: Renderer) { 
    this.$el = jQuery(el.nativeElement); 
    } 

    ngOnInit(): void { 
    this.render(); 
    } 

    // c3 chart render function 
    render(): void { 
    let elementID = '#' + this.$el.attr('id'); 
    console.log(elementID); 

    let chart = c3.generate({ 
    bindto: elementID, 
    data: { 
     columns: [ 
     ['data1', 30, 200, 100, 400, 150, 250], 
     ['data2', 50, 20, 10, 40, 15, 25] 
     ] 
    } 
}); 
    } 
} 

c3.module.ts：

import { NgModule } from '@angular/core'; 
import { C3ChartDirective } from './index'; 

@NgModule({ 
    declarations: [ 
    C3ChartDirective 
    ], 
    exports: [ 
    C3ChartDirective 
    ] 
}) 

export class C3Module{ 

} 

Answer 1

很好，它已经过了几天，没有人回答我的问题。我自己解决了它。问题在于图表组件中，我必须包含styleUrls链接以对应每个图表指令的.css文件。