2017-11-14 10 views
0

Für Grafik in C3, können wir es geben Spalte Daten, die ein Array von Arrays mit jedem Array ist eine andere Linie auf dem Diagramm wie in diesem C3 docs example. Aber gibt es eine Möglichkeit, diese Spalte Daten spärlich? Ich erhalte einen Fehler, wenn ich das versuche, obwohl ich mir nicht sicher bin, ob es einen Workaround gibt, von dem ich nichts weiß.Wie sparse Arrays mit C3-Charts verwenden?

Wenn nicht, gibt es eine bessere Möglichkeit, zwischen spärlichen und dichten Arrays als eine Filterfunktion wie das, was ich habe, zu konvertieren?

https://jsfiddle.net/dbkidd/majx8byn/

var columnData = [] 

var entry1 = ['data1', 30, 200, 100, 400, 150, 250]; 
var entry2 = ['data2', 50, 20, 10, 40, 15, 25]; 

columnData[0] = entry1; 
columnData[3] = entry2; 
console.log('columnData - sparse format', JSON.stringify(columnData)); 

function checkIfUndefined(x) { 
    return (x !== undefined); 
} 

function sparseToDense(data) { 
    return data.filter(checkIfUndefined); 
} 

/* If you comment out this sparseToDense conversion, it breaks 
* with the following error: 
* c3.js:5403 Uncaught TypeError: Cannot read property '0' of undefined 
*/ 
columnData = sparseToDense(columnData); 
console.log('columnData - dense format', JSON.stringify(columnData)); 

var chart = c3.generate({ 
    data: { 
     columns: columnData, 
     axes: { 
      data1: 'y', 
      data2: 'y2' 
     } 
    }, 
    axis: { 
     y2: { 
      show: true 
     } 
    } 
}); 

Antwort

1

können Sie leeres Array als Eingabewert verwenden. Dies funktioniert ok:

[["data1",30,200,100,400,150,250],[],[],["data2",50,20,10,40,15,25]] 

Und Ihre Filterfunktion ändern Arrays ohne Länge überspringen:

function checkIfNull(x) { 
    return (x.length); 
} 

Siehe updated fiddle

+0

Nice! Danke - ich werde das tun – Dallas