Highcharts自定义文本从右向左导出

Highcharts custom text right to left export

本文关键字：自定义 文本 Highcharts      更新时间：2024-06-25

我的问题是我有一个图表，上面有一些自定义文本，必须使用renderer.text('text', 600, 30).add(); 在图表的右上角和上下角

我第一次用的是renderer.text('text', 600, 30).css('direction': 'rtl').add();这很好，但当我出口时，它没有认出stlye

然后我尝试使用renderer.text('<span style="direction:rtl;">text</span>', 600, 30).add();这也只是为了在页面上显示它，但导出没有

有什么方法可以解决这个问题以用于导出吗？

样本

对于这个特定问题，避免整个"CSS和导出"问题的一种方法是使用文本的边界框来正确放置它，而不是使用CSS解决方案。

function (chart) { // on complete
    var rightTop = [590,85];
    var element = chart.renderer.text('This is a looooong text', 0, -100).add();
    var boundingBox = element.getBBox();
    element.destroy();
    chart.renderer.text('This is a looooong text', 
            rightTop[0] - boundingBox.width, 
            rightTop[1]).add();
}

这里的rightTop变量表示我们希望它被放置的位置。然后添加文本（在视觉之外），我们让边界框知道它的大小，然后销毁它。然后我们在正确的位置重新创建文本。

请参阅这个JSFiddle示例，了解它的工作原理。

相关文章：