3

我想启用“noData”功能，默认情况下，当图表中没有数据显示时会显示一条消息。它在他们的文档中说该功能需要no-data-to-display.js在页面中加载文件。

我的 node_modules/highcharts 文件夹中已经有了这个文件，但我不确定我应该如何从那里加载它，所以我也想知道如何做到这一点。现在，我已经通过将此脚本标签添加到我的index.html：

<script src="http://code.highcharts.com/modules/no-data-to-display.js"></script>

它给了我以下错误：

Uncaught ReferenceError: Highcharts is not defined
    at no-data-to-display.js:10
    at no-data-to-display.js:10

这是我的所有与highcharts相关的东西app.module.ts

import { ChartModule } from 'angular2-highcharts';
import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService';
import * as Highcharts from 'highcharts';

imports: [
    ChartModule,
],
providers: [{
    provide: HighchartsStatic,
    useValue: Highcharts
}]

谢谢。

编辑：

我试图将无数据文件导入我的app.module.ts：

import HighchartsNoDataToDisplay from 'highcharts/modules/no-data-to-display.src.js';

我不确定下一步是什么。将 HighchartsNoDataToDisplay 添加到导入数组会给我一个错误。

4

1 回答 1

5

我能够通过执行以下操作来完成此工作：

//wherever you're importing the highcharts library
import Highcharts from "highcharts";
import NoDataToDisplay from 'highcharts/modules/no-data-to-display';

NoDataToDisplay(Highcharts); //initialize the module

//wherever you're setting up the chartOptions array before the call
// to .chart('container', chartOptions)
    //noData
    chartOptions['lang'] = {
        noData: "No Data Available"
    };
于 2018-03-16T19:36:26.073 回答