javascript - 在 HighCharts 中构建 "double divergent"轴标题

Question

我需要构建一个轴标题，其中字符串左对齐和字符串右对齐。

我尝试使用 css 样式作为标题文本属性，但它不起作用:

Highcharts.chart('container', {
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        title: {
            text: '<span id=xleft style="width:50%;text-align:left;">here is left</span><span id=xright style="width:50%;text-align:right;">here is right</span>'
        }
    },
    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});

下图显示了上述代码 ( http://jsfiddle.net/rfvgegkk/ ) 的输出，而箭头表示所需的结果:

还有其他解决方案或解决方法吗？(最好的是它也可以复制到垂直 y 轴标题)

Answer 1

您可以使用Renderer.text达到想要的结果

function(chart) { // on complete
  chart.renderer.text('Series 1', 60, 350)
    .attr({

    })
    .css({
      color: '#4572A7',
      fontSize: '16px'
    })
    .add();
  chart.renderer.text('Series 2', chart.plotSizeX, 350)
    .attr({

    })
    .css({
      color: '#4572A7',
      fontSize: '16px'
    })
    .add();
}

Fiddle