NIUCLOUD是一款SaaS管理后台框架多应用插件+云编译。上千名开发者、服务商正在积极拥抱开发者生态。欢迎开发者们免费入驻。一起助力发展! 广告
![](https://box.kancloud.cn/0cc8a68dc5c953d6cf6ae6dda1702836_942x436.gif) [运行一下](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> ~~~