Customize Bar-series and BarCategoryAxis in QML - qt

Question

I need to customize the BarCategoryAxis labels and BarSeries. Following is the code:
import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Controls 2.0
import QtCharts 2.2
ApplicationWindow {
id: window
width: 640
height: 480
visible: true
ChartView {
id: chartview
width: parent.width
height: 300
BarSeries {
name: "BarSeries"
axisX: BarCategoryAxis {
id:barAxis
property int minCategory: 10
property int maxCategory: 100
property int category: 50
categories: ["10","20","30","40","50","60","70","80","90","100"]
min: Math.floor(((minCategory + sb.position *
(maxCategory - minCategory - category)) + 9)/10)*10
max: Math.floor((((minCategory + sb.position *
(maxCategory - minCategory - category)) + category) + 9)/10) *10
}
axisY: ValueAxis {
id:axisY
min: 0
max: 70
tickCount: 5
labelFormat: "%.0f"
}
BarSet { values: [2, 2, 3, 4, 5, 6,7] }
BarSet { values: [5, 1, 2, 4, 1, 7] }
BarSet { values: [3, 5, 8, 13, 5, 8] }
}
}
Slider {
id: sb
anchors {
bottom: parent.bottom
left: parent.left
right: parent.right
}
height: 30
}
}
1) How to align the X Axis labels exactly below the grid? currently, it is at center as below:
I Tried with ValueAxis but it will not plot the bars properly but labels will be exactly below the grid.
2) Currently, slider moves the graph but not fluent. Can anyone suggest a better approach?

Answer 1

1) Did you try with CategoryAxis instead of BarCategoryAxis, it has an attribute labelsPosition.
2) First you should make your computation inside the Slider slot :
Slider {
onPositionChanged: {
barAxis.min = ...
barAxis.max = ...
}
}
Then I suggest to use ChartView functions like scrollRight(...), it's much more smooth.