[ui] Viewer: add LdrToHdrCalibration camera response graph

2025-08-03 08:48:40 +02:00 · 2020-08-05 11:54:46 +02:00 · 2020-08-05 11:54:46 +02:00 · 5a1660a2c0
commit 5a1660a2c0
parent e0c42fb42a
2 changed files with 157 additions and 0 deletions
--- a/meshroom/ui/qml/Viewer/CameraResponseGraph.qml
+++ b/meshroom/ui/qml/Viewer/CameraResponseGraph.qml
@ -0,0 +1,125 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+import MaterialIcons 2.2
+import QtPositioning 5.8
+import QtLocation 5.9
+import QtCharts 2.13
+import Charts 1.0
+
+import Controls 1.0
+import Utils 1.0
+import DataObjects 1.0
+
+FloatingPane {
+    id: root
+
+    property var ldrHdrCalibrationNode: null
+    property color textColor: Colors.sysPalette.text
+
+    clip: true
+    padding: 4
+
+    CsvData {
+        id: csvData
+        filepath: ldrHdrCalibrationNode ? ldrHdrCalibrationNode.attribute("response").value : ""
+    }
+
+    // To avoid interaction with components in background
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
+        onPressed: {}
+        onReleased: {}
+        onWheel: {}
+    }
+
+    property bool ready: csvData.ready
+    Item {
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
+        anchors.horizontalCenterOffset: -responseChart.width/2
+        anchors.verticalCenterOffset: -responseChart.height/2
+
+        InteractiveChartView {
+            id: responseChart
+            width: root.width > 400 ? 400 : (root.width < 350 ? 350 : root.width)
+            height: width * 0.75
+
+            title: "Camera Response Function (CRF)"
+            legend.visible: false
+            antialiasing: true
+
+            ValueAxis {
+                id: valueAxisX
+                labelFormat: "%i"
+                titleText: "Camera Brightness"
+                min: ready ? csvData.getColumn(0).getFirst() : 0
+                max: ready ? csvData.getColumn(0).getLast() : 1
+            }
+            ValueAxis {
+                id: valueAxisY
+                titleText: "Normalized Radiance"
+                min: 0.0
+                max: 1.0
+            }
+
+            // We cannot use a Repeater with these Components so we need to instantiate them one by one
+            // Red curve
+            LineSeries {
+                axisX: valueAxisX
+                axisY: valueAxisY
+                name: ready ? csvData.getColumn(1).title : ""
+                color: name.toLowerCase()
+
+                Component.onCompleted: if(ready) csvData.getColumn(1).fillChartSerie(this)
+            }
+            // Green curve
+            LineSeries {
+                axisX: valueAxisX
+                axisY: valueAxisY
+                name: ready ? csvData.getColumn(2).title : ""
+                color: name.toLowerCase()
+
+                Component.onCompleted: if(ready) csvData.getColumn(2).fillChartSerie(this)
+            }
+            // Blue curve
+            LineSeries {
+                axisX: valueAxisX
+                axisY: valueAxisY
+                name: ready ? csvData.getColumn(3).title : ""
+                color: name.toLowerCase()
+
+                Component.onCompleted: if(ready) csvData.getColumn(3).fillChartSerie(this)
+            }
+        }
+
+        Item {
+            id: btnContainer
+
+            anchors.bottom: responseChart.bottom
+            anchors.bottomMargin: 35
+            anchors.left: responseChart.left
+            anchors.leftMargin: responseChart.width * 0.15
+
+            RowLayout {
+                ChartViewCheckBox {
+                    text: "ALL"
+                    color: textColor
+                    checkState: legend.buttonGroup.checkState
+                    onClicked: {
+                        const _checked = checked
+                        for(let i = 0; i < responseChart.count; ++i) {
+                            responseChart.series(i).visible = _checked
+                        }
+                    }
+                }
+
+                ChartViewLegend {
+                    id: legend
+                    chartView: responseChart
+                }
+            }
+        }
+    }
+}