-
Suggestion
-
Resolution: Fixed
-
P3: Somewhat important
-
None
-
None
-
028dbbb4d (dev)
While we understandably do not recommend excessive numbers of rows/columns, Bars3D can still have better (and configurable) ways to space/layout its visual elements.
Code
(Adapted from https://doc.qt.io/qt-6/qml-qtgraphs-bars3d.html#details)
import QtQuick import QtQuick.Controls.Basic import QtGraphs ApplicationWindow { id: root width: 800 height: 600 visibility: Window.FullScreen visible: true property int year: 2024 header: Row { spacing: 10 Button { text: "More Data" onClicked: { for (let i = 0; i < 5; ++i) { dataModel.append({ year: root.year, city: "Oulu", expenses: 4000 }) dataModel.append({ year: root.year, city: "Helsinki", expenses: 8000 }) root.year += 1 } } } Column { Label { text: "Zoom level: " + bars.cameraZoomLevel } Label { text: "Label count:" + bars.rowAxis.labels.length } } Slider { id: thicknessSlider from: 0.1 value: 1 to: 10 } Switch { id: spacingRelativeSwitch text: "Spacing Relative" } } ListModel { id: dataModel ListElement{ year: 2022; city: "Oulu"; expenses: 4000; } ListElement{ year: 2022; city: "Helsinki"; expenses: 8000; } ListElement{ year: 2023; city: "Oulu"; expenses: 4000; } ListElement{ year: 2023; city: "Helsinki"; expenses: 8000; } } Bars3D { id: bars anchors.fill: parent barSpacingRelative: spacingRelativeSwitch.checked barThickness: thicknessSlider.value Bar3DSeries { itemLabelFormat: "@colLabel, @rowLabel: @valueLabel" ItemModelBarDataProxy { itemModel: dataModel columnRole: "city" rowRole: "year" valueRole: "expenses" } } } }
Steps to reproduce
- Run the code above
- Rotate the camera around and zoom in/out to try to read the labels
- Click "More Data" to add more data (the "Label count" will increase)
- Repeat Steps #2 and #3 several times
Outcomes/Observations
Label count | Observations |
---|---|
2 | The label widths are too tiny with respect to the bar widths |
12 | The label widths and bar widths are more balanced now |
52 | The labels are starting to meld into each other. The bars are too tall with respect to their widths |
102 | Most labels can no longer be read |
In general, as more rows/columns are added, the bar widths get smaller and smaller, while the bar heights remain unchanged (as if to make them fit inside a fixed bounding box/volume)
Note: By setting a high value for Bars3D.barThickness and by enabling Bars3D.barSpacingRelative, we can move the "Oulu" and "Helsinki" labels apart from each other when the row/column count is high. However, there is no equivalent option for moving the year labels apart.
Suggestions
- By default, the label sizes should be relative to the bar sizes.
- When more rows/columns are added, instead of making the bar widths smaller, there should be an option to keep the bar widths unchanged while expanding the "bounding box". In tandem, there should be an option to pan/traslate the camera (using a WasdController, for example)
For Gerrit Dashboard: QTBUG-129371 | ||||||
---|---|---|---|---|---|---|
# | Subject | Branch | Project | Status | CR | V |
596887,11 | Add label relative sizing | dev | qt/qtgraphs | Status: MERGED | +2 | 0 |