版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_20042935/article/details/89712768
效果图
源代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<!-- 引入 echarts.js -->
<script src="js/echarts.min.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
var option;
var data = [
[1, 4862.4],
[2, 5294.7],
[3, 5934.5],
[4, 7171.0],
[5, 8964.4],
[6, 10202.2],
[7, 11962.5],
[8, 14928.3],
[9, 16909.2],
[10, 18547.9],
[11, 21617.8],
[12, 26638.1],
[13, 34634.4],
[14, 46759.4],
[15, 58478.1],
[16, 67884.6],
[17, 74462.6],
[18, 79395.7]
];
// See https://github.com/ecomfe/echarts-stat
var myRegression = ecStat.regression('exponential', data);
myRegression.points.sort(function(a, b) {
return a[0] - b[0];
});
option = {
title: {
text: '1981 - 1998 gross domestic product GDP (trillion yuan)',
subtext: 'By ecStat.regression',
sublink: 'https://github.com/ecomfe/echarts-stat',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross'
}
},
xAxis: {
type: 'value',
splitLine: {
lineStyle: {
type: 'dashed'
}
},
splitNumber: 20
},
yAxis: {
type: 'value',
splitLine: {
lineStyle: {
type: 'dashed'
}
}
},
series: [{
name: 'scatter',
type: 'scatter',
label: {
emphasis: {
show: true,
position: 'left',
textStyle: {
color: 'blue',
fontSize: 16
}
}
},
data: data
}, {
name: 'line',
type: 'line',
showSymbol: false,
smooth: true,
data: myRegression.points,
markPoint: {
itemStyle: {
normal: {
color: 'transparent'
}
},
label: {
normal: {
show: true,
position: 'left',
formatter: myRegression.expression,
textStyle: {
color: '#333',
fontSize: 14
}
}
},
data: [{
coord: myRegression.points[myRegression.points.length - 1]
}]
}
}]
};
myChart.setOption(option);
</script>
</body>
</html>