在Angular2,4,5,6,7使用highcharts

通过 npm 安装

提示：npm 是 nodejs 包管理工具，可以方便的管理和使用 nodejs 包，如果你暂时没有用到，可以跳过本文。

提供的 Highcharts npm 包，包含了 Highcharts、Highstock、Highmaps 及所有的功能模块，通过下面的命令即可完成安装

npm install highcharts --save

加载  Highcharts

var Highcharts = require('highcharts');

// 在 Highcharts 加载之后加载功能模块
require('highcharts/modules/exporting')(Highcharts);
// 创建图表
Highcharts.chart('container', { 
      /*Highcharts 配置*/
});

加载 Highstock 或 Highmaps

Highstock 是完全包含 Highcharts的，所以没必要将两个文件都引用；Highmaps 可以单独使用也可以通过地图模块来引用。

var Highcharts = require('highcharts/highstock');

// 加载 地图 模块
require('highcharts/modules/map')(Highcharts);
如果只需要 Highmaps 功能，那么只需要引用 highmaps.js 即可

var Highcharts = require('highcharts/highmaps');

在使用highcharts是可能会出现以下错误

ERROR in src/app/homes/homes.component.ts(3,18): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.
src/app/homes/homes.component.ts(5,1): error TS2580: Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i @types/node` and then add `node` to the types field in your tsconfig.

安装：npm i @types/node，并且在tsconfig.json中types下面添加node

           npm install --save require

这样就不会有报错了

结束