##// END OF EJS Templates
Documentation of QML ChartView, Axis and Legend
Tero Ahola -
r1475:b687c49332c3
parent child
Show More
@@ -51,6 +51,8 Rectangle {
51 XyPoint { x: 2.2; y: 2.9 }
51 XyPoint { x: 2.2; y: 2.9 }
52 XyPoint { x: 2.4; y: 2.7 }
52 XyPoint { x: 2.4; y: 2.7 }
53 XyPoint { x: 2.67; y: 2.65 }
53 XyPoint { x: 2.67; y: 2.65 }
54 //![2]
54 }
55 }
55 }
56 }
57 //![2]
56 }
58 }
@@ -28,61 +28,63 Rectangle {
28
28
29 Loader {
29 Loader {
30 id: loader
30 id: loader
31 anchors.top: parent.top
31 anchors.fill: parent
32 anchors.bottom: buttons.top
33 anchors.left: parent.left
34 anchors.right: parent.right
35 source: "View" + viewNumber + ".qml";
32 source: "View" + viewNumber + ".qml";
36 }
33 }
37
34
38 Row {
39 id: buttons
40 anchors.bottom: parent.bottom
41 anchors.bottomMargin: 15
42 anchors.horizontalCenter: parent.horizontalCenter
43 spacing: 5
44
45 Rectangle {
35 Rectangle {
46 height: 35
36 id: infoText
47 width: 60
37 anchors.centerIn: parent
48 border.color: "#c8955c"
38 width: parent.width
49 border.width: 2
39 height: 40
50 radius: 5
40 color: "black"
51 Text {
41 Text {
42 color: "white"
52 anchors.centerIn: parent
43 anchors.centerIn: parent
53 text: "<"
44 text: "Use left and right arrow keys to navigate between chart types"
54 }
45 }
46
47 Behavior on opacity {
48 NumberAnimation { duration: 400 }
49 }
50 }
51
55 MouseArea {
52 MouseArea {
53 focus: true
56 anchors.fill: parent
54 anchors.fill: parent
57 onClicked: {
55 onClicked: {
58 var i = viewNumber - 1;
56 if (infoText.opacity > 0) {
59 if (i <= 0)
57 infoText.opacity = 0.0;
60 viewNumber = 9;
58 } else {
61 else
59 nextView();
62 viewNumber = i;
63 }
60 }
64 }
61 }
62 Keys.onPressed: {
63 if (infoText.opacity > 0) {
64 infoText.opacity = 0.0;
65 } else {
66 if (event.key == Qt.Key_Left) {
67 previousView();
68 } else {
69 nextView();
65 }
70 }
66 Rectangle {
67 height: 35
68 width: 60
69 border.color: "#c8955c"
70 border.width: 2
71 radius: 5
72 Text {
73 anchors.centerIn: parent
74 text: ">"
75 }
71 }
76 MouseArea {
72 }
77 anchors.fill: parent
73 }
78 onClicked: {
74
75 function nextView() {
79 var i = viewNumber + 1;
76 var i = viewNumber + 1;
80 if (i > 9)
77 if (i > 9)
81 viewNumber = 1;
78 viewNumber = 1;
82 else
79 else
83 viewNumber = i;
80 viewNumber = i;
84 }
81 }
85 }
82
86 }
83 function previousView() {
84 var i = viewNumber - 1;
85 if (i <= 0)
86 viewNumber = 9;
87 else
88 viewNumber = i;
87 }
89 }
88 }
90 }
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
1 NO CONTENT: modified file, binary diff hidden
NO CONTENT: modified file, binary diff hidden
@@ -4,7 +4,7
4 \keyword Charts QML API
4 \keyword Charts QML API
5
5
6 QtCommercial Charts QML API is an intuitive and simple way to show charts in your QML
6 QtCommercial Charts QML API is an intuitive and simple way to show charts in your QML
7 applications. The following example QML shows you how to create a simple pie chart:
7 applications. The following QML shows you to create a simple pie chart:
8 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 1
8 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 1
9 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 2
9 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 2
10 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 3
10 \snippet ../examples/qmlpiechart/qml/qmlpiechart/main.qml 3
@@ -34,10 +34,11 QTCOMMERCIALCHART_BEGIN_NAMESPACE
34
34
35 ChartView element is the parent that is responsible for showing different chart series types.
35 ChartView element is the parent that is responsible for showing different chart series types.
36
36
37 \section1 Example Usage
37 The following QML shows how to create a simple line chart:
38 \snippet ../demos/qmlchart/qml/qmlchart/View2.qml 1
38
39
39 \beginfloatleft
40 \beginfloatleft
40 \image demos_qmlchart1.png
41 \image demos_qmlchart2.png
41 \endfloat
42 \endfloat
42 \clearfloat
43 \clearfloat
43 */
44 */
@@ -28,8 +28,6 QTCOMMERCIALCHART_BEGIN_NAMESPACE
28 /*!
28 /*!
29 \qmlclass LineSeries QLineSeries
29 \qmlclass LineSeries QLineSeries
30
30
31 \section1 Example Usage
32
33 \beginfloatleft
31 \beginfloatleft
34 \image demos_qmlchart2.png
32 \image demos_qmlchart2.png
35 \endfloat
33 \endfloat
@@ -28,15 +28,14 QTCOMMERCIALCHART_BEGIN_NAMESPACE
28 /*!
28 /*!
29 \qmlclass ScatterSeries QScatterSeries
29 \qmlclass ScatterSeries QScatterSeries
30
30
31 \section1 Example Usage
31 The following QML shows how to create a chart with two simple scatter series:
32 \snippet ../demos/qmlchart/qml/qmlchart/View5.qml 1
33 \snippet ../demos/qmlchart/qml/qmlchart/View5.qml 2
32
34
33 \beginfloatleft
35 \beginfloatleft
34 \image demos_qmlchart5.png
36 \image demos_qmlchart5.png
35 \endfloat
37 \endfloat
36 \clearfloat
38 \clearfloat
37
38 The following QML shows how to create a simple scatter chart:
39 \snippet ../demos/qmlchart/qml/qmlchart/View5.qml 1
40 */
39 */
41
40
42 DeclarativeScatterSeries::DeclarativeScatterSeries(QObject *parent) :
41 DeclarativeScatterSeries::DeclarativeScatterSeries(QObject *parent) :
@@ -41,6 +41,18 QTCOMMERCIALCHART_BEGIN_NAMESPACE
41 There is only one x Axis, however there can be multiple y axes on a ChartView.
41 There is only one x Axis, however there can be multiple y axes on a ChartView.
42 Each chart series can be bound to exactly one Y axis and the shared common X axis.
42 Each chart series can be bound to exactly one Y axis and the shared common X axis.
43 Axis can be setup to show axis line with tick marks, grid lines and shades.
43 Axis can be setup to show axis line with tick marks, grid lines and shades.
44
45 To access Axes you can use ChartView API. For example:
46 \code
47 ChartView {
48 axisX.min: 0
49 axisX.max: 3
50 axisX.ticksCount: 4
51 axisY.min: 0
52 axisY.max: 4
53 // Add a few series...
54 }
55 \endcode
44 */
56 */
45
57
46 /*!
58 /*!
@@ -65,7 +65,7 QTCOMMERCIALCHART_BEGIN_NAMESPACE
65 \brief Legend is part of QtCommercial Chart QML API.
65 \brief Legend is part of QtCommercial Chart QML API.
66
66
67 Legend is a graphical object, whics displays legend of the chart. Legend state is updated by ChartView, when
67 Legend is a graphical object, whics displays legend of the chart. Legend state is updated by ChartView, when
68 series have been changed. Legend is referenced via ChartView class. For example:
68 series have been changed. Legend is used via ChartView class. For example:
69 \code
69 \code
70 ChartView {
70 ChartView {
71 legend.visible: true
71 legend.visible: true
General Comments 0
You need to be logged in to leave comments. Login now