2012-10-06 57 views
4

我正在用jqPlot繪製圖表,並且在我的模板中,我設計了圖表使其向下生長,有些翻轉酒吧,以便他們從頂部開始往下走,取決於數據庫的一些輸入。我正在考慮乘以-1,但似乎並不奏效。如何翻轉我的jqPlot圖表

有什麼建議嗎?這是我的代碼。

$(文件)。就緒(函數(){$ .jqplot.config.enablePlugins = TRUE; VAR C0 = 「」; VAR C1 = 「」; VAR C2 = 「」; VAR C3 = 「」; VAR C4 = 「」; VAR C5 = 「」; VAR C6 = 「」; VAR C7 = 「」; VAR C8 = 「」; VAR C9 = 「」;

   var a0 = "<?php echo $numArticles[0]?>"; 
       var a1 = "<?php echo $numArticles[1]?>"; 
       var a2 = "<?php echo $numArticles[2]?>"; 
       var a3 = "<?php echo $numArticles[3]?>"; 
       var a4 = "<?php echo $numArticles[4]?>"; 
       var a5 = "<?php echo $numArticles[5]?>"; 
       var a6 = "<?php echo $numArticles[6]?>"; 
       var a7 = "<?php echo $numArticles[7]?>"; 
       var a8 = "<?php echo $numArticles[8]?>"; 
       var a9 = "<?php echo $numArticles[9]?>"; 

       var s1 = [a0, a1, a2, a3, a4, a5,a6,a7,a8,a9]; 
       var ticks = [c0, c1,c2,c3,c4,c5,c6,c7,c8,c9]; 
       plot1 = $.jqplot('chart1', [s1], { 
        // Only animate if we're not using excanvas (not in IE 7 or IE 8).. 
        animate: !$.jqplot.use_excanvas, 
        seriesDefaults:{ 
         shadow: false, 
         renderer:$.jqplot.BarRenderer, 
         pointLabels: { show: true } 
        }, 
        axes: { 
         xaxis: { 
          renderer: $.jqplot.CategoryAxisRenderer, 
          ticks: ticks, 
          showTickMarks:false 
         }, 
         yaxis: { 
          renderer: $.jqplot.CategoryAxisRenderer, 
          ticks: ticks, 
          showTicks: false  // same options as axesDefaults 
         } 
        }, 

       grid: { 
       drawGridLines: false,  // wether to draw lines across the grid or not. 
       gridLineColor: '#0d1c26', // *Color of the grid lines. 
       background: 'transparent', // CSS color spec for background color of grid. 
       borderColor: '#122934',  // CSS color spec for border around grid. 
       borderWidth: 0,    // pixel width of border around grid. 
       shadow: false    // draw a shadow for grid. 
              // CanvasGridRenderer takes no additional options. 
      }, 
        seriesColors: [ "#0a3b4c"],  
        highlighter: { show: false } 
       }); 

       $('#chart1').bind('jqplotDataClick', 
        function (ev, seriesIndex, pointIndex, data) { 
         $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data); 
        } 
       ); 
      }); 
      </script> 

回答

0

編輯:
這個答案只對PieRenderer有關,而這是有問題使用BarRenderer


不確定翻轉,但可能將「startAngle」設置爲180可能會有訣竅嗎?

  plot1 = jQuery.jqplot ('chart1', [data], 
      { 
       seriesDefaults: { 
        renderer: jQuery.jqplot.PieRenderer, 
        rendererOptions: { 
         startAngle : 180 
        } 
       }, 
       ... other stuff ... 
      } 

參考,其它渲染選項:http://www.jqplot.com/docs/files/plugins/jqplot-pieRenderer-js.html

+0

我不知道這是否是相關的barCharts,我知道它的工作原理與pieRenderer。您是否使用過它,因爲我無法使用barCharts實施您的建議。 – Ando

+0

@Ando omg對不起,我完全錯過了渲染器!出於某種原因,我確信這是一張餅圖。 – frnhr

+0

不用擔心,至少你試過了。如果你想出其他的東西,讓我知道。 – Ando