aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authordodoradio <dodoradio@outlook.com>2023-07-19 14:12:49 +0100
committerdodoradio <dodoradio@outlook.com>2023-07-20 19:17:44 +0100
commita4275a238f2a913923ee5b09edecba9c89ee4df1 (patch)
tree4956a412bbe0e395e3a7bd80ee0edf0fe2485055
parent19d485261dbb9f990935b4e677692207cf6422d3 (diff)
Rewrite the labelling system
The label code has been split into its own set of components: -TimeLabels: These try to display time labels as best as possible. They can label intervals from a minute to a day, but the code for labelling weeks is still missing. There's also no code protecting against strings overlapping with each other. - VerticalLabels: The code for these is a bit more 'analogue' than that of the time labels, but it's roughly analogous to previous code. These have also been implemented for the heartrate graph.
-rw-r--r--src/graphs/HrGraph.qml66
-rw-r--r--src/graphs/TimeLabels.qml149
-rw-r--r--src/graphs/VerticalLabels.qml79
-rw-r--r--src/resources.qrc2
4 files changed, 237 insertions, 59 deletions
diff --git a/src/graphs/HrGraph.qml b/src/graphs/HrGraph.qml
index ac5113e..cba15a5 100644
--- a/src/graphs/HrGraph.qml
+++ b/src/graphs/HrGraph.qml
@@ -26,42 +26,16 @@ Item {
id: graph
width: parent.width*0.9
anchors.horizontalCenter: parent.horizontalCenter
- property var labelsArr: []
- property var valueDivisionsInterval: 0
- property var valueDivisionsCount: 0
- property var startValueDivision: 0
- property real valuesDelta: hrGraph.relativeMode ? hrGraph.maxValue - hrGraph.minValue : hrGraph.maxValue
- property var timeDivisionsCount: 0
- property var timeDivisionsInterval: 0
- property var startTimeDivision: 0
- property var timeDelta: 0
- property var minTimeSeconds: 0
-
- function dataLoadingDone() {
- labelsRepeater.model = labelsArr.length
- }
- Component.onCompleted: { // I am so so sorry about this code.
- console.log(typeof hrDataLoader.getTodayData())
+ Component.onCompleted: {
hrGraph.loadGraphData(hrDataLoader.getTodayData())
- console.log("minValue", hrGraph.minValue, "maxValue",hrGraph.maxValue)
- //values divisions
- valueDivisionsInterval = valuesDelta >= 50 ? (valuesDelta >= 100 ? 20: 10) : 5
- valueDivisionsCount = hrGraph.relativeMode ? (Math.ceil(hrGraph.maxValue/valueDivisionsInterval)) - (Math.ceil(hrGraph.minValue/valueDivisionsInterval)) : Math.ceil(hrGraph.maxValue/valueDivisionsInterval) + 1
- startValueDivision = hrGraph.relativeMode ? Math.ceil(hrGraph.minValue/valueDivisionsInterval)*valueDivisionsInterval : 0
- //times divisions
- minTimeSeconds = dateToDaySecs(hrGraph.minTime)
- timeDelta = dateToDaySecs(hrGraph.maxTime) - minTimeSeconds
- timeDivisionsCount = Math.floor(timeDelta/3600) // get number of hours and divide
- timeDivisionsInterval = timeDivisionsCount > 11 ? 4 : 2
- timeDivisionsCount = timeDivisionsCount/timeDivisionsInterval
- startTimeDivision = hrGraph.minTime.getHours() + 1
- labelsRepeater.model = graph.timeDivisionsCount
}
HrDataLoader { id: hrDataLoader }
- Item { // labels column
+ VerticalLabels { // labels column
id: markerParent
width: parent.width/8
+ startValue: 0
+ endValue: hrGraph.maxValue
anchors {
left: parent.left
top: hrGraph.top
@@ -69,17 +43,6 @@ Item {
topMargin: hrGraph.lineWidth/2
bottomMargin: anchors.topMargin
}
- Repeater {
- model: graph.valueDivisionsCount
- delegate: Label {
- anchors.right: parent.right
- property real value: graph.startValueDivision + graph.valueDivisionsInterval*index
- text: value
- font.pixelSize: Dims.w(5)
- y: parent.height - (parent.height)*(value/graph.valuesDelta) - height/2
- verticalAlignment: Text.AlignVCenter
- }
- }
}
LineGraph {
id: hrGraph
@@ -92,9 +55,11 @@ Item {
relativeMode: false
lineWidth: 4
}
- Item { //labels row
+ TimeLabels {
id: labelsRow
height: Dims.w(5)
+ startTime: hrGraph.minTime / 1000
+ endTime: hrGraph.maxTime / 1000
anchors {
bottom: parent.bottom
left: hrGraph.left
@@ -102,22 +67,5 @@ Item {
rightMargin: hrGraph.lineWidth/2
leftMargin: anchors.rightMargin
}
- Repeater {
- id: labelsRepeater
- model: 0
- delegate: Label {
- id: dowLabel
- // anchors.horizontalCenter: parent.horizontalCenter
- horizontalAlignment: Text.AlignHCenter
- property var value: graph.startTimeDivision + index*graph.timeDivisionsInterval
- text: value + ":00"
- x: ((value*3600-graph.minTimeSeconds)/graph.timeDelta)*parent.width
- onValueChanged: console.log("value",value, "mintimeseconds", graph.minTimeSeconds, "timeDelta", graph.timeDelta,"x",x,"text",text)
- font.pixelSize: Dims.w(5)
- }
- }
- }
- function dateToDaySecs(date) {
- return (date.getHours()*3600 + date.getMinutes()*60 + date.getSeconds())
}
}
diff --git a/src/graphs/TimeLabels.qml b/src/graphs/TimeLabels.qml
new file mode 100644
index 0000000..bebeca5
--- /dev/null
+++ b/src/graphs/TimeLabels.qml
@@ -0,0 +1,149 @@
+/*
+ * Copyright (C) 2023 Arseniy Movshev <dodoradio@outlook.com>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.15
+import org.asteroid.controls 1.0
+
+Item {
+ id: root
+ property real startTime: 0
+ property real endTime: 0
+ property int minLabels: 3 //these min and max numbers of labels are only guidelines for the algorithm, and don't actually set hard limits.
+ property int maxLabels: 8
+ property int startValueDivision
+ onStartTimeChanged: update()
+ onEndTimeChanged: update()
+ onMinLabelsChanged: update()
+ onMaxLabelsChanged: update()
+ Component.onCompleted: update()
+ function update() {
+ listModel.clear()
+ var delta = endTime - startTime
+ var interval = 0
+ if (delta < 60 * maxLabels) { // check 1 minute
+ if (delta < 60 * minLabels) {
+ interval = 30 //label every 30s otherwise
+ } else {
+ interval = 60
+ }
+ startValueDivision = interval * Math.ceil(startTime / interval)
+ // iterate and populate the list
+ var currentTime = startValueDivision
+ var i = 0;
+ var date
+ while (currentTime < endTime) {
+ date = new Date(currentTime*1000)
+ var value = date.getHours().toString() + ":" + date.getMinutes().toString()
+ var x = (currentTime - startTime) / delta
+ listModel.append({"value": value, "x": x})
+ currentTime = currentTime + interval
+ i++
+ }
+
+ } else if (delta < 600 * maxLabels) { // check 10 minutes
+ if (delta < 600 * minLabels) {
+ interval = 300 //label every 5m otherwise
+ } else {
+ interval = 600
+ }
+ startValueDivision = interval * Math.ceil(startTime / interval)
+ // iterate and populate the list
+ var currentTime = startValueDivision
+ var i = 0;
+ var date
+ while (currentTime < endTime) {
+ date = new Date(currentTime*1000)
+ var value = date.getHours().toString() + ":" + date.getMinutes().toString()
+ var x = (currentTime - startTime) / delta
+ listModel.append({"value": value, "x": x})
+ currentTime = currentTime + interval
+ i++
+ }
+
+ } else if (delta < 7200 * maxLabels) { // check every 2 hours
+ if (delta > 3600 * maxLabels) {
+ interval = 7200 //label every 2h if 1h doesn't work - this is an ugly workaround so that a full day still gets some sort of divisions
+ } else if (delta < 3600 * minLabels) {
+ interval = 1800 //label every 30m otherwise
+ } else {
+ interval = 3600
+ }
+ startValueDivision = interval * Math.ceil(startTime / interval)
+ // iterate and populate the list
+ var currentTime = startValueDivision
+ var i = 0;
+ var date
+ while (currentTime < endTime) {
+ date = new Date(currentTime*1000)
+ var value = date.getHours().toString() + ":" + date.getMinutes().toString()
+ var x = (currentTime - startTime) / delta
+ listModel.append({"value": value, "x": x})
+ currentTime = currentTime + interval
+ i++
+ }
+
+ } else if (delta < 86400 * maxLabels) { // check days
+ if (delta < 86400 * minLabels) {
+ interval = 43200 //label every 12h otherwise
+ } else {
+ interval = 86400
+ }
+ startValueDivision = interval * Math.ceil(startTime / interval)
+ // iterate and populate the list
+ var currentTime = startValueDivision
+ var i = 0;
+ var date
+ while (currentTime < endTime) {
+ date = new Date(currentTime*1000)
+ var value = date.getDate().toString() /* we should add am and pm here for 12h mode*/
+ var x = ((currentTime - startTime) / delta)
+ listModel.append({"value": value, "x": x})
+ currentTime = currentTime + interval
+ i++
+ }
+
+ } else if (delta < 604800 * maxLabels) { // check weeks
+ interval = 604800
+ startValueDivision = interval * Math.ceil(startTime / interval)
+ // iterate and populate the list
+ var currentTime = startValueDivision
+ var i = 0;
+ var date
+ while (currentTime < endTime) {
+ date = new Date(currentTime*1000)
+ var value = date.getDate().toString()
+ var x = ((currentTime - startTime) / delta)
+ listModel.append({"value": value, "x": x})
+ currentTime = currentTime + interval
+ i++
+ }
+ } else { // handle months
+ console.log("viewing more than several days of data isn't implemented yet. please pester dodoradio about this.")
+ }
+ // this is slightly crude - we assume that the min and max label numbers will be set in such a way that halving gets us a reasonable interval.
+ // we also ignore everything over a number of weeks, as this needs a bit more thought that I don't want to deal with right now. this graph code is stalling too much other development.
+ }
+ Repeater {
+ model: ListModel { id: listModel }
+ delegate: Label {
+ text: model.value
+ font.pixelSize: Dims.w(5)
+ x: model.x*root.width - width/2
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+}
diff --git a/src/graphs/VerticalLabels.qml b/src/graphs/VerticalLabels.qml
new file mode 100644
index 0000000..5cb796b
--- /dev/null
+++ b/src/graphs/VerticalLabels.qml
@@ -0,0 +1,79 @@
+/*
+ * Copyright (C) 2023 Arseniy Movshev <dodoradio@outlook.com>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.15
+import org.asteroid.controls 1.0
+
+Item {
+ id: root
+ property real startValue: 0
+ property real endValue: 0
+ property int minLabels: 3
+ property int maxLabels: 8
+ property real valueDivisionsInterval: 0
+ property real startValueDivision: 0
+ property real valuesDelta
+ onStartValueChanged: update()
+ onEndValueChanged: update()
+ onMinLabelsChanged: update()
+ onMaxLabelsChanged: update()
+
+ function update() { // this tries to guess how to generate nice looking labels
+ valuesDelta = endValue - startValue
+ var powTen = Math.pow(10,Math.trunc(Math.log10(valuesDelta)))
+ var interval = powTen
+ var numLabel = Math.floor(valuesDelta/interval)
+ if (numLabel > maxLabels) {
+ interval = powTen*2
+ numLabel = valuesDelta/interval
+ if (numLabel > maxLabels) {
+ interval = powTen*5
+ numLabel = valuesDelta/interval
+ if (numLabel > maxLabels) {
+ interval = powTen*10
+ numLabel = valuesDelta/interval
+ }
+ }
+ }
+ if (numLabel < minLabels) {
+ interval = powTen/2
+ numLabel = valuesDelta/interval
+ if (numLabel < minLabels) {
+ interval = powTen/5
+ numLabel = valuesDelta/interval
+ if (numLabel < minLabels) {
+ interval = powTen/10
+ numLabel = valuesDelta/interval
+ }
+ }
+ }
+ valueDivisionsInterval = interval
+ labelsRepeater.model = Math.round(numLabel) + 1
+ startValueDivision = powTen*Math.trunc(startValue/powTen)
+ }
+ Repeater {
+ id: labelsRepeater
+ delegate: Label {
+ anchors.right: parent.right
+ property real value: root.startValueDivision + root.valueDivisionsInterval*index
+ text: value > 1000 ? value/1000 + "k" : value
+ font.pixelSize: Dims.w(5)
+ y: parent.height - (parent.height)*(value/root.valuesDelta) - height/2
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+}
diff --git a/src/resources.qrc b/src/resources.qrc
index 64a9f5f..4eaeafe 100644
--- a/src/resources.qrc
+++ b/src/resources.qrc
@@ -8,5 +8,7 @@
<file>settings/UiSettingsPage.qml</file>
<file>graphs/BarGraph.qml</file>
<file>graphs/HrGraph.qml</file>
+ <file>graphs/TimeLabels.qml</file>
+ <file>graphs/VerticalLabels.qml</file>
</qresource>
</RCC>