是否在ExtJS 4柱形图中设置最大条形宽度？

Question

我有一个250px宽的柱状图，当系列中有10+项目时，它看起来很棒，但当只有2-3个项目时，条形图真的画得很宽，这看起来有点奇怪。

   _____
  |     |
  |     |
-----|-----

我可以在系列配置中设置宽度：

{
  style: { width: 25 }
}

这是可行的，但较细的条形仍然左对齐其先前的位置，因此它们与轴刻度和标签不匹配。

如下所示：

   _
  | |
  | |
-----|-----

我不想改变轴间距，我希望最终得到大间距、25px的条形图(它们正确地居中于轴刻度)：

     _
    | |
    | |
-----|-----

有什么想法吗？

Answer 1

renderer: function(sprite, record, attr, index, store) {                    

    return Ext.apply(attr, {
        fill: color,
        width: 50,
        x: Math.max(attr.x, attr.x + (attr.width - 50) / 2)
    });
}

Answer 2

也许有点晚了，但这是我的解决方案

renderer: function(sprite, record, attr, index, store) {                    

    return Ext.apply(attr, {
        fill: color,
        width: 50,
        x: Ext.getCmp('chart_id').axes.items[1].inflections[value][0] - 25
    });
}

在这个例子中，我读取了x轴并找到了任何给定的点(标签条纹)，然后通过我的条形图循环，你可以使用计数或其他东西，并使用In而不是value。希望它能起作用！

Answer 3

//try like below
series:[
    {...
        style:{
            minBarWidth:5,
            maxBarWidth:5
        }
    },
    {...}
]