是否可以在jqplot中使用不成比例的间隔?

时间:2011-11-30 17:55:09

标签: javascript jquery jquery-plugins jqplot

我正在使用jqplot作为一个条形图,它有一个非常高的数字,大约700万和2个非常低的数字,当它们在条形图上绘制时小于100,000,两个低数字只有几个像素高,你几乎看不到它们。

我想知道是否可以在x轴上使用不成比例的间隔,例如图表的下半部分将为0 - 100,000,然后上半部分将从100,000 - 7,000,000

我无法在任何地方的选项中找到它,我已经设置了自定义'ticks',但所有这一切都是将所有低数字压缩到底部的一个小空间。

谷歌没有帮助。

这是我到目前为止所拥有的

function init_graph() {
    var line1 = [19877, 6643895, $('#inpSalary').val()];

    var tickers = ['low number', 'huge number', 'low number'];

            plot1 = $.jqplot('jqplot', [line1], {
                stackSeries: true,
                legend: {
                    show: true,
                    location: 'ne'
                },
                title: 'Data per month stack by user',
                seriesColors:['#fcbaac','#f5564d','#1e3045'],
                seriesDefaults: {
                    renderer: $.jqplot.BarRenderer,
                    rendererOptions: {
                        varyBarColor: true,
                        // barPadding: 6,
                        // barMargin: 15,
                        barWidth: 60,
                        highlightMouseOver: true
                    }
            // shadowAngle: 135
                },
                series: [{
                    label: 'User1'
                }],
                axes: {
                    xaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer,
                        ticks: tickers         
                    },
                    yaxis: {
                        ticks: [0,20000,30000,40000,50000,60000,70000,80000,90000,100000,7000000],
                        min: 0
                    }
                }   
            });
}

1 个答案:

答案 0 :(得分:2)

您可以切换到使用LogAxisRenderer,默认情况下,它会在y轴上为您提供一个基数为10的比例:

<snip>
axes: {
  xaxis: {
    renderer: $.jqplot.CategoryAxisRenderer,
      ticks: tickers         
    },
   yaxis: {
      renderer: $.jqplot.LogAxisRenderer,
      min: 100
   }
} 
<snip>

enter image description here