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

Set enable/disable 3D mode with Highcharts

本文关键字:禁用 3D 模式 启用 Highcharts 设置 使用      更新时间:2023-09-26

我创建了一个表单来动态地更改图表中的值。我可以更改标题、副标题等,但是……我如何更改设置启用或禁用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文档中寻找,但我没有找到任何东西。

不幸的是,您需要销毁和创建图表,3d的更新选项不可用