На моем графике отсутствуют цвета. js, мои данные выглядят нормально, но цвета нет - PullRequest
Новая
       8

На моем графике отсутствуют цвета. js, мои данные выглядят нормально, но цвета нет

0 голосов
/ 17 февраля 2020

Я сделал свой первый бар с библиотекой Chart. js. Мои данные выглядят неплохо, но я не могу дать своему ценному цвету немного цвета.

введите описание изображения здесь

Моя функция выглядит так: 

var $barData = 
{
    type: 'bar',
    labels: ['Super mad', 'Middel', 'Ikke ok', 'Gennemsnit'],
    datasets: 
    [
        {
            label: 'Antal stemmer',
            data: [
            [$arrStemmer[0]], 
            [$arrStemmer[1]], 
            [$arrStemmer[2]], 
            [$Snit_Vaerdi]
            ],

            backgroundColor: [
            'rgba(255, 99, 132, 0.2)',
            'rgba(54, 162, 235, 0.2)',
            'rgba(255, 206, 86, 0.2)',
            'rgba(75, 192, 192, 0.2)'
            ],
            borderColor: [
            'rgba(255, 99, 132, 1)',
            'rgba(54, 162, 235, 1)',
            'rgba(255, 206, 86, 1)',
            'rgba(75, 192, 192, 1)'
            ],
            borderWidth: 1
        }

    ]
}

// Hent graf initialiserings setup
var $Stemmer = document.getElementById("can_afstemning_graf").getContext("2d");
// Tegn graf, men data fra barData objektet
new Chart($Stemmer).Bar($barData);

Чего мне не хватает? Я смотрю здесь в документации, и это выглядит хорошо: https://www.chartjs.org/docs/latest/.

Спасибо, Ненад

Ответы [ 2 ]

1 голос
/ 17 февраля 2020

Вы устанавливаете данные неправильно.

Вы должны использовать 

data: [
    $arrStemmer[0], 
    $arrStemmer[1], 
    $arrStemmer[2], 
    $Snit_Vaerdi
],

вместо 

data: [
    [$arrStemmer[0]], 
    [$arrStemmer[1]], 
    [$arrStemmer[2]], 
    [$Snit_Vaerdi]
],
0 голосов
/ 19 февраля 2020

Это должно работать. если заполнены $arrStemmer и $snit_Vaerdi. 

let $stemmer = document.getElementById('can_afstemning_graf').getContext('2d');

let myChart = new Chart($stemmer, {
    type: 'bar',
    data: {
        labels: ['Super mad', 'Middel', 'Ikke ok', 'Gennemsnit'],
        datasets: [{
            label: 'Antal stemmer',
            data: [
                $arrStemmer[0],
                $arrStemmer[1],
                $arrStemmer[2],
                $Snit_Vaerdi
            ],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)'
            ],
            borderColor: [
                'rgba(255, 99, 132, 1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }
});
...