echarts x轴 增加滚动条

          最近blog里面大家都问 x轴类目显示不全问题 如何增加滚动条  下面把我项目中用到的跟大家分享出来  其中

dataZoom 

的代码就是增加滚动条用到的

                                function (ec) {
			            	  var myChart = ec.init(document.getElementById('line')); 
			                  
			                  var option = {
			                      title : {
			               		        text: '商品排名分析',
			               		       subtext:'横向：商品名称， 纵向：金额'
			               		},
			                      tooltip: {
			                          show: true,
			                          trigger: 'axis'
			                      },
			                      legend: {
			                          data:['销售重量','订单金额']
			                      },
			                      toolbox: {
			          		        show : true,
			          		        feature : {
			          		            mark : {show: true},
			          		            dataView : {show: true, readOnly: false},
			          		            magicType : {show: true, type: ['bar','line']},
			          		            restore : {show: true},
			          		            saveAsImage : {show: true}
			          		        }
			          		    },
			          		  grid:{
			          	        
			          	              y2:150
			          	            },
			                      xAxis : [
			                          {
			                              type : 'category',
			                              boundaryGap : true,
			                              data : proNameArr,
			                              axisLabel:{  
	                                          interval:0 ,
	                                          formatter:function(val){  
	                                            return val.split("").join("\n");  
	                                          }  
	                                      }  
			                          }
			                      ],
			                      yAxis : [
			                          {
			                              type : 'value'
			                          }
			                      ],
<span style="color:#ff0000;">			   <span style="color:#FF0000;">                   dataZoom : {
			                          show : true,
			                          realtime : true,
			                          start : 0,
			                          end : 100
			                      }</span>,</span>
			                      series : [
			                          {
			                              "name":"销售重量",
			                              "type":"line",
			                              "data":normWeightArr 
			                          },
			                          {
			                              "name":"订单金额",
			                              "type":"line",
			                              "data":orderMoneyArr 
			                          } 
			                      ] 
			                       
			                  };

			                  // 为echarts对象加载数据 
			                  myChart.setOption(option); 
			             }

这是效果