javascript - 图表类别标签只会从中心旋转？

Question

我刚刚开始学习 EXT JS，我尝试梳理教程，但似乎对我的问题没有找到太多运气。我的问题是我有一个条形图，我想旋转标签以留出更多空间。我可以很好地旋转它们，但旋转点似乎基于标签的中间。我希望标签的末尾与该特定列的标记对齐。

如果这没有意义的话，这是一张图片:

我有什么:

我想要什么:

看来我想要实现的是一个非常标准的事情，但我似乎找不到太多关于这个问题的信息。

代码片段:

{
  xtype        : 'cartesian',
  store        : 'Store1',
  height       : 350,
  width        : 390,
  flipXY       : true,
  axes         : [
      {
         type     : 'category',
         position : 'left',
         label    : {
             rotation : {
                 degrees : -15
             }    
         }
    },
    {
       type     : 'numeric',
       position : 'bottom'
      }
    ],
    series : [
       {
          type    : 'bar',
          xField  : 'cName',
          yField  : 'cNumber',
          colors  : ['#99CCFF'],
          label   : {
              display : 'outside',
              field   : 'cNumber'
          }
      }
  ]
}

Answer 1

您可以设置textAlign: 'end'，将label配置更改为:

label: {
    textAlign: 'end',
    rotation: {
        degrees: -15
    }
}

<小时/>

编辑

尝试过标签配置后，希望这就是您所寻找的:

label: {
    textAlign: 'end',
    textBaseline: 'hanging',
    x: -10,
    y: -10,
    rotation: {
        degrees: -15,
        centerX: -5
    }
}

工作示例:https://fiddle.sencha.com/#fiddle/uea