Wie deaktiviert man einige Streams standardmäßig in einem nvd3 Simple Liniendiagramm?

Question

Ich habe mehrere Zeilen und ich weiß, dass das Klicken auf den "Punkt" in der Legende es verstecken/anzeigen wird.

Ich muss jedoch damit beginnen, dass einige der Linien deaktiviert sind und nicht angezeigt werden, und der Benutzer muss auf den Punkt in der Legende klicken, um ihn in der Grafik anzuzeigen.

(zB. Ich grafisch die Anzahl der Fragen über Stackoverflow pro Sprache, aber mit C, PHP und Javascript standardmäßig deaktiviert). Das Diagramm zeigt nur Python, Ruby ... aber auf der Legende, haben Sie alle Sprachen, einschließlich C, PHP und Js mit diesen 3 deaktiviert werden.

Ich habe keine Methode/Attribut für jede Datenreihe gefunden, um den Standard-Show/Hide-Status festzulegen. Fehle ich etwas?

Answer 1

Für jede Ihrer Datenreihe, die Sie deaktiviert möchten, gehen Sie einfach:

series.disabled=true 

nvd3 nicht alles tun, aber wenn Sie bereit sind, um den Code zu lesen ist es eigentlich recht flexibel. Ich entdeckte diese durch diese Zeile in der Quelle von mehreren der Chart-Modelle zu finden:

state.disabled = data.map(function(d) { return !!d.disabled }); 

Answer 2

NVD3 ist nicht wirklich flexibel genug dafür - Sie verpassen nichts, das können Sie nicht tun (zumindest nicht out of the box). Sie müssten diese Funktionalität selbst implementieren oder einfach alte D3 verwenden.

Answer 3

Sie mit einem versteckten Chart beginnen könnte und so etwas wie dies versuchen:

// Array of series you want to hide 
var hidden = [0, 2]; 

// Dispatch click event to each element 
var e = document.createEvent('UIEvents'); 
e.initUIEvent('click', true, true); 
d3.select('.nv-legend') 
    .selectAll('.nv-series') 
    .filter(function(d, i){return hidden.indexOf(i) !== -1;}) 
    .node() 
    .dispatchEvent(e); 

Sobald dies abgeschlossen ist, blenden Sie das Diagramm und die Serie wird deaktiviert.

Answer 4

Sie ändern können, welche Ströme aktiviert/deaktiviert durch die chart.state() Objekt. Zum Beispiel:

// Assuming your chart is called 'chart' 
var state = chart.state(); 

for(var i=0; i < state.disabled.length; i++) { 
    state.disabled[i] = ...LOGIC RETURNING TRUE OR FALSE...; 
} 

chart.dispatch.changeState(state); 
chart.update(); 

Answer 5

Nachdem diese Antwort Lesen hatte ich noch etwas mehr Lesung zu tun, um für mich zu verstehen, wie ein Strom von meinem JSON-Daten-Stream für die Graphen deaktiviert einzustellen.

Das Beispiel unten ist, was es für mich gelöst Behinderte: true

{ 
    key: "something", 
    disabled: true, 
    values: [...] 
    }