猿问

无法修改作为全局变量初始化的 highcharts

我在玩highcharts。现在我知道我想要什么了,我试图创建一个简单的逻辑来动态更新数据(xaxis 类别)及其系列。但我被困在基础知识上。我无法从一个简单的函数访问 highchart,尽管它是一个全局变量。


    <script>


        var myChart;

        $(document).ready(function() {

            init();

        });


        function init(){

            myChart = $('#graph-container').highcharts({

                title: {

                    text: 'Dummy Title'

                },

                xAxis: {

                    categories: ['Dummy1', 'Dummy2']

                },

                series: []

            });

        }


        function onclickButton(){

            //myChart.xAxis[0].setCategories(['A','B']);

            myChart.addSeries({

                    name: 'John',

                    data: [['A',1], ['B',2]]

                });

        }

    </script>

</head>

<body>

    <div id="graph-container" style="width:100%; height:400px;"></div>

    <input type="button" value="Click me" onclick="onclickButton()">

</body></html>

它说 xAxis 未定义,或者 addSeries 函数不存在。我究竟做错了什么?


浮云间
浏览 156回答 1
1回答

守候你守候我

结帐我的snipet,希望它可以帮助你。祝你今天过得愉快!<html><head>&nbsp; <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>&nbsp; <script src="https://code.highcharts.com/highcharts.js"></script>&nbsp; <script>&nbsp; &nbsp; var myChart;&nbsp; &nbsp; $(document).ready(function() {&nbsp; &nbsp; &nbsp; init();&nbsp; &nbsp; });&nbsp; &nbsp; function init() {&nbsp; &nbsp; &nbsp; myChart = Highcharts.chart('graph-container', {&nbsp; &nbsp; &nbsp; &nbsp; title: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text: 'Dummy Title'&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; xAxis: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; categories: ['Dummy1', 'Dummy2']&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; series: []&nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; }&nbsp; &nbsp; function onclickButton() {&nbsp; &nbsp; &nbsp; myChart.addSeries({&nbsp; &nbsp; &nbsp; &nbsp; name: 'John',&nbsp; &nbsp; &nbsp; &nbsp; data: [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ['A', Math.floor(Math.random() * 10)],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ['B', Math.floor(Math.random() * 10)]&nbsp; &nbsp; &nbsp; &nbsp; ]&nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; }&nbsp; </script></head><body>&nbsp; <div id="graph-container" style="width:100%; height:400px;"></div>&nbsp; <input type="button" value="Click me" onclick="onclickButton()"></body></html>
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答