Question

我在执行此代码时遇到了一些错误。我不知道是什么原因。我在尝试在我的项目中用asp.net实现3D柱形图。我得到了图表但是在调整3D的角度时，即 Alpha Angle和Beta Angle图表确实重新划分。请检查我的代码并帮助我。请。我的代码：
$（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

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

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

在使用时：

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

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

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

1 个答案: