gestapelt Balkendiagramm in dimple.js

Question

Ich bin neu in dimple.js und d3. Für eines meiner Testausführungsberichtswerkzeuge muss ich ein Diagramm anzeigen, das den Ausführungsstatus darstellt. Dieses Diagramm sollte vom Typ stacked bar chart sein.

My Abtastdaten als unten,

var data = [{ 
       "run-id": 25, 
       "TotalCount": 100, 
       "Pass": 50, 
       "Fail": 30, 
       "Skip": 20 
     }, { 
       "run-id": 26, 
       "TotalCount": 50, 
       "Pass": 35, 
       "Fail": 15, 
       "Skip": 5 
     }, { 
       "run-id": 27, 
       "TotalCount": 60, 
       "Pass": 40, 
       "Fail": 5, 
       "Skip": 15 
     }]; 

Ich möchte mit 3 bar das Ausgabetabelle als gestapeltes Balkendiagramm haben (für die obigen Daten), eine für jeden Durchlauf-IDs. Auch einzelne Anzahl (pass | fail | Skip) sollte in seinem Balkendiagramm Bereich geschrieben werden (innen)

Ich bin neu in dimple.js und in Ramp-up-Phase. Versuchte folgende Lösung, aber das hat nicht funktioniert.

chart = new dimple.chart(svg, data); 
chart.addCategoryAxis("x", "run-id"); 
chart.addMeasureAxis("y", "TotalCount"); 
series = chart.addSeries(["Pass", "Fail","Skip"], dimple.plot.bar); 
chart.draw() 

Kann jemand Hilfe/Hinweis mich vorwärts zu bewegen?

Answer 1

Soweit ich weiß, müssen Sie Ihre Daten formatieren, damit Sie Stack-Bar generieren können. Ich habe eine aktualisierte Version Ihrer Daten hinzugefügt und eine gestapelte Leiste für Sie erstellt. check here for writing value in bar

StackBar