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

发布于 2024-12-18 17:28:52 字数 1672 浏览 1 评论 0原文

我正在使用 jqplot 绘制条形图，该条形图有 1 个非常高的数字，大约 700 万，还有 2 个非常低的数字，在条形图上绘制时小于 100,000，这两个低数字只有几个像素高，您几乎看不到他们。

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

我在选项中找不到它，我设置了自定义“刻度”，但所做的只是将所有低数字压缩到底部的一个小空间中。

谷歌没有帮助。

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

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
                    }
                }   
            });
}

原文

I am using jqplot for a bar graph that has 1 very high number around 7 million and 2 very low numbers, less than 100,000 when they are charted on a bar graph the two low numbers are only a couple of pixels tall, you can barely see them.

I am wondering if it is possible to use disproportionate intervals on the x axis for example the lower half of the chart would be say 0 - 100,000 and then the upper half would go from 100,000 - 7,000,000

I can't find it in the options anywhere, I've set custom 'ticks' but all that does is squeeze all the low numbers into a tiny space at the bottom.

Google is no help.

Here is what I have so far

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
                    }
                }   
            });
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

浮华 2024-12-25 17:28:52

您可以切换到使用 LogAxisRenderer，默认情况下，它会在 y 轴上为您提供以 10 为底的对数刻度：

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

You could switch to using the LogAxisRenderer, which by default with give you a log base 10 scale on the y-axis:

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

enter image description here