Highcharts动态更改标签？

Question

这个图表上有一个标签：http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/combo/ 标签是“总水果消费”。

创建完图表后，我如何动态更改该句话？

PS：我尝试设置标签并重新绘制图表，但没有成功：http://jsfiddle.net/UXDqL/ 有什么想法？

- kamaci

Answer 1

可以不使用标签，而是使用渲染器文本()，然后使用变量来保持对象。如果您需要动态更新此文本，则只需使用attr()函数进行更新。

http://jsfiddle.net/6GKCJ/2/

var title = chart.renderer.text('Total fruits consumption', 100, 90)
        .css({
            fontSize: '12px'
        })
        .add();

        $('#btn').click(function(){

            title.attr({
                text:'newText'
            });
        });

- Sebastian Bochan

---

这正是我正在寻找的，感谢您提到这个。 - Chad Cache

Answer 2

如果您想在绘制后更改它，只需对元素本身进行操作。使用JQuery选择器就像这样简单：

// find me the tspan containing the specified text and change it to...
$("tspan:contains('Total fruit consumption')").text("Something New")

- Mark

---

可能无法跨浏览器工作，特别是因为它依赖于SVG将被渲染的假设，但基于浏览器，Highchart可能会或可能不会输出SVG。 - Jugal Thakkar

Answer 3

截至Highcharts 3.0，Highchart没有提供任何方法来动态更新标签标题。虽然它确实提供了一个动态更新系列的方法：http://api.highcharts.com/highstock#Series.update()

要更新标签标题，我们需要采取一种蛮力的方法，即在更新图表选项后重新渲染图表。以下代码可以解决问题：

var mychart = $('#container').highcharts();
    mychart.options.labels.items[0].html= "Changed label header";
    mychart = new Highcharts.Chart(mychart.options);
    mychart.render();

JsFiddle: http://jsfiddle.net/msjaiswal/ZD4N5/2/

类似的讨论：这里

- Mayank Jaiswal