Question

使用Highstock或Highcharts，我希望我的yAxis标签位于顶部。我不想要的是图表左边框和网格线开头之间的差异。

如果您看一下以下小提琴： JSFiddle

相关部分是：

yAxis: {
    title: {
        align: 'high',
        offset: 0,
        text: 'Rainfall (mm)',
        rotation: 0,
        y: -10
    }
}

这几乎是正确的，但偏移边距取自标签宽度。如果我设置offset: -41，它看起来完全正确。问题是，-41是由于文本的渲染长度造成的。如果我将文本更改为不同长度的文本，标签将再次错误定位。

是否有可能确保在我的上述正确定义中，无论文本长度如何，这些位置始终是“正确的”？

屏幕截图，左侧部分错误，右侧部分正确：

Answer 1

我认为您可以使用text-anchor属性来设置标题样式。在这里，您可以找到有关text-anchor属性的更多信息：https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/text-anchor

  title: {
    align: 'high',
    text: 'Rainfall (mm)',
    style: {
      'text-anchor': 'start'
    },
    rotation: 0,
    y: -10,
    x: -25
  },

我认为您还需要使用chart.marginLeft参数。它将为您提供为图表设置特定左边距的机会。在这里您可以找到有关它的信息。 http://api.highcharts.com/highcharts#chart.marginLeft

您也可以使用xAxis.labels.reserveSpace参数关闭标签的预留空间：http://api.highcharts.com/highcharts#xAxis.labels.reserveSpace

在这里，您可以找到您的图表如何使用此选项的实时示例： http://jsfiddle.net/Ljwp7694/

亲切的问候，

Highstock / Highcharts - yAxis Label top

1 个答案: