本文主要是介绍中国历年存款、贷款利率（1990-2015）Echarts图表设计，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
最近开始关注Echarts，总算找到我想要的图表表现方式。做了历年1年期存款利率，历年5年期存款利率，历年5年以上贷款利率，历年公积金5年以上贷款利率。http://fav.jiankangjiaju.com/i/Rate/Rate.asp
以历年的一年期存款利率为例子，代码如下：
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:400px"></div><!-- ECharts单文件引入 -->
<script src="../../Echarts/build/dist/echarts.js"></script>
<script type="text/javascript">// 路径配置require.config({paths: {echarts: '../../Echarts/build/dist'}});require(['echarts','echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载],function (ec) {// 基于准备好的dom，初始化echarts图表var myChart = ec.init(document.getElementById('main')); var option = {title : {text: '[One Year] Deposit Rate (1990-2015)',x: 'center',textStyle : {ontSize: '20'}},tooltip : {trigger: 'item'},xAxis : [{name : 'Date',type : 'category',axisLine : {show: true,lineStyle: {color: 'green',type: 'solid',width: 2}},boundaryGap : true,axisLabel : {show:true,interval: 'auto',rotate: 45,margin: 8,},data : ['1990.04.15', '1990.08.21', '1991.04.21', '1993.05.15', '1993.07.11', '1996.05.01','1996.08.23', '1997.10.23', '1998.03.25', '1998.07.01', '1998.12.07', '1999.06.10','2002.02.21', '2004.10.29', '2006.08.19', '2007.03.18', '2007.05.19', '2007.07.21','2007.08.22', '2007.09.15', '2007.12.21', '2008.10.09', '2008.10.30', '2008.11.27','2008.12.23', '2010.10.20', '2010.12.26', '2011.02.09', '2011.04.06', '2011.07.07','2012.06.08', '2012.07.06', '2014.11.22', '2015.03.01', '2015.05.11', '2015.06.28','2015.08.26', '2015.10.24']}],yAxis : [{name : 'Rate(%)',type : 'value',axisLine : {show: true,lineStyle: {color: 'green',type: 'solid',width: 2}}}],series : [{name:'Deposit Rate (%)',type:'bar',itemStyle: {normal: {color : '#C5EDD2',label : {show : true,position: 'top' ,textStyle : {color : '#95B55B',fontSize : '8'}}},emphasis: {color: '#95B55B',label : {show : true,position: 'top' ,textStyle : {color : 'rgba(0,0,0,0)',fontSize : '8'}}}},data:[10.08, 8.64, 7.56, 9.18, 10.98, 9.18, 7.47, 5.67, 5.22, 4.77, 3.78, 2.25, 1.98,2.25, 2.52, 2.79, 3.06, 3.33, 3.6, 3.87, 4.14, 3.87, 3.6, 2.52, 2.25, 2.5, 2.75,3, 3.25, 3.5, 3.25, 3, 2.75, 2.5, 2.25, 2, 1.75, 1.5],markPoint : {symbol : 'pin',itemStyle: {normal: {color : '#95B55B',label : {show : true}}},data : [{type : 'max', name: 'Max Rate'},{type : 'min', name: 'Min Rare'}]}}]};// 为echarts对象加载数据
myChart.setOption(option);
}
);
</script>
这篇关于中国历年存款、贷款利率（1990-2015）Echarts图表设计的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
