将Highcharts标签定位在右侧

Question

我有一个带有自定义标签的基本图表，例如：

labels: {
  items: [{
    html: 'Testing Label',
    style: {
      left: '50px',
      top: '50px'
    }
  }]
}

这有效，但是我想从右侧定位标签，我尝试这样做：

style: {
  right: '50px',
  top: '50px'
}

但这不起作用...

jsfiddle链接：http://jsfiddle.net/0ze2u47h/3/

Answer 1

看来right属性在chart.labels中不支持。对于更复杂的配置，您可以使用SVGRenderer渲染标签：

  chart: {
    events: {
      load: function() {
        var chart = this,
          renderer = chart.renderer;
          var label = this.renderer.label('Test label', null, 100).add();
          label.attr({
            x: chart.plotWidth + chart.plotLeft - label.width
          });  
      }
    }
  }

实时演示： http://jsfiddle.net/kkulig/aob1e197/

通过renderer渲染标签的优点（不是通过构造器选项）是您可以访问已经创建的图表和标签的参数（在这种情况下chart.plotWidth，chart.plotLeft，label.width）。

---

API参考： https://api.highcharts.com/class-reference/highcharts.svgrenderer#label