2016-05-03 10 views
0

https://github.com/GraFiddle/angular-chartKann ich eine Datenpunktfarbe mit einer Funktion definieren, wenn ein Winkel-Diagramm verwendet wird?

In der C3-Bibliothek gibt es eine Probe für datenabhängige Farbe (http://c3js.org/samples/data_color.html):

var chart = c3.generate({ 
    data: { 
     ..., 
     color: function (color, d) { 
      // d will be 'id' when called for legends 
      return d.id && d.id === 'data3' ? d3.rgb(color).darker(d.value/150) : color; 
     } 
    } 
}); 

Also dachte ich, ich color Funktion hinzufügen würde:

dims = { 
    dt: { 
     axis: 'x', 
     name: 'Date', 
     displayFormat: '%H:%M:%S', 
     dataType: 'datetime' 
    } 
    }; 

    // key is something like errorRate etc. 
    dims[key] = { 
    axis: 'y', 
    name: key, 
    type: 'line', 
    color: function(color, d) { 
     return console.log(arguments); 
    } 
    }; 

Aber Die Farbfunktion scheint ignoriert zu werden. Gibt es eine Möglichkeit, mit dieser Bibliothek eine funktionsabhängige Farbe zu erzeugen?

Antwort

0

ich es schaffte, um mit Winkeldiagramm zu arbeiten:

# coffeescript 
graphOptions = 
    data: datapoints 
    dimensions: dims 
    chart: 
    data: 
     color: (color, d) -> 
     if d.index? and data[d.index]? 
      return colors[data[d.index].status] 
     else return color 

Diese Funktion gibt Werte aus dem Farben-Hash basierend auf dem Wert im Feld status des Datenpunkts zurück.