Kontrollabstand um gestapelte Balken mit chartist.js

Question

Ich zeichne ein horizontales Stackedbar-Diagramm. Ich möchte den Raum über und unter jedem Balken kontrollieren. Sie können die Höhe der einzelnen Balken geben sich durch die Verwendung:

.ct-bar{ 
    stroke-width: 30px; 
} 

jedoch chartist scheint um jeden Stapel, den Raum zu bestimmen, basierend Sie auf der Höhe für die gesamte Grafik angegeben. Stattdessen möchte ich die Höhe um jeden Stapel angeben und die Höhe des Diagramms basierend auf der Anzahl der zu zeichnenden Balken erhöhen.

Ich habe die API/Dokumentation von Chartisten angeschaut, aber ich kann die Einstellung nicht finden, die ich suche. Ich habe auch versucht, die Höhe für den Graphen nicht zu setzen, aber dann würde Chartist nur die volle verfügbare Höhe benutzen und die Stäbe immer noch auf der verfügbaren Höhe aussparen.

Gibt es eine Möglichkeit, den Abstand um Balken zu steuern (nicht die Balkenbreite selbst?).

EDIT: Ein Beispiel von dem, was ich zu tun versuchen, ist dies: https://gionkunz.github.io/chartist-js/examples.html#stacked-bar In diesem gestapeltes Balkendiagramm Sie Q1 sehen, Q2, Q3, usw. ich die Menge an Speicherplatz steuern möchten, dass jeder dieser nimmt oben, anstatt es durch Chartist automatisch bestimmen zu lassen.

Answer 1

Also ohne den Code habe ich gerade den horizontalen Barcode Beispiel auf dem Examples Abschnitt der Website abgearbeitet.

Die Linien sind SVGs, die als Rechtecke mit x & y Attribute angegeben

<line y1="29.0892857142857" y2="29.0892857142857" x1="80" x2="289.1640625" class="ct-bar" value="5"></line> 

So erstellt werden, wenn Sie es ändern möchten, nachdem sie bereits mit dem Rahmen berechnet worden ist Sie eine CSS übersetzen Funktion nutzen zu können. Hier stelle ich nur Serie B ein, so dass der 1. Satz der horizontalen Balken unverändert bleibt.

.ct-series-b .ct-bar { 
    transform: translateY(-4px); 
} 

Hier einige Dokumentation auf MDN für CSS3 transform: translate.