Ich verwende flot Bibliothek, um ein Balkendiagramm zu erstellen. Ich muss für jeden Balken unterschiedliche Breiten einstellen. Ich bin ziemlich neu zu flot und Javascript im Allgemeinen, also würde ich mich nicht herum hacken wollen.So legen Sie verschiedene Breiten für Balken in Balkendiagramm fest
Gibt es einen sauberen Weg, das zu tun?
Sie können dies tun, indem Sie die Stileigenschaften von Canvas mit dem Klassennamen flot-base bearbeiten. Fügen Sie dieser Klasseneigenschaft im HTML eine zusätzliche CSS-Klasse hinzu, oder führen Sie sie dynamisch mit Javascript aus. Um dies zu tun, können Sie add it to the classList, bearbeiten Sie die Stileigenschaften oder verwenden Sie die jquery addClass method.
Zum Beispiel, wenn Ihr flicht Code in das DOM geladen ist, können Sie die richtige Leinwand Zugriff mit:
var myFlot = document.querySelector('.flot-base');
myFlot.style.display.width = '1200px';
myFlot.style.display.height = '500px';
// alternative: myFlot.classList.add('cssClassWithCorrectDimensions');
Edit: es ist möglich, dass ich Ihre Frage falsch verstanden, und Sie dazu gedacht, die einzelnen Stäbe in ein Balkendiagramm. In diesem Fall: Es tut mir leid. : p
Ich hoffe, das hat dir geholfen. :-)
Können Sie mir einen Einblick in Ihre Idee bei der Implementierung von JavaScript geben? –
Das Ändern des Canvas-Stils wirkt sich nicht auf die einzelnen Balken im Diagramm aus. – Raidri
Ich habe meinen ursprünglichen Beitrag bearbeitet. Hilft Ihnen das weiter? –
Probieren Sie es zuerst aus, dann stellen Sie spezifische Fragen hier. –
Die Frage scheint ziemlich spezifisch und völlig verständlich für einen Neuling zu sein, sich nicht so zurecht zu finden, wie in den meisten Flotbeispielen ein solcher Fall nicht behandelt wird. Fühlen Sie sich frei, mich falsch zu beweisen. – LetsPlayYahtzee
Unterschiedliche Balkenbreiten in einer Datenserie sind nicht möglich, ohne den internen Code des Plugins zu ändern. Sie können Ihre Datenreihen in mehrere Serien aufteilen, eine pro benötigte Balkenbreite. – Raidri