Commit b7c8eb22 authored by David Redondo's avatar David Redondo 🏎
Browse files

Display grid lines in line chart

Display 3 major grid lines (bottom, middle and top of the diagram) and 2 minor
grid lines between them (25% and 75% of the height of the diagram) in the
FullRepresenation of the line chart face. Also adds a config option to display
these grid lines (enabled  by default).
parent 9b17e9d8
......@@ -17,6 +17,12 @@
</entry>
<entry name="lineChartSmooth" type="Bool">
<default>true</default>
</entry>
<entry name="showGridLines" type="Bool">
<default>true</default>
</entry>
<entry name="showYAxisLabels" type="Bool">
<default>true</default>
</entry>
<entry name="rangeFromX" type="Int">
<default>0</default>
......@@ -37,5 +43,5 @@
<default>true</default>
</entry>
</group>
</kcfg>
......@@ -33,6 +33,8 @@ Kirigami.FormLayout {
property alias cfg_lineChartStacked: stackedCheckbox.checked
property alias cfg_lineChartFillOpacity: fillOpacitySpin.value
property alias cfg_lineChartSmooth: smoothCheckbox.checked
property alias cfg_showGridLines: showGridLinesCheckbox.checked
property alias cfg_showYAxisLabels: showYAxisLabelsCheckbox.checked
property alias cfg_rangeAutoY: rangeAutoYCheckbox.checked
property alias cfg_rangeFromY: rangeFromYSpin.value
......@@ -57,6 +59,14 @@ Kirigami.FormLayout {
id: smoothCheckbox
text: i18n("Smooth Lines")
}
QQC2.CheckBox {
id: showGridLinesCheckbox
text: i18n("Show Grid Lines")
}
QQC2.CheckBox {
id: showYAxisLabelsCheckbox
text: i18n("Show Y Axis Labels")
}
QQC2.SpinBox {
id: fillOpacitySpin
Kirigami.FormData.label: i18n("Fill Opacity:")
......
......@@ -2,6 +2,7 @@
* Copyright 2019 Marco Martin <mart@kde.org>
* Copyright 2019 David Edmundson <davidedmundson@kde.org>
* Copyright 2019 Arjen Hiemstra <ahiemstra@heimr.nl>
* Copyright 2020 David Redondo <kde@david-redondo.de>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU Library General Public License as
......@@ -20,18 +21,22 @@
*/
import QtQuick 2.9
import QtQuick.Controls 2.9 as QQC2
import QtQuick.Layouts 1.1
import org.kde.kirigami 2.8 as Kirigami
import org.kde.kirigami 2.12 as Kirigami
import org.kde.ksysguard.sensors 1.0 as Sensors
import org.kde.ksysguard.faces 1.0 as Faces
import org.kde.ksysguard.formatter 1.0 as Formatter
import org.kde.quickcharts 1.0 as Charts
Faces.SensorFace {
id: root
readonly property bool showLegend: controller.faceConfiguration.showLegend
readonly property bool showGridLines: root.controller.faceConfiguration.showGridLines
readonly property bool showYAxisLabels: root.controller.faceConfiguration.showYAxisLabels
// Arbitrary minimumWidth to make easier to align plasmoids in a predictable way
Layout.minimumWidth: Kirigami.Units.gridUnit * 8
Layout.preferredWidth: titleMetrics.width
......@@ -52,20 +57,68 @@ Faces.SensorFace {
}
}
LineChart {
id: compactRepresentation
Layout.fillWidth: true
RowLayout {
spacing: Kirigami.Units.smallSpacing
Layout.fillHeight: true
Layout.minimumHeight: root.formFactor === Faces.SensorFace.Constrained
? Kirigami.Units.gridUnit
: 3 * Kirigami.Units.gridUnit
Layout.preferredHeight: 5 * Kirigami.Units.gridUnit
Layout.topMargin: showYAxisLabels ? axisMetrics.height / 2 : 0
Layout.bottomMargin: Layout.topMargin
Charts.AxisLabels {
id: axisLabels
visible: showYAxisLabels
Layout.fillHeight: true
constrainToBounds: false
direction: Charts.AxisLabels.VerticalBottomTop
delegate: QQC2.Label {
anchors.right: parent.right
font: Kirigami.Theme.smallFont
text: Formatter.Formatter.formatValueShowNull(Charts.AxisLabels.label,
compactRepresentation.sensorsModel.data(compactRepresentation.sensorsModel.index(0, 0), Sensors.SensorDataModel.Unit))
color: Kirigami.Theme.disabledTextColor
}
source: Charts.ChartAxisSource {
chart: compactRepresentation
axis: Charts.ChartAxisSource.YAxis
itemCount: 5
}
TextMetrics {
id: axisMetrics
font: Kirigami.Theme.smallFont
text: Formatter.Formatter.formatValueShowNull("0",
compactRepresentation.sensorsModel.data(compactRepresentation.sensorsModel.index(0, 0), Sensors.SensorDataModel.Unit))
}
}
LineChart {
id: compactRepresentation
Layout.fillWidth: true
Layout.fillHeight: true
Layout.minimumHeight: root.formFactor === Faces.SensorFace.Constrained
? Kirigami.Units.gridUnit
: 3 * Kirigami.Units.gridUnit
Layout.preferredHeight: 5 * Kirigami.Units.gridUnit
Charts.GridLines {
id: horizontalLines
visible: showGridLines
direction: Charts.GridLines.Vertical
anchors.fill: compactRepresentation
z: compactRepresentation.z - 1
chart: compactRepresentation
major.count: 3
major.lineWidth: 1
// The same color as a Kirigami.Separator
major.color: Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.2)
minor.visible: false
}
}
}
Faces.ExtendedLegend {
Layout.fillWidth: root.width < implicitWidth * 1.5
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
Layout.fillHeight: true
Layout.leftMargin: compactRepresentation.x
Layout.minimumHeight: root.formFactor === Faces.SensorFace.Horizontal
|| root.formFactor === Faces.SensorFace.Vertical
? implicitHeight
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment