如何导入highcharts-more [英] How to import highcharts-more
问题描述
我想用highcharts使用spiderweb图表,这要求我导入highcharts-more,但我无法弄清楚如何做到这一点。目前,我已经在我的项目中添加了highcharts,从 app.module.ts
:
I would like to use the spiderweb chart from highcharts, which requires me to import highcharts-more, but I cannot figure out how to do that. Currently, this is how I've added highcharts to my project, from app.module.ts
:
import { ChartModule } from 'angular2-highcharts';
import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService';
import * as Highcharts from 'highcharts/highstock';
imports: [
ChartModule
]
providers: [{
provide: HighchartsStatic,
useValue: Highcharts
}],
当我尝试像这样导入它时:
When I try to import it like this:
import * as HighchartsMore from 'highcharts/highcharts-more';
我得到以下错误:
I get the following error:
Module '"c:/pdws-view-v2/node_modules/@types/highcharts/highcharts-more"' resolves to a non-module entity and cannot be imported using this construct.
有什么想法?
Any ideas?
推荐答案
您无需使用外部模块在Angular应用程序中使用高图或任何扩展包。所有你需要做的事情 npm install --save highcharts highcharts-more
然后在你的组件中与其他进口一起包括:
You don't need to use an external module to use highcharts or any of the extension packages in your Angular app. All you need to do npm install --save highcharts highcharts-more
and then in your component along with the other imports include:
// HIGHCHARTS
import * as Highcharts from 'highcharts';
declare var require: any;
require('highcharts/highcharts-more')(Highcharts);
require('highcharts/modules/solid-gauge')(Highcharts);
require('highcharts/modules/heatmap')(Highcharts);
require('highcharts/modules/treemap')(Highcharts);
require('highcharts/modules/funnel')(Highcharts);
let chartHolder;
以及示例用法:
and example usage:
ngOnInit() {
chartHolder = Highcharts.chart('container', newOptions);
}
,您可以更新图表选项:
and you can update the chart options:
updateChart(newOptions) {
chartHolder.update(newOptions);
}
这篇关于如何导入highcharts-more的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!