带有线性刻度的jqPlot条形图-Java 学习之路

我想在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>

enter image description here

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

我是否需要使用不同的渲染器或配置？

谢谢 .

1 回答

0

我不确定你是否找到了解决这个问题的方法 - 然而，有一种方法可以“破解”图表以说明三个条形图中的差异 .

如果您的数据集在"expected"范围内，则可以使用 min 和 max 属性来限制范围，这样您就可以显示值之间的真实差异 .

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

回复于 2024-05-06T18:18:57+08:00

带有线性刻度的jqPlot条形图

1 回答

相关问题