summaryrefslogtreecommitdiffstats
path: root/examples/datavisualization/qmlscatter
diff options
context:
space:
mode:
authorTomi Korpipaa <tomi.korpipaa@qt.io>2023-02-02 10:21:57 +0200
committerTomi Korpipaa <tomi.korpipaa@qt.io>2023-02-02 12:05:35 +0200
commit749b7e98aaef0ae0f7484814d2516eea5fea53ea (patch)
treec7c82a7ed2a6c61f203b2204de5a32aa87217991 /examples/datavisualization/qmlscatter
parent9e753b9853e46110f5cfa3eff236095b03c63b11 (diff)
Update qmlscatter example doc to use imperative moodHEADdev
Pick-to: 6.5 Change-Id: Icf20a3418154a7d591052f043844ce8c2625fc71 Reviewed-by: Sami Varanka <sami.varanka@qt.io> Reviewed-by: Tomi Korpipää <tomi.korpipaa@qt.io>
Diffstat (limited to 'examples/datavisualization/qmlscatter')
-rw-r--r--examples/datavisualization/qmlscatter/doc/src/qmlscatter.qdoc76
1 files changed, 38 insertions, 38 deletions
diff --git a/examples/datavisualization/qmlscatter/doc/src/qmlscatter.qdoc b/examples/datavisualization/qmlscatter/doc/src/qmlscatter.qdoc
index aa2029d2..8d2800e6 100644
--- a/examples/datavisualization/qmlscatter/doc/src/qmlscatter.qdoc
+++ b/examples/datavisualization/qmlscatter/doc/src/qmlscatter.qdoc
@@ -9,12 +9,13 @@
\ingroup qtdatavisualization_qmlexamples
\brief Using Scatter3D in a QML application.
- The scatter graph example shows how to make a simple scatter graph visualization using
+ \e {Simple Scatter Graph} shows how to make a simple scatter graph visualization using
Scatter3D and QML.
- For instructions about how to interact with the graph, see \l{Qt Data Visualization Interacting with Data}{this page}.
+ For instructions about how to interact with the graph, see
+ \l{Qt Data Visualization Interacting with Data}{this page}.
- For instructions how to create a new Qt Quick application of your own, see Qt Creator help.
+ For instructions on how to create a new Qt Quick application of your own, see Qt Creator help.
\image qmlscatter-example.png
@@ -22,14 +23,14 @@
\section1 Application Basics
- Before diving into the QML code, let's take a look at the application \c main.cpp.
+ Before diving into the QML code, take a look at the application \c main.cpp.
- This application implements a 'Quit' button in the UI, so we want to connect the QQmlEngine::quit()
- signal to our application's QWindow::close() slot:
+ This application implements a 'Quit' button in the UI, so you want to connect the QQmlEngine::quit()
+ signal to the application's QWindow::close() slot:
\snippet qmlscatter/main.cpp 4
- To make deployment little simpler, we gather all of the application's \c .qml files to a resource
+ To make deployment a little simpler, gather all of the application's \c .qml files to a resource
file (\c qmlscatter.qrc):
\badcode
@@ -41,7 +42,7 @@
</RCC>
\endcode
- This also requires us to set the \c main.qml to be read from the resource (\c{qrc:}):
+ This also requires setting the \c main.qml to be read from the resource (\c{qrc:}):
\snippet qmlscatter/main.cpp 3
@@ -59,106 +60,105 @@
)
\endcode
- Lastly, we want the application to run in a maximized window:
+ Finally, make the application run in a maximized window:
\snippet qmlscatter/main.cpp 2
\section1 Setting up the Graph
- First we'll import all the QML modules we need:
+ First, import all the needed QML modules:
\snippet qmlscatter/qml/qmlscatter/main.qml 0
- Then we create our main \c Item and call it \c mainView:
+ Then, create the main \c Item and call it \c mainView:
\snippet qmlscatter/qml/qmlscatter/main.qml 1
- Then we'll add another \c Item inside the main \c Item, and call it \c dataView.
- This will be the item to hold the Scatter3D graph. We'll anchor it to the parent bottom:
+ Then, add another \c Item inside the main \c Item, and call it \c {dataView}.
+ This will be the item to hold the Scatter3D graph. Anchor it to the parent bottom:
\snippet qmlscatter/qml/qmlscatter/main.qml 9
- Next we're ready to add the Scatter3D graph itself. We'll add it inside the \c dataView and
- name it \c {scatterGraph}. Let's make it fill the \c {dataView}:
+ Next, add the Scatter3D graph itself. Add it inside the \c dataView and
+ name it \c {scatterGraph}. Make it fill the \c {dataView}:
\snippet qmlscatter/qml/qmlscatter/main.qml 2
Now the graph is ready for use, but has no data. It also has the default axes and visual
properties.
- Let's modify some visual properties first by adding the following inside \c {scatterGraph}:
+ Next, modify some visual properties first by adding the following inside \c {scatterGraph}:
\snippet qmlscatter/qml/qmlscatter/main.qml 3
- We added a customized theme, changed the shadow quality, and adjusted the camera position.
- We're happy with the other visual properties, so we won't change them.
+ A customized theme was added, the shadow quality changed, and the camera position adjusted.
+ The other visual properties are fine, so there is no need to change them.
- The custom theme is based on a predefined theme \c {Theme3D.ThemeQt}, but we change the font
- in it:
+ The custom theme is based on a predefined theme, \c {Theme3D.ThemeQt}, but the font in it
+ is changed:
\snippet qmlscatter/qml/qmlscatter/main.qml 13
- Then it's time to start feeding the graph some data.
+ Then, start feeding the graph some data.
\section1 Adding Data to the Graph
- Let's create a \c Data item inside the \c mainView and name it \c seriesData:
+ Create a \c Data item inside the \c mainView and name it \c seriesData:
\snippet qmlscatter/qml/qmlscatter/main.qml 4
- The \c seriesData item contains the data models for all three series we use in this example.
+ The \c seriesData item contains the data models for all three series used in this example.
- This is the component that holds our data in \c {Data.qml}. It has an \c Item as the main
+ This is the component that holds the data in \c {Data.qml}. It has an \c Item as the main
component.
- In the main component we'll add the data itself in a \c ListModel and name it
- \c {dataModel}:
+ In the main component, add the data itself to a \c ListModel and name it \c {dataModel}:
\snippet qmlscatter/qml/qmlscatter/Data.qml 0
\dots
- We'll add two more of these for the other two series, and name them \c dataModelTwo and
+ Add two more of these to the other two series, and name them \c dataModelTwo and
\c {dataModelThree}.
- Then we need to expose the data models to be usable from \c {main.qml}. We do this by defining
+ Then, expose the data models to be usable from \c {main.qml}. Do this by defining
them as aliases in the main data component:
\snippet qmlscatter/qml/qmlscatter/Data.qml 1
- Now we can use the data from \c Data.qml with \c scatterGraph in \c {main.qml}. First we'll add
+ Now you can use the data from \c Data.qml with \c scatterGraph in \c {main.qml}. First, add
a Scatter3DSeries and call it \c {scatterSeries}:
\snippet qmlscatter/qml/qmlscatter/main.qml 5
- Then we'll set up selection label format for the series:
+ Then, set up selection label format for the series:
\snippet qmlscatter/qml/qmlscatter/main.qml 10
- And finally the data for series one in a ItemModelScatterDataProxy. We set the data itself as
- \c itemModel for the proxy:
+ And finally, add the data for series one in a ItemModelScatterDataProxy. Set the data itself as
+ the \c itemModel for the proxy:
\snippet qmlscatter/qml/qmlscatter/main.qml 11
- We'll add the other two series in the same way, but modify some series-specific details a bit:
+ Add the other two series in the same way, but modify some series-specific details a bit:
\snippet qmlscatter/qml/qmlscatter/main.qml 12
\dots
- Then we'll modify the properties of the default axes in \c scatterGraph a bit:
+ Then, modify the properties of the default axes in \c scatterGraph a bit:
\snippet qmlscatter/qml/qmlscatter/main.qml 6
- After that we'll just add a few buttons to the \c mainView to control the graph. We'll only
- show one as an example:
+ After that, add a few buttons to the \c mainView to control the graph, one of which is shown as
+ an example:
\snippet qmlscatter/qml/qmlscatter/main.qml 7
- Then we'll modify \c dataView to make room for the buttons at the top:
+ Then, modify \c dataView to make some room for the buttons at the top:
\snippet qmlscatter/qml/qmlscatter/main.qml 8
\dots
- And we're done!
+ And you're done!
\section1 Example Contents
*/