3

我正在创建许多包含相同默认框架的 highcharts。为了更新图表的动态元素,我一直在创建新对象并在绘制图表的函数调用中引用它们。

这一直很好,直到我开始尝试使轴标签动态化(某些图表需要双轴)。我已经包含了一个 jsfiddle,它显示了我正在使用的动态结构和一个硬编码的相同图表的示例。有人能告诉我为什么这可能不起作用吗?

https://jsfiddle.net/jeo3y1rx/

对象示例:

yAxis = {
    'dollars': function () { 
        var yAxis = { 
            title: { 
                text: "Burdened Dollars" 
            }
        }
        return yAxis;
    }
};

在 highcharts 对象中如何引用 this 的示例:

    var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        type: 'column'
    },
    xAxis: {
        categories: ['FY Total']
    },
    yAxis: yAxis.dollars,
    series: [{
        name: 'YTD Plan',
        data: [1000]
    }, {
        type: 'column',
        name: 'YTD Actual',
        data: [900]
    }]
    });

任何帮助表示赞赏。

4

3 回答 3

3

您不能在 highcharts 中以这种方式将函数用作属性。但是,您可以在图表加载后使用 highcharts API:

chart.yAxis[0].setTitle({
        text: "Burdened Dollars"
});

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/members/axis-settitle/

于 2013-03-22T20:57:49.833 回答
3

Highcharts 3.0 版本允许通过 update() 函数动态改变坐标轴

http://api.highcharts.com/highcharts#Axis.update()

于 2013-03-25T11:45:47.897 回答
1

这是工作小提琴:DEMO

当您将“美元”声明为返回值的函数时,您必须像这样称呼它yAxis: yAxis.dollars(),

JS代码:

var yAxis = {
    'dollars': function () { 
        var yAxis = { 
            title: { 
                text: "Burdened Dollars" 
            }
        };
        return yAxis;
    }
};

$(function () {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column'
        },
        xAxis: {
            categories: ['FY Total']
        },
        yAxis: yAxis.dollars(),//call it like this
        series: [{
            name: 'YTD Plan2',
            data: [1000]
        }, {
            type: 'column',
            name: 'YTD Actual',
            data: [900]
        }]
    });
});
于 2014-07-01T04:57:24.883 回答