如何使用角度5的高图3d？

Question

我只是添加到app.module.ts

import { ChartModule } from 'angular-highcharts';

并导入

ChartModule

现在我想使用highchart-3d我该怎么做？我可以自定义图表，使其像morris.js圆环图吗？

Answer 1

你可以从npm包中查看add-highcharts-modules。

在主图表模块之后，@ NgModule中还可以添加任何其他模块，如highcharts-3d，highcharts-exporintg等。

...
@NgModule({
    ...
    imports: [
      BrowserModule, 
      ChartModule.forRoot(
        require('highcharts'),
+       require('highcharts/highchart-3d'),
+       require('highcharts/modules/exporting')
      ],
})

检查http://plnkr.co/edit/sz6OfccvAetQcBX8KFXy?p=preview。

如果您遇到问题，请添加实例

Answer 2

这种方法也有效：

import * as highcharts3d from 'highcharts/highcharts-3d';
export function highchartsFactory() {
    const hc = require('highcharts/highstock');
    highcharts3d(hc);
    return hc;
}

@NgModule({
imports: [
  ChartModule
],
providers: [
{
  provide: HighchartsStatic,
  useFactory: highchartsFactory //this will take care of inlcuding highcharts 3d module
}
]
});

有关更多详细信息：https://github.com/gevgeny/angular2-highcharts/issues/193

Answer 3

试试这个：

import highcharts3D from 'highcharts/highcharts-3d.src';
highcharts3D(Highcharts);

Refer