Question

我搜索了很多关于Angular2图表包的信息但没有C3.js的名字，直到我在下面的链接中找到了一个C3.js图表的例子
ani-angular.strapui.com/dashboard/charts/c3-chart

然后我搜索了“有角度的C3图表”创建的结果是关于AngularJS项目。即使在他们的website上也没有指导如何为角度

设置此包

我确信有一种方法可以将C3图表添加到angular2 +项目中。有没有人知道你是怎么做到的？

Answer 1

stackoverflow上没有答案所以我自己回答

1-在项目根目录中运行此命令：

npm install c3
npm install @types/c3

2-将"../node_modules/c3/c3.min.css",添加到 .angular-cli.json =＆gt;风格部分

（在角度6+中添加@import "../node_modules/c3/c3.min.css";到 styles.css ）

3-将<div id="chart"></div>添加到您的组件模板

4-将import * as c3 from 'c3';添加到您的组件

5-将波纹管代码添加到您的打字稿

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

我希望它会对你有所帮助，如果有任何问题则发表评论

如何将C3图表添加到角度2+项目中

1 个答案: