Диаграммы Google не показывают все настроенные столбцы - PullRequest
Новая
       87

Диаграммы Google не показывают все настроенные столбцы

0 голосов
/ 05 августа 2020

Я использую диаграммы Google и пытаюсь показать панель «Переговоры», как вы можете видеть в коде, хотя я вставил ее в массив, и она не отображается на графике:

Что мне здесь не хватает? 

  google.charts.load('current', {packages: ['corechart']});   
            function drawChart() {
                var data = google.visualization.arrayToDataTable([
                    ['Negotiation',' Creativity ',' People Management ',' Coordination with Others ',' Orientation to serve ',' Emotional Intelligence ',' Complex Problem Solving ',' Cognitive Flexibility ',' Critical Thinking ',' Taking of Decisions'],
                    ['Líder ',      3, 2, 5,   1 ,3.2, 3.3, 3.1,2.4 ,2.5 ],
                    ['Colaborador', 2, 3, 2.5, 5 ,2.2, 5.1 ,3.6,2.1 ,3 ], 
                ]);
                var options = {
                    title : 'Talento bahia',
                    legend: {position: 'right', textStyle: {color: 'black', fontSize: 11}},
                    vAxis: {title: 'Pontuação'},
                    seriesType: 'bars',
                    series: {
                        0: { color: '#631E80' },
                        1: { color: '#FCE22B' },
                        2: { color: '#4A308B' },
                        3: { color: '#011F9B' },
                        4: { color: '#C81212' },
                        5: { color: '#AF3423' },
                        6: { color: '#247D4B' },
                        7: { color: '#23B634' },
                        8: { color: '#5EC4FF' },
                        9: { color: '#F15757' }
                    }
                };
                var chart = new google.visualization.ComboChart(document.getElementById('container'));
                chart.draw(data, options);
            }
            google.charts.setOnLoadCallback(drawChart);
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta charset="utf-8"/>
        <script type = "text/javascript" src = "https://www.gstatic.com/charts/loader.js"></script>
    </head>
    <body>
        <div id = "container" style = "width: 990px; height: 400px; margin: 0 0 -100px 0 auto"></div>

1 Ответ

0 голосов
/ 05 августа 2020

вам не хватает некоторых данных ...

первый элемент в массивах имен столбцов, как в спецификации массива: 

 ['LABELS', 'Negotiation',' Creativity ',' People Management ',' Coordination with Others ',' Orientation to serve ',' Emotional Intelligence ',' Complex Problem Solving ',' Cognitive Flexibility ',' Critical Thinking ',' Taking of Decisions']

И ваши 2 массива значений данных имеют только 9 значений каждое .. в примере я добавляю еще одно значение => 15 

['Líder ',      15, 3, 2, 5,   1 ,3.2, 3.3, 3.1,2.4 ,2.5 ],
['Colaborador', 15, 2, 3, 2.5, 5 ,2.2, 5.1 ,3.6,2.1 ,3 ], 


  google.charts.load('current', {packages: ['corechart']});   
            function drawChart() {
                var data = google.visualization.arrayToDataTable([
                    ['LABELS', 'Negotiation',' Creativity ',' People Management ',' Coordination with Others ',' Orientation to serve ',' Emotional Intelligence ',' Complex Problem Solving ',' Cognitive Flexibility ',' Critical Thinking ',' Taking of Decisions'],
                    ['Líder ',      15, 3, 2, 5,   1 ,3.2, 3.3, 3.1,2.4 ,2.5 ],
                    ['Colaborador', 15, 2, 3, 2.5, 5 ,2.2, 5.1 ,3.6,2.1 ,3 ], 
                ]);
                var options = {
                    title : 'Talento bahia',
                    legend: {position: 'right', textStyle: {color: 'black', fontSize: 11}},
                    vAxis: {title: 'Pontuação'},
                    seriesType: 'bars',
                    series: {
                        0: { color: '#631E80' },
                        1: { color: '#FCE22B' },
                        2: { color: '#4A308B' },
                        3: { color: '#011F9B' },
                        4: { color: '#C81212' },
                        5: { color: '#AF3423' },
                        6: { color: '#247D4B' },
                        7: { color: '#23B634' },
                        8: { color: '#5EC4FF' },
                        9: { color: '#F15757' }
                    }
                };
                var chart = new google.visualization.ComboChart(document.getElementById('container'));
                chart.draw(data, options);
            }
            google.charts.setOnLoadCallback(drawChart);
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta charset="utf-8"/>
        <script type = "text/javascript" src = "https://www.gstatic.com/charts/loader.js"></script>
    </head>
    <body>
        <div id = "container" style = "width: 990px; height: 400px; margin: 0 0 -100px 0 auto"></div>
...