круговая диаграмма Рафаэля всегда синяя, когда есть только 1 значение (как установить цвет круговой диаграммы с одним срезом)

У меня проблема с круговыми диаграммами Рафаэля. Данные, которые я использую, являются динамическими, и в некоторых случаях возвращается только 1 значение, что означает, что вся диаграмма заполнена, поскольку это ЕДИНСТВЕННЫЙ срез. Проблема в том, что когда есть только 1 значение, оно игнорирует мое цветовое обозначение.

Например: Ниже показано создание круговой диаграммы Рафаэля с 2 значениями, и каждый фрагмент имеет соответствующий цвет, указанный в разделе «цвета»:

var r = Raphael("holder");  
r.piechart(160, 136, 120, [100,200],{colors: ["#000","#cecece"]});

Это отлично работает, и я получаю два среза подходящего размера, один черный и один серый.

Однако в приведенном ниже примере создается один полный круговой круг, ВСЕГДА заполненный синим цветом, независимо от моих настроек цвета.

var r = Raphael("holder");  
r.piechart(160, 136, 120, [100],{colors: ["#000"]});

В этой ситуации мне действительно нужно, чтобы этот полный пирог был черным, так как он установлен в "цветах"

Я что-то не так делаю или это ошибка?


pie-chart raphael graphael
person livinzlife    schedule 03.06.2012    source источник

Ответы (3)


arrow_upward
2
arrow_downward

INMO - это ошибка, потому что когда у пирога был только один кусок, его цвет жестко закодирован ...

Вот как я это решил (все, что я сделал, это использовал colors arg, если он существует ...)

в g.pie.js после строки 47 добавьте это

var my_color =  chartinst.colors[0];
if(opts.colors !== undefined){
    my_color =  opts.colors[0];
}

затем в следующей строке (строка 48 в исходном файле js)

series.push(paper.circle(cx, cy, r).attr({ fill: chartinst.colors[0]....

замените chartinst.colors[0] на my_color

это оно

   if (len == 1) {
        var my_color =  chartinst.colors[0];
        if(opts.colors !== undefined){
            my_color =  opts.colors[0];
        }
        series.push(paper.circle(cx, cy, r).attr({ fill: my_color,   ....
person Daniel    schedule 12.06.2012

arrow_upward
0
arrow_downward

Вы, вероятно, догадались об этом самостоятельно, поскольку этому вопросу уже исполнился день ... но вы можете «обмануть» Рафаэля в визуализации черной единицы с помощью наборов данных в специальном регистре, равных единице, чтобы добавить бесконечно малое значение секунды. Итак, учитывая массив данных с вашими точками данных ...

if ( data.length == 1 )
    data.push( 0.000001 );

canvas.piechart(250, 250, 120, data, {colors: ["#000", "#CECECE", "#F88" /*, ... */ ] });

Крошечная полоска по-прежнему будет отображаться как однопиксельная линия в положении 180 градусов, но вы, вероятно, могли бы обмануть это, поиграв со своей цветовой палитрой.

Да, это уловка. Я не считаю, что поведение gRaphael настолько ошибочно, насколько плохо реализовано (одноэлементные наборы данных, очевидно, имеют особый корпус, поскольку они создают круг вместо пути, как во всех других случаях).

person Kevin Nielsen    schedule 04.06.2012

arrow_upward
0
arrow_downward

Простой способ для меня без редактирования g.pie.js

var r = Raphael('st_diagram');

r.piechart(140, 140, 137, 100, 0.0001],{

        colors:['#9ae013','#9ae013'],
        strokewidth: 0
    });
person megajoe    schedule 29.01.2014