Angular2 C3图表颜色很奇怪
问题描述:
我在Angular 2上测试了不同的图表库,所以我在不同的图表库上编写了serval指令,比如D3,Flot,uvChart等。 我做了一个C3图表之后,我有一个奇怪的图从C3 this is the imageAngular2 C3图表颜色很奇怪
你可以看到线之间的颜色反转为黑色,当我将鼠标悬停它的提示颜色被逆转,以白色
下面是我的一些代码的一部分
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{
}
答
很好,它已经过了几天,没有人回答我的问题。我自己解决了它。问题在于图表组件中,我必须包含styleUrls链接以对应每个图表指令的.css文件。
选择你自己的答案与绿色问号正确的答案获得一定点:) – jhhoff02
得到它,感谢您的意见 –