javascript - 使用 Highcharts 设置启用/禁用 3D 模式

Question

我制作了一个表格来动态更改图表中的值。我可以更改标题、副标题等，但是...如何更改以设置启用或禁用 3D 模式？

$(document).ready(function () {

    //Title inputText
    $('#gra_title').blur(function(){
        chart.setTitle({ text: $('#gra_title').attr("value") });
    });

    //Subtitle inputText
    $('#gra_subtitle').blur(function(){
        chart.setTitle(null, { text: $('#gra_subtitle').attr("value") });
    });

    //Credits checkbox
    $('#gra_credits_visible').click(function () {
        if ($('#gra_credits_visible').is(':checked')){ 
            chart.credits.show();
        }else{
            chart.credits.hide();
        }
    });

.........  //More events to change chart

    //3D checkbox - MY PERSONAL BUG
    $('#gra_3d_visible').click(function () {
        if ($('#gra_3d_visible').is(':checked')){ 
            chart.options.chart.options3d.enabled = true;
        }else{
            chart.options.chart.options3d.enabled = false;
        }
        chart.redraw();
        // return TRUE or FALSE, but don't change 3D/2D mode
        alert(chart.options.chart.options3d.enabled);
    });


});

这是我的图表:

chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        marginRight: 0,
        events: {
            load: function () {
                this.credits.element.onclick = function () {
                    window.open('http://www.url.com', '_blank');
                }
            }
        },
        marginTop: 80,
        type: 'column',
        options3d: {
            enabled: true,
            alpha: 15,
            beta: 15,
            viewDistance: 25,
            depth: 90
        }
    },
    plotOptions: {
        column: {
            depth: 90
        }
    },
    credits: {
        enabled: true,
        text: 'MyWeb.com',
        style: {
            cursor: 'pointer',
            color: '#909090',
            fontSize: '10px'
        }
    },
    title: {
        text: 'Población Mundial'
    },
    subtitle: {
        text: 'Fuente: Wikipedia.org'
    },
    xAxis: {
        title: {
            text: 'Continentes'
        },
        categories: ['Africa', 'América', 'Asia', 'Europa', 'Oceanía']
    },
    yAxis: {
        title: {
            text: 'Población (millones)'
        },
    },
    series: [{
        name: 'Año 1800',
        data: [107, 31, 635, 203, 2]
    }]
});

我在 API Documentation 中寻找但我什么也没找到。

Answer 1

很遗憾，您需要销毁和创建图表，3d 的更新选项不可用。