1.安装 typings 库，以及 ECharts：
npm install typings echarts --global
2.安装 ECharts 的 TypeScript 定义文件，这个文件来自社区贡献
npm install @types/echarts --save
3.在 TypeScript 文件中导入echarts
import * as echarts from 'echarts';
4.有可能在引入ECharts 时报出错误ECharts 找不到 Cannot find module echarts ，则需要
npm install echarts --save
5.写出代码：ts文件的代码
import { Component, OnInit } from '@angular/core';
import * as echarts from 'echarts';

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

constructor() {
console.log(echarts);
}

ngOnInit() {
this.initCharts();
}

initCharts() {
const ec = echarts as any;
const lineChart = ec.init(document.getElementById('lineChart'));
const lineChartOption = {
tooltip: {
trigger: 'axis'
},
toolbox: {
show: true,
},
legend: {
padding: 0
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '新签合同额',
type: 'line',
smooth: true,
itemStyle: {
normal: {
lineStyle: {
color: '#c8c8c8'
}
}
},
data: [10, 2, 5, 4, 6, 3, 7, 2, 2, 3, 6, 7],

    },
    {
      name: '营业收入',
      type: 'line',
      smooth: true,
      itemStyle: {
        normal: {
          lineStyle: {
            color: '#1ab394'
          }
        }
      },
      data: [3, 2, 4, 7, 0, 3, 1, 3, 4, 1, 2, 3]
    },
    {
      name: '归属母公司净利润',
      type: 'line',
      smooth: true,
      itemStyle: {
        normal: {
          lineStyle: {
            color: '#ff713a'
          }
        }
      },
      data: [10, 2, 6, 3, 2, 9, 10, 3, 4, 8, 4, 3]
    }
  ]
};
lineChart.setOption(lineChartOption);

}
}
6.html模板：
<div id="lineChart" style="width:400px;height:300px"></div>
这样就能显示曲线图了。

注意，如果要满屏显示，那么需要做的是：
修改本页面的html为：
<div id="lineChart" style="width:100%;height:100%"></div>
还需将index.html的样式设置为：
可以直接写到styles.css文件中：
html, body {
height: 100%;
border: 0px;
}