как изменить цветовую базу бара Морриса на значение ключа серии? - PullRequest
Новая
       9

как изменить цветовую базу бара Морриса на значение ключа серии?

0 голосов
/ 09 мая 2018

Я пытаюсь установить собственный цвет для гистограммы в morris.js. Но в моем коде это только изменить текст метки наведения.

Вот мой код: 

    var chart = Morris.Bar({
        element : 'morris-bar-chart',
        data : [ {y : '2006-05-01', user : 1, beed : 90 }, 
                 {y : '2006-05-01', user : 2, beed : 80 }, 
                 {y : '2006-05-01', user : 3, beed : 70 }, 
                 {y : '2006-05-02', user : 1, beed : 190}, 
                 {y : '2006-05-02', user : 1, beed : 290}, 
                 {y : '2006-05-01', user : 2, beed : 90 }, 
                 {y : '2006-05-02', user : 3,beed : 90  } ],
        barColors : function(row, series, type) {
        console.log("--> "+row.label, series, type); // output in console
            if (series.key == 'user' || series.key == 'beed') { // Doesn't work if series.key == 'beed' not included in if condition. 
                if (row.y == '1')
                    return "#1AB244"; // green
                else
                    return "#fec04c"; // orange
            }
        },
        xkey : 'y',
        ykeys : [ 'user', 'beed' ],
        labels : [ 'User: ', 'Beed: ' ],
        xLabelAngle : 45,
        hideHover : 'auto',
        resize : true,
        stacked : true
    });

Я знаю, что намного проще изменить цвет линейчатого символа, изменив xkey на значение 'user' , затем использовал код ниже: 

barColors: function (row, series, type) {
if(row.label == "1") return "#1AB244"; // green
else return "#fec04c"; // orange
}

Но я хочу изменить цвет всего столбчатого графика, где 'y' - это xkey, где все пользователи, равные '1' , установлены на зеленый color, тогда остальная часть гистограммы установлена ​​на оранжевый цвет. Возможно ли это достичь?

1 Ответ

0 голосов
/ 18 мая 2018

Полагаю, проще сначала определить массив цветов, используя javascript, проверив ваш набор данных, а затем примените его через параметр barColors .

...