【问题标题】:jqPlot bar chart with linear scale带有线性刻度的 jqPlot 条形图
【发布时间】:2013-04-30 15:51:59
【问题描述】:

我想在 xaxis 上获得带有线性刻度的条形图,这里是代码 -

<script class="code" type="text/javascript">$(document).ready(function(){
       var years =  ['2000', '2010', '2030']
       var chartData =  [8140221, 8402213, 8544930]    
       $.jqplot.config.enablePlugins = true;
                     var plot2 = $.jqplot('chart0', [chartData], {
                        title: 'Some Plot',
                         seriesDefaults:{
                             renderer: $.jqplot.BarRenderer,
                             rendererOptions: {
                                barPadding: 1,
                                barMargin: 15,
                                barDirection: 'vertical',
                                barWidth: 50
                            }, 
                            pointLabels: { show: true }
                        },
                        axes: {
                            xaxis: {                            
                                    renderer:  $.jqplot.CategoryAxisRenderer,
                                    ticks: axisDates
                            },
                            yaxis: {
                                tickOptions: {
                                    formatString: '%d'
                                }
                            }
                        },
                        highlighter: {
                            sizeAdjust: 7.5
                        },
                        cursor: {
                            show: true
                        }
                    });

            });</script>

在这里,在 xaxis 上,我们得到了 2000、2010 和 2030,但距离仍显示为相同。无论如何,我是否可以显示 2010 年和 2030 年之间的更多距离,以便大致了解第二个间隔的差异大于第一个间隔。我尝试提供 tickInterval 和 numberTicks 但它似乎没有改变任何东西。

我需要使用不同的渲染器或配置吗?

谢谢。

【问题讨论】:

    标签: jquery charts jqplot bar-chart


    【解决方案1】:

    我不确定您是否找到了解决此问题的方法 - 但是,有一种方法可以“破解”图表来说明三个条形之间的差异。

    如果您的数据集在“预期”范围内,您可以使用minmax 属性来限制范围,这样可以显示值之间的真实差异。

    here 提供了如何执行此操作的示例。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-07-05
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-10-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多