jqplot中的条宽度太大

Question

我是jqplot的新手,当我想绘制条形图时,x轴是日期,间隔是1天.这是我的代码的一部分:

     axesDefaults:{                                                                  
          tickRenderer: $.jqplot.CanvasAxisTickRenderer,                              
         tickOptions:{
            fontSize:'10pt',
         },                                                                          
    },                                                                              
     axes:{                                                                          
         xaxis:{
            renderer:$x_renderer,                                                   
             tickOptions:{
               formatString:'%Y-%#m-%#d',                                          
            },
            rendererOptions:{                                                       
                 tickOptions:{
                     angle:-90,                                                      
                 }                                                                   
              },                                                                      
             label:'$label',
             tickInterval:'86400000',
         },
         yaxis:{                                                                     
            tickOptions:{
               formatString:'%.2f',                                                
             },                                                                      
           autoscale:true                                                          
         }, 
    },                                                                              
     highlighter:{ 
         show:true,                                                                  
    },

但我发现每个条的宽度太大而无法相互覆盖.怎么解决？

谢谢!

Answer 1

您可以在系列选项中指定它:

seriesDefault:{
   renderer: $.jqplot.BarRenderer,
   rendererOptions: {
      barWidth: 5
   }
}

不要忘记包含barRenderer插件.有关jqplot条形图的更多文档,请查看:Jqplot文档

Answer 2

该AnthonyLeGovic答案确实是正确的,但如果你需要根据数据点,你可以做以下的数量来改变列宽:

// Get the size of the container of the plot
var width = jQuery(containerName).width();

// Divide by the number of data points.
width = width / number_of_data_points;

// Reduce the width to a % of the total for each data point.
width = (width * 20) / 100;

// Set the value
$.jqplot(containerName, [data],
{
    // whatever
    // ...

    seriesDefault:
    {
        renderer: $.jqplot.BarRenderer,
        rendererOptions: { barWidth: width }
    }

    // whatever
    // ...
}

请注意,我没有考虑图例的宽度.图例宽度只能在绘图后获得,因此如果您想要考虑甚至图例的宽度来减小列宽,则必须在绘图后进行,然后重新绘制.

我准备了一个 小提琴,展示了一个例子.

希望能帮助到你.