[運行一下](http://www.shouce.ren/study/api/s/7091)
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>圖形展示</title>
</head>
<body>
<div class="detail-section">
<div id="canvas">
</div>
</div>
<script src="http://g.tbcdn.cn/bui/acharts/1.0.32/acharts-min.js"></script>
<!-- https://g.alicdn.com/bui/acharts/1.0.29/acharts-min.js -->
<script type="text/javascript">
var chart = new AChart({
theme : AChart.Theme.SmoothBase,
id : 'canvas',
width : 950,
height : 500,
plotCfg : {
margin : [50,50,80] //畫板的邊距
},
seriesOptions : { //設置多個序列共同的屬性
areaCfg : { //如果數據序列未指定類型，則默認為指定了xxCfg的類型，否則都默認是line
markers : {
single : true
},
pointStart: 1940,
pointInterval : 1
}
},
yAxis : {
formatter : function (value) {
return value;
}
},
tooltip : {
valueSuffix : '￥'
},
series : [{ //中間存在斷點，斷點不做處理，不進行忽略
name: 'USA',
data: [null, null, null, null, null, 6 , 11, 32, 110, 235, 369, 640,1005, 1436,
2063, 3057, 4618, 6444, 9822, 15468, 20434, 24126,27387, 29459, 31056, 31982,
32040, 31233, 29224, 27342, 26662,26956, 27912, 28999, 28965, 27826, 25579,
25722, 24826, 24605,24304, null, null, 24099, 24357, 24237, 24401, 24344,
23586,22380, 21004, 17287, 14747, 13076, 12555, 12144, 11009, 10950,
10871, 10824, 10577, 10527, 10475, 10421, 10358, 10295, 10104
]
}, {
name: 'USSR/Russia',
connectNulls : true, //此配置項會將null的數據忽略掉
data: [null, null, null, null, null, null, null , null , null ,null,5, 25, 50,
120, 150, 200, 426, 660, 869, 1060, 1605, 2471, 3322,4238, 5221, 6129,
7089, 8339, 9399, 10538, 11643, 13092, 14478,15915, 17385, 19055, 21205,
23044, 25393, 27935, 30062, null,33952, 35804, 37431, 39197, 45000, 43000,
41000, 39000, 37000,35000, 33000, 31000, 29000, 27000, 25000, 24000, 23000,
22000,21000, 20000, 19000, 18000, 18000, 17000, 16000
]
}]
});
chart.render();
</script>
</body>
</html>
~~~
