3D 柱形图不适用于 asp .net 项目中的滑块

Question

我在执行此代码时遇到了一些错误。我不知道是什么原因。我正在尝试 在 ASP .NET 中的项目中实现 3D 柱形图。我得到了图表，但在调整 3D 的角度时，即 阿尔法角和贝塔角 图表会进行尼特重角。请检查我的代码并帮助我。请。 我的代码 ：
$（ document ）.ready（function（） {

//3D Column chart
var someFunction3DColumn=function () {
  $('#container').highcharts({
        chart: {
            renderTo: 'container',
            type: 'column',
            margin: 75,
            options3d: {
                enabled: true,
                alpha: 15,
                beta: 15,
                depth: 50,
                viewDistance: 25
            }
        },
        title: {
            text: <%= yeardatabar%>
        },
        subtitle: {
            text: ''
        },
        xAxis: {
        labels: {
                rotation: -45,
                style: {
                    fontSize: '13px',
                    fontFamily: 'Verdana, sans-serif'
                }
            },
            categories: [
                'Jan',
                'Feb',
                'March',
                'April',
                'May',
                'June',
                'July'
            ]
        },
        plotOptions: {
            column: {
                depth: 25
            }
        },
        series: [{
            data:<%= field1%> 
        }]
        });
        function showValues() {
        alert("main");
        //$('#sliders').show();
        $('#R0-value').html(chart.options.chart.options3d.alpha);
        $('#R1-value').html(chart.options.chart.options3d.beta);
        }
        // Activate the sliders
        $('#R0').on('change', function () {
            alert("alpha");
            chart.options.chart.options3d.alpha = this.value;
            alert(alpha);
            showValues();
            chart.redraw(false);
        });
        $('#R1').on('change', function () {
            alert("beta");
            chart.options.chart.options3d.beta = this.value;
            alert(beta);
            showValues();
            chart.redraw(false);
        });
        showValues();
    };
    if ($("#RadioButton1").is(":checked")) {$('#sliders').hide();
        someFunctionpie();
        }
    if ($("#RadioButton2").is(":checked")) {$('#sliders').hide();
        someFunctionbar();
        }
    if ($("#RadioButton3").is(":checked")) {$('#sliders').hide();
        someFunctionPyramid();
        }
    if ($("#RadioButton4").is(":checked")) {
        someFunction3DColumn();
        }    
    });

    <div id="sliders">
    <table>
        <tr><td>Alpha Angle</td><td><input id="R0" type="range" min="0" max="45" value="15"/> <span id="R0-value" class="value"></span></td></tr>
        <tr><td>Beta Angle</td><td><input id="R1" type="range" min="0" max="45" value="15"/> <span id="R1-value" class="value"></span></td></tr>
    </table>
</div>

Answer 1

我认为您正在尝试重新创建此演示。问题出在chart变量上。在上面的演示中，使用了不同的构造函数：

var chart = new Highcharts.Chart({ ... });

使用时：

$('#container').highcharts({ ... });

第一个是创建图表并将自身返回到变量。第二个是使用 jQuery 在元素内创建图表。更改它，因此您将拥有 可变chart ，您将能够设置新选项，例如 chart.options.chart.options3d.beta = this.value; .无论如何，我很确定你在JS控制台中有一些错误。