<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>main.qml Example File | Qt Data Visualization 5.12.6</title> <link rel="stylesheet" type="text/css" href="style/offline-simple.css" /> <script type="text/javascript"> document.getElementsByTagName("link").item(0).setAttribute("href", "style/offline.css"); // loading style sheet breaks anchors that were jumped to before // so force jumping to anchor again setTimeout(function() { var anchor = location.hash; // need to jump to different anchor first (e.g. none) location.hash = "#"; setTimeout(function() { location.hash = anchor; }, 0); }, 0); </script> </head> <body> <div class="header" id="qtdocheader"> <div class="main"> <div class="main-rounded"> <div class="navigationbar"> <table><tr> <td >Qt 5.12</td><td ><a href="qtdatavisualization-index.html">Qt Data Visualization</a></td><td ><a href="qtdatavisualization-qmlspectrogram-example.html">Qt Quick 2 Spectrogram Example</a></td><td >main.qml Example File</td></tr></table><table class="buildversion"><tr> <td id="buildversion" width="100%" align="right"><a href="qtdatavisualization-index.html">Qt Data Visualization | Commercial or GPLv3</a></td> </tr></table> </div> </div> <div class="content"> <div class="line"> <div class="content mainContent"> <div class="sidebar"><div class="sidebar-content" id="sidebar-content"></div></div> <h1 class="title">main.qml Example File</h1> <span class="subtitle">qmlspectrogram/qml/qmlspectrogram/main.qml</span> <!-- $$$qmlspectrogram/qml/qmlspectrogram/main.qml-description --> <div class="descr"> <a name="details"></a> <pre class="qml"> /**************************************************************************** ** ** Copyright (C) 2016 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of the Qt Data Visualization module of the Qt Toolkit. ** ** $QT_BEGIN_LICENSE:GPL$ ** Commercial License Usage ** Licensees holding valid commercial Qt licenses may use this file in ** accordance with the commercial license agreement provided with the ** Software or, alternatively, in accordance with the terms contained in ** a written agreement between you and The Qt Company. For licensing terms ** and conditions see https://www.qt.io/terms-conditions. For further ** information use the contact form at https://www.qt.io/contact-us. ** ** GNU General Public License Usage ** Alternatively, this file may be used under the terms of the GNU ** General Public License version 3 or (at your option) any later version ** approved by the KDE Free Qt Foundation. The licenses are as published by ** the Free Software Foundation and appearing in the file LICENSE.GPL3 ** included in the packaging of this file. Please review the following ** information to ensure the GNU General Public License requirements will ** be met: https://www.gnu.org/licenses/gpl-3.0.html. ** ** $QT_END_LICENSE$ ** ****************************************************************************/ import QtQuick 2.1 import QtQuick.Layouts 1.0 import QtQuick.Window 2.1 import QtDataVisualization 1.2 import "." Window { id: mainview title: "Qt Quick 2 Spectrogram Example" visible: true width: 1024 height: 768 color: surfaceGraph.theme.windowColor Data { id: surfaceData } Item { id: surfaceView width: mainview.width height: mainview.height anchors.top: mainview.top anchors.left: mainview.left ColorGradient { id: surfaceGradient ColorGradientStop { position: 0.0; color: "black" } ColorGradientStop { position: 0.2; color: "red" } ColorGradientStop { position: 0.5; color: "blue" } ColorGradientStop { position: 0.8; color: "yellow" } ColorGradientStop { position: 1.0; color: "white" } } ValueAxis3D { id: xAxis segmentCount: 8 labelFormat: "%i\u00B0" title: "Angle" titleVisible: true titleFixed: false } ValueAxis3D { id: yAxis segmentCount: 8 labelFormat: "%i \%" title: "Value" titleVisible: true labelAutoRotation: 0 titleFixed: false } ValueAxis3D { id: zAxis segmentCount: 5 labelFormat: "%i nm" title: "Radius" titleVisible: true titleFixed: false } Theme3D { id: customTheme type: Theme3D.ThemeQt // Don't show specular spotlight as we don't want it to distort the colors lightStrength: 0.0 ambientLightStrength: 1.0 backgroundEnabled: false gridLineColor: "#AAAAAA" windowColor: "#EEEEEE" } TouchInputHandler3D { id: customInputHandler rotationEnabled: false } Surface3D { id: surfaceGraph width: surfaceView.width height: surfaceView.height shadowQuality: AbstractGraph3D.ShadowQualityNone selectionMode: AbstractGraph3D.SelectionSlice | AbstractGraph3D.SelectionItemAndColumn axisX: xAxis axisY: yAxis axisZ: zAxis theme: customTheme inputHandler: customInputHandler // Remove the perspective and view the graph from top down to achieve 2D effect orthoProjection: true scene.activeCamera.cameraPreset: Camera3D.CameraPresetDirectlyAbove flipHorizontalGrid: true radialLabelOffset: 0.01 horizontalAspectRatio: 1 scene.activeCamera.zoomLevel: 85 Surface3DSeries { id: surfaceSeries flatShadingEnabled: false drawMode: Surface3DSeries.DrawSurface baseGradient: surfaceGradient colorStyle: Theme3D.ColorStyleRangeGradient itemLabelFormat: "(@xLabel, @zLabel): @yLabel" ItemModelSurfaceDataProxy { itemModel: surfaceData.model rowRole: "radius" columnRole: "angle" yPosRole: "value" } } } } RowLayout { id: buttonLayout anchors.top: parent.top anchors.left: parent.left anchors.right: parent.right opacity: 0.5 NewButton { id: polarToggle Layout.fillWidth: true Layout.fillHeight: true text: "Switch to polar" onClicked: { if (surfaceGraph.polar === false) { surfaceGraph.polar = true text = "Switch to cartesian" } else { surfaceGraph.polar = false text = "Switch to polar" } } } NewButton { id: orthoToggle Layout.fillWidth: true Layout.fillHeight: true text: "Switch to perspective" onClicked: { if (surfaceGraph.orthoProjection === true) { surfaceGraph.orthoProjection = false; xAxis.labelAutoRotation = 30 yAxis.labelAutoRotation = 30 zAxis.labelAutoRotation = 30 customInputHandler.rotationEnabled = true text = "Switch to orthographic" } else { surfaceGraph.orthoProjection = true; surfaceGraph.scene.activeCamera.cameraPreset = Camera3D.CameraPresetDirectlyAbove surfaceSeries.drawMode &= ~Surface3DSeries.DrawWireframe; xAxis.labelAutoRotation = 0 yAxis.labelAutoRotation = 0 zAxis.labelAutoRotation = 0 customInputHandler.rotationEnabled = false text = "Switch to perspective" } } } NewButton { id: flipGridToggle Layout.fillWidth: true Layout.fillHeight: true text: "Toggle axis grid on top" onClicked: { onClicked: { if (surfaceGraph.flipHorizontalGrid === true) { surfaceGraph.flipHorizontalGrid = false; } else { surfaceGraph.flipHorizontalGrid = true; } } } } NewButton { id: labelOffsetToggle Layout.fillWidth: true Layout.fillHeight: true text: "Toggle radial label position" visible: surfaceGraph.polar onClicked: { if (surfaceGraph.radialLabelOffset >= 1.0) { surfaceGraph.radialLabelOffset = 0.01 } else { surfaceGraph.radialLabelOffset = 1.0 } } } NewButton { id: surfaceGridToggle Layout.fillWidth: true Layout.fillHeight: true text: "Toggle surface grid" visible: !surfaceGraph.orthoProjection onClicked: { if (surfaceSeries.drawMode & Surface3DSeries.DrawWireframe) { surfaceSeries.drawMode &= ~Surface3DSeries.DrawWireframe; } else { surfaceSeries.drawMode |= Surface3DSeries.DrawWireframe; } } } } Rectangle { id: legend anchors.margins: 20 anchors.bottom: parent.bottom anchors.top: buttonLayout.bottom anchors.right: parent.right border.color: "black" border.width: 1 width: 50 rotation: 180 gradient: Gradient { GradientStop { position: 0.0; color: "black" } GradientStop { position: 0.2; color: "red" } GradientStop { position: 0.5; color: "blue" } GradientStop { position: 0.8; color: "yellow" } GradientStop { position: 1.0; color: "white" } } } Text { anchors.verticalCenter: legend.bottom anchors.right: legend.left anchors.margins: 2 text: surfaceGraph.axisY.min + "%" } Text { anchors.verticalCenter: legend.verticalCenter anchors.right: legend.left anchors.margins: 2 text: (surfaceGraph.axisY.max + surfaceGraph.axisY.min) / 2 + "%" } Text { anchors.verticalCenter: legend.top anchors.right: legend.left anchors.margins: 2 text: surfaceGraph.axisY.max + "%" } } </pre> </div> <!-- @@@qmlspectrogram/qml/qmlspectrogram/main.qml --> </div> </div> </div> </div> </div> <div class="footer"> <p> <acronym title="Copyright">©</acronym> 2019 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners.<br/> The documentation provided herein is licensed under the terms of the <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation License version 1.3</a> as published by the Free Software Foundation.<br/> Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners. </p> </div> </body> </html>