Echarts学习记录——如何去掉网格线及网格区域颜色
生活随笔
收集整理的這篇文章主要介紹了
Echarts学习记录——如何去掉网格线及网格区域颜色
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
關鍵屬性
splitLine和splitArea，可以設置相關的屬性
示例代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="ECharts"> <title>Echarts學習記錄</title> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> </head> <script type="text/javascript"> var width; var height; var myChart; $(function(){ //自適應設置 width = $(window).width(); height = $(window).height(); $("#mainBar").css("width",width-40); $("#mainBar").css("height",height-40); console.log(height); setEcharts(); }); $(window).resize(function() { width = $(window).width(); height = $(window).height(); $("#mainBar").css("width",width-40); $("#mainBar").css("height",height-40); }); function setEcharts(){ myChart = echarts.init(document.getElementById('mainBar')); //自適應 window.onresize = myChart.resize; myChart.setOption({ title : { text: '未來一周\n氣溫變化', subtext: '純屬虛構' }, legend: { data:['蒸發量','降水量'] }, xAxis : [ { splitLine:{show: false},//去除網格線 type : 'category', data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'], splitArea : {show : true}//保留網格區域 } ], yAxis : [ { splitLine:{show: false},//去除網格線 type : 'value', splitArea : {show : true}//保留網格區域 } ], series : [ { name:'蒸發量', type:'bar', data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3] }, { name:'降水量', type:'bar', data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3], } ] }); } </script> <body> <div id="mainBar" style="border:1px solid #ccc;padding:10px;"></div> <!-- 標簽式引入Eharts 如果你把引用echarts的script標簽放置head內在IE8-的瀏覽器中會出現報錯，解決的辦法就是把標簽移動到body內(后)。 --> <script type="text/javascript" src="http://apps.bdimg.com/libs/echarts/2.1.9/source/echarts-all.js"></script> <script> </script> </body> </html>效果圖
總結
以上是生活随笔為你收集整理的Echarts学习记录——如何去掉网格线及网格区域颜色的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JS删除String里某个字符的方法
- 下一篇： echarts 去掉网格线