C3: Zeilenumbruch in x-Achsen-Tick-Text erzwingen

Erstellt am 17. Okt. 2014  ·  9Kommentare  ·  Quelle: c3js/c3

Hallo

http://jsfiddle.net/gbdtjsba/11/

Ich habe ziemlich lange Beschriftungen in meinem Diagramm. Ich habe dem Diagramm eine harte Höhe von 500px und der x-Achse 200px hinzugefügt, was funktioniert, aber ich möchte die Achsenhöhe nach Möglichkeit dynamisch gestalten.

Sollte ich die Beschriftungen durchlaufen, um die größte zu finden und ihre Breite zu berechnen, bevor die Grafik angewendet wird, oder hat c3 eine Funktion, die dies kann?

Könnte mit diesem zusammenhängen: https://github.com/masayuki0812/c3/issues/527

Danke für eine tolle Bibliothek, sie hat mir bisher viele Stunden d3-Programmierung erspart :)

C-feature-request

Hilfreichster Kommentar

Es scheint nicht in Geigen zu arbeiten. Wie wäre es mit dem tatsächlichen Code? Für mich geht das. Und bitte stellen Sie axis.x.tick.multiline = false , dass es als eine Zeile angezeigt wird. Jetzt ist Multiline Standard.

Ich denke, es erscheint sinnvoll, etwas einzuführen, um Zeilenumbrüche zu erzwingen. Werde ich bei Bedarf umsetzen.

Alle 9 Kommentare

Hallo, vielen Dank für Ihre Berichterstattung. Ich denke, dieser Commit ermöglicht es, die Höhe der x-Achse automatisch zu berechnen. Könnten Sie also den neuesten Code erneut versuchen? Danke.

AKTUALISIEREN:
Ich habe axis.x.tick.width , um mehrzeiligen Tick-Text zu unterstützen, also setzen Sie jetzt bitte diese Option null . Andernfalls wird der Häkchentext in mehrere Zeilen aufgeteilt, auch wenn sie gedreht werden.

Hallo,

Danke für dein Update, ich glaube leider nicht, dass es funktioniert -

  1. http://jsfiddle.net/gbdtjsba/15 - Ohne die 200px x Achsenhöhe (die ich versuche zu entfernen) sind die Ergebnisse die gleichen wie zuvor. Versuchen Sie, die Größe des Diagramms zu ändern, um inkonsistentes Verhalten zu sehen.
  2. http://jsfiddle.net/gbdtjsba/11 - Beim Laden scheint die x-Achse die falsche Höhe zu haben, aber dies wird behoben, wenn Sie die Größe ändern. Diese Version hat immer noch eine Höhe von 200px auf der x-Achse, und ich denke, sie wird auf diese Höhe zurückgesetzt, nicht auf eine berechnete.

Ich denke, was passieren muss, ist zum Beispiel, dass das Diagramm eine Höhe von 500 Pixel hat, die Achsenstriche eine maximale Breite/Höhe von 125 Pixeln haben, sodass das Diagramm automatisch eine Höhe von 375 Pixeln und eine Beschriftung von 125 Pixeln erhält. Oder, wenn Sie es vorziehen / als Option, die Möglichkeit, die Grafikhöhe auf 500px einzustellen und die Gesamthöhe einschließlich der Beschriftungen auf 625px zu erhöhen.

Etiketten auf 1+ Zeilen ist großartig. Ist es möglich, Zeilenumbrüche zu erzwingen? Zum Beispiel 2014-10-22 \n 2014-10-15 \n 2014-10-08 ?

Es scheint nicht in Geigen zu arbeiten. Wie wäre es mit dem tatsächlichen Code? Für mich geht das. Und bitte stellen Sie axis.x.tick.multiline = false , dass es als eine Zeile angezeigt wird. Jetzt ist Multiline Standard.

Ich denke, es erscheint sinnvoll, etwas einzuführen, um Zeilenumbrüche zu erzwingen. Werde ich bei Bedarf umsetzen.

Ich denke, es erscheint sinnvoll, etwas einzuführen, um Zeilenumbrüche zu erzwingen. Werde ich bei Bedarf umsetzen.

Ja. Erforderlich.

irgendwelche Pläne dafür?

@laurabrooks Ich bin mir nicht sicher, was Sie mit "diesem" axis.x.tick.multiline wurde für eine Weile implementiert und ich habe kürzlich Unterstützung für axis.x.tick.multilineMax und Dokumentation für beide hinzugefügt (siehe hier ), hoffentlich hilft das.

Ich habe mich gefragt, ob ich an einer bestimmten Stelle im Etikettentext einen Zeilenumbruch erzwingen soll. Multiline- und multilineMax-Attribute werden jedoch die Arbeit erledigen, danke für die Antwort @jcsmorais

Hey, gibt es eine Vorkehrung für mehrzeilige Achsenbeschriftungen?

Ich schließe dieses Problem, da bereits mehrzeilige Optionen vorhanden sind. Bitte beachten Sie die Dokumente, die von @jcsmorais angegeben wurden.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen