Как передать данные серии в опцию echart, используя функцию jquery - PullRequest
0 голосов
/ 10 июля 2019

Мне нужна динамическая гистограмма с использованием электронных карт. Я пытаюсь передать значение серии с помощью функции jquery, но оно не принимается. Вот мой код -

var data="[{name:'Complete Project', type:'bar', data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]},{name:'New Project', type:'bar', data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]}]";

getBarGraph(data);

и код инициализации echart -

       function getBarGraph(data){                
            var dom = document.getElementById("echart-bar");
            var myChart = echarts.init(dom);

            option = null;
            option = {
                tooltip : {
                    trigger: 'axis'
                },
                xAxis : [
                    {
                        type : 'category',
                        data : ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']
                    }
                ],
                yAxis : [{ type : 'value' }],
                series : data
          };

            if (option && typeof option === "object") {
                myChart.setOption(option, true);
            }
       }

но в браузере нет результата. Так как я могу передать значение серии?

Заранее спасибо

1 Ответ

0 голосов
/ 10 июля 2019

Попробуйте приведенный ниже код. Это будет работать. Я добавил детали в комментариях.

Out Put прикреплен. https://www.screencast.com/t/3yLCOmRVa

<!doctype html>
        <html>
        <head>
            <title>ECharts Sample</title>
            <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
        </head>
        <body>
            <div id="echart-bar" style="width: 500px; height: 350px;"></div>
            <script>

            //You need to quote your labels, otherwise will get an unexpected token in JSON
            var series='[{"name":"Complete Project", "type":"bar", "data":[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]},{"name":"New Project", "type":"bar", "data":[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]}]';

            //Call the function 
            getBarGraph(series);

            function getBarGraph(data){
                var dom = document.getElementById('echart-bar');
                var myChart = echarts.init(dom);
                var option = {
                    title: { text: 'ECharts Sample' },
                    tooltip : {
                        trigger: 'axis'
                    },

                     xAxis : [
                        {
                            type : 'category',
                            data : ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']
                        }
                    ],
                    yAxis : [{ type : 'value' }],

                    //Use the JavaScript function JSON.parse() to convert text into a JavaScript object:
                    series: JSON.parse(data),
                };
                myChart.setOption(option);

            }
            </script>
        </body>
        </html>
...