2016-12-22 27 views
1

我爲我的X軸數據使用jqplot CategoryAxisRenderer。我也需要縮放。但我只能縮放y軸。請提出解決方案。我是圖表新手。我搜查了很多,但沒有得到正確的答案。請提供答案。 這是我的代碼。jqplot放大類別AxisRenderer不起作用

function renderBarChart(){ 
    barChartData = [["abcd",56], ["efgh",60], ["ghij",79],["klmn",20],["opqr",34],["stuv",67],["wxyz",42],["adfg",77],["ghjy",29]]; 
    plot2 = $.jqplot('barChart', [barChartData], { 
     seriesColors: ["#4fb3ce"], 
     animate: !$.jqplot.use_excanvas, 
     highlighter: { 
      show: true, 
      showMarker:false, 
      tooltipLocation:'n', 
      tooltipOffset: 6, 
      tooltipContentEditor:tooltip_formatter_bar 
     }, 
     grid: { 
      background: '#f7fafa', 
      drawBorder: false, 
      shadow: false, 
      gridLineColor: '#eceeee', 
      gridLineWidth: 1 
     }, 
     legend: { 
      show: false 
     }, 
     seriesDefaults:{ 
      showMarker:false, 
      renderer:$.jqplot.BarRenderer, 
      rendererOptions: { 
       barPadding: 0, 
       barMargin: 0, 
       barWidth:20, 
       shadowAlpha: 0.04, 
       shadowOffset:1.5, 
       highlightMouseOver: false, 
       dataLabels: 'percent' 
      }, 
      pointLabels:{ 
       show: true, 
       ypadding : 5, 
       color: '#7c7c7c', 
      } 

     }, 
     axesDefaults: { 
      rendererOptions: { 
       baselineWidth: 1, 
       baselineColor: '#eceeee', 
       drawBaseline: true 
      } 
     }, 
     axes: { 

      xaxis: { 
       showMark: false, 
       renderer: $.jqplot.CategoryAxisRenderer, 
       //ticks: barTicks, 
       //pad: 0, 
       label:'Associate ID', 
       labelRenderer: $.jqplot.CanvasAxisLabelRenderer, 
       tickRenderer: $.jqplot.CanvasAxisTickRenderer, 
       labelOptions: { 
        fontFamily: 'Arial', 
        fontSize: '12px' 
       }, 
       tickOptions: { 
        angle: 0, 
        textColor: '#7c7c7c', 
        showMark: false, 
        fontSize: '10px' 
       } 
      }, 
      yaxis: { 
       tickOptions: { 
        showMark: false, 
        fontSize: '10px' 
       }, 
       min:0, 
       max:100, 
       tickInterval:10, 
       label: 'Incident', 
       labelRenderer: $.jqplot.CanvasAxisLabelRenderer, 
       labelOptions: { 
        fontFamily: 'Arial', 
        fontSize: '12px' 
       } 
      } 
     }, 
     cursor:{ 
      show: true, 
      zoom:true 
      } 
    }); 
} 

回答

-1

您是否嘗試過使用contrainZoomTo:'x'。使用constrainZoomTo

cursor: { 
      show: true, 
      showTooltip: true, 
      zoom: true, 
      constrainZoomTo: 'x' 
     }, 
+0

:「X」顯示指針縮放,但並沒有真正放大圖表 –

+0

這裏是的jsfiddle鏈接http://jsfiddle.net/559utdvp/2/ –