diff options
Diffstat (limited to 'examples/datavisualization')
| -rw-r--r-- | examples/datavisualization/qmlspectrogram/doc/src/qmlspectrogram.qdoc | 20 | ||||
| -rw-r--r-- | examples/datavisualization/qmlspectrogram/qml/qmlspectrogram/main.qml | 30 |
2 files changed, 38 insertions, 12 deletions
diff --git a/examples/datavisualization/qmlspectrogram/doc/src/qmlspectrogram.qdoc b/examples/datavisualization/qmlspectrogram/doc/src/qmlspectrogram.qdoc index ee0018e3..0aebdde0 100644 --- a/examples/datavisualization/qmlspectrogram/doc/src/qmlspectrogram.qdoc +++ b/examples/datavisualization/qmlspectrogram/doc/src/qmlspectrogram.qdoc @@ -29,11 +29,8 @@ Spectrogram is simply a surface graph with a range gradient used to emphasize the different values. Typically spectrograms are shown with two dimensional surfaces, which we simulate - with a top down orthographic view of the graph. In this example, the default input handler - is enabled, so you can also rotate the graph to see how it looks in three dimensions. In - a real application you may want to disable the default input handling if you wish to show - only the two dimensional graph. See \l{Qt Quick 2 Custom Input Example} for guidelines on - customizing input handling. + with a top down orthographic view of the graph. To enforce the 2D effect, we disable the + graph rotation via mouse or touch when in the orthographic mode. The focus in this example is on showing how to display spectrograms, so the basic functionality is not explained. For more detailed QML example documentation, @@ -75,5 +72,18 @@ \snippet qmlspectrogram/qml/qmlspectrogram/main.qml 4 + To enforce the 2D effect, graph rotation via user input is disabled when in orthographic mode. + We do this by specifying a new input handler: + + \snippet qmlspectrogram/qml/qmlspectrogram/main.qml 5 + \snippet qmlspectrogram/qml/qmlspectrogram/main.qml 7 + \dots 0 + \snippet qmlspectrogram/qml/qmlspectrogram/main.qml 6 + \dots 0 + + When the projection mode changes, we adjust the value of the + \l{InputHandler3D::rotationEnabled}{rotationEnabled} property of the \c{customInputHandler} + to control the rotation. + \section1 Example contents */ diff --git a/examples/datavisualization/qmlspectrogram/qml/qmlspectrogram/main.qml b/examples/datavisualization/qmlspectrogram/qml/qmlspectrogram/main.qml index b61bf817..8bb458ca 100644 --- a/examples/datavisualization/qmlspectrogram/qml/qmlspectrogram/main.qml +++ b/examples/datavisualization/qmlspectrogram/qml/qmlspectrogram/main.qml @@ -53,7 +53,7 @@ Window { ValueAxis3D { id: xAxis segmentCount: 8 - labelFormat: "%i" + labelFormat: "%i\u00B0" title: "Angle" titleVisible: true titleFixed: false @@ -72,7 +72,7 @@ Window { ValueAxis3D { id: zAxis segmentCount: 5 - labelFormat: "%i" + labelFormat: "%i nm" title: "Radius" titleVisible: true titleFixed: false @@ -87,19 +87,32 @@ Window { backgroundEnabled: false } + + //! [5] + TouchInputHandler3D { + id: customInputHandler + rotationEnabled: false + } + //! [5] + //! [0] + //! [7] Surface3D { + //! [7] id: surfaceGraph width: surfaceView.width height: surfaceView.height shadowQuality: AbstractGraph3D.ShadowQualityNone - selectionMode: AbstractGraph3D.SelectionSlice | AbstractGraph3D.SelectionItemAndRow + selectionMode: AbstractGraph3D.SelectionSlice | AbstractGraph3D.SelectionItemAndColumn axisX: xAxis axisY: yAxis axisZ: zAxis theme: customTheme + //! [6] + inputHandler: customInputHandler + //! [6] // Remove the perspective and view the graph from top down to achieve 2D effect //! [1] @@ -124,6 +137,7 @@ Window { drawMode: Surface3DSeries.DrawSurface baseGradient: surfaceGradient colorStyle: Theme3D.ColorStyleRangeGradient + itemLabelFormat: "(@xLabel, @zLabel): @yLabel" ItemModelSurfaceDataProxy { itemModel: surfaceData.model @@ -172,6 +186,7 @@ Window { xAxis.labelAutoRotation = 30 yAxis.labelAutoRotation = 30 zAxis.labelAutoRotation = 30 + customInputHandler.rotationEnabled = true text = "Switch to orthographic" } else { surfaceGraph.orthoProjection = true; @@ -180,6 +195,7 @@ Window { xAxis.labelAutoRotation = 0 yAxis.labelAutoRotation = 0 zAxis.labelAutoRotation = 0 + customInputHandler.rotationEnabled = false text = "Switch to perspective" } } @@ -238,7 +254,7 @@ Window { anchors.margins: 20 anchors.bottom: parent.bottom anchors.top: buttonLayout.bottom - anchors.left: parent.left + anchors.right: parent.right border.color: "black" border.width: 1 width: 50 @@ -254,21 +270,21 @@ Window { Text { anchors.verticalCenter: legend.bottom - anchors.left: legend.right + anchors.right: legend.left anchors.margins: 2 text: surfaceGraph.axisY.min + "%" } Text { anchors.verticalCenter: legend.verticalCenter - anchors.left: legend.right + anchors.right: legend.left anchors.margins: 2 text: (surfaceGraph.axisY.max + surfaceGraph.axisY.min) / 2 + "%" } Text { anchors.verticalCenter: legend.top - anchors.left: legend.right + anchors.right: legend.left anchors.margins: 2 text: surfaceGraph.axisY.max + "%" } |