contents/ui/LineChartCard.qml

0001 /*
0002  * SPDX-FileCopyrightText: 2020 Arjen Hiemstra <ahiemstra@heimr.nl>
0003  *
0004  * SPDX-License-Identifier: LGPL-2.0-or-later
0005  */
0006
0007 import QtQuick
0008 import QtQuick.Controls
0009 import QtQuick.Layouts
0010
0011 import org.kde.kirigami as Kirigami
0012
0013 import org.kde.quickcharts as Charts
0014 import org.kde.quickcharts.controls as ChartsControls
0015
0016 import org.kde.ksysguard.formatter as Formatter
0017
0018 Kirigami.AbstractCard {
0019     id: card
0020
0021     Layout.fillWidth: true
0022     Layout.preferredWidth: 0
0023     Layout.fillHeight: true
0024     Layout.preferredHeight: 0
0025
0026     property alias chart: chart
0027
0028     property alias colorSource: chart.colorSource
0029     property alias nameSource: chart.nameSource
0030     property alias valueSources: chart.valueSources
0031
0032     property alias xRange: chart.xRange
0033     property alias yRange: chart.yRange
0034
0035     property alias stacked: chart.stacked
0036
0037     property alias axisLabels: axisLabels
0038
0039     property var formatLabel: function(input) { return Formatter.Formatter.formatValueShowNull(input, card.unit) }
0040     property int unit
0041
0042     leftPadding: Kirigami.Units.smallSpacing
0043     rightPadding: Kirigami.Units.smallSpacing
0044     topPadding: Kirigami.Units.smallSpacing
0045     bottomPadding: Kirigami.Units.smallSpacing
0046
0047     Kirigami.Theme.inherit: false
0048     Kirigami.Theme.colorSet: Kirigami.Theme.View
0049
0050     contentItem: Item {
0051         ChartsControls.GridLines {
0052             anchors.fill: chart
0053             direction: ChartsControls.GridLines.Vertical
0054
0055             major.visible: false
0056
0057             minor.color: Kirigami.Theme.alternateBackgroundColor
0058             minor.count: 5
0059         }
0060
0061         ChartsControls.AxisLabels {
0062             id: axisLabels
0063
0064             anchors {
0065                 left: parent.left
0066                 top: parent.top
0067                 bottom: parent.bottom
0068             }
0069
0070             direction: ChartsControls.AxisLabels.VerticalBottomTop
0071             alignment: Qt.AlignRight | Qt.AlignBottom
0072             constrainToBounds: true
0073
0074             delegate: Label {
0075                 text: card.formatLabel(ChartsControls.AxisLabels.label);
0076                 font: Kirigami.Theme.smallFont;
0077                 opacity: 0.8
0078             }
0079
0080             source: Charts.ChartAxisSource {
0081                 chart: chart;
0082                 axis: Charts.ChartAxisSource.YAxis;
0083                 itemCount: 2
0084             }
0085         }
0086
0087         Charts.LineChart {
0088             id: chart
0089             anchors {
0090                 left: axisLabels.right
0091                 leftMargin: Kirigami.Units.smallSpacing
0092                 top: parent.top
0093                 bottom: parent.bottom
0094                 right: parent.right
0095             }
0096
0097             xRange {
0098                 automatic: false
0099                 from: 0
0100                 to: 100
0101             }
0102             yRange {
0103                 automatic: true
0104                 from: 0
0105                 to: 100
0106             }
0107
0108             fillOpacity: 1.0
0109             smooth: true
0110             stacked: false
0111             lineWidth: 1
0112             direction: Charts.XYChart.ZeroAtEnd
0113
0114             colorSource: Charts.ColorGradientSource { baseColor: Kirigami.Theme.highlightColor; itemCount: chart.valueSources.length }
0115         }
0116     }
0117 }