##// END OF EJS Templates
Drafting the new mapper api on QML
Tero Ahola -
r1221:d772c9d3a6aa
parent child
Show More
@@ -1,105 +1,130
1 /****************************************************************************
1 /****************************************************************************
2 **
2 **
3 ** Copyright (C) 2012 Digia Plc
3 ** Copyright (C) 2012 Digia Plc
4 ** All rights reserved.
4 ** All rights reserved.
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
6 **
6 **
7 ** This file is part of the Qt Commercial Charts Add-on.
7 ** This file is part of the Qt Commercial Charts Add-on.
8 **
8 **
9 ** $QT_BEGIN_LICENSE$
9 ** $QT_BEGIN_LICENSE$
10 ** Licensees holding valid Qt Commercial licenses may use this file in
10 ** Licensees holding valid Qt Commercial licenses may use this file in
11 ** accordance with the Qt Commercial License Agreement provided with the
11 ** accordance with the Qt Commercial License Agreement provided with the
12 ** Software or, alternatively, in accordance with the terms contained in
12 ** Software or, alternatively, in accordance with the terms contained in
13 ** a written agreement between you and Digia.
13 ** a written agreement between you and Digia.
14 **
14 **
15 ** If you have questions regarding the use of this file, please use
15 ** If you have questions regarding the use of this file, please use
16 ** contact form at http://qt.digia.com
16 ** contact form at http://qt.digia.com
17 ** $QT_END_LICENSE$
17 ** $QT_END_LICENSE$
18 **
18 **
19 ****************************************************************************/
19 ****************************************************************************/
20
20
21 import QtQuick 1.0
21 import QtQuick 1.0
22 import QtCommercial.Chart 1.0
22 import QtCommercial.Chart 1.0
23
23
24 Rectangle {
24 Rectangle {
25 width: parent.width
25 width: parent.width
26 height: parent.height
26 height: parent.height
27
27
28 ChartView {
28 ChartView {
29 id: chart
29 id: chart
30 title: "Top-5 car brand shares in Finland"
30 title: "Custom model example"
31 anchors.fill: parent
31 anchors.fill: parent
32 theme: ChartView.ChartThemeLight
32 theme: ChartView.ChartThemeLight
33
33
34 // For dynamic data you can use the ChartModel API.
34 // For dynamic data you can use the ChartModel API.
35 ChartModel {
35 ChartModel {
36 id: chartModel
36 id: chartModel
37 ChartModelElement { values: [0, "Volkswagen", 13.5] }
37 ChartModelElement { values: [0, "Volkswagen", 13.5, 4.4] }
38 ChartModelElement { values: [0, "Toyota", 10.9] }
38 ChartModelElement { values: [0, "Toyota", 10.9, 4.2] }
39 ChartModelElement { values: [0, "Ford", 8.6] }
39 ChartModelElement { values: [0, "Ford", 8.6, 3.0] }
40 ChartModelElement { values: [0, "Skoda", 8.2] }
40 ChartModelElement { values: [0, "Skoda", 8.2, 1.9] }
41 ChartModelElement { values: [0, "Volvo", 6.8] }
41 ChartModelElement { values: [0, "Volvo", 6.8, 1.5] }
42 }
42 }
43
43
44 LineSeries {
44 LineSeries {
45 name: "line"
45 name: "line"
46 // TODO: the current mapper api
46 model: chartModel
47 model: chartModel
47 modelMapper.mapX: 2
48 modelMapper.mapX: 3
48 modelMapper.mapY: 2
49 modelMapper.mapY: 3
50
51 // TODO: the new mapper api
52 // XYModelMapperVertical {
53 // model: chartModel
54 // xColumn: 0
55 // yColumn: 1
56 // }
49 }
57 }
50
58
59
51 PieSeries {
60 PieSeries {
52 id: pieSeries
61 id: pieSeries
53 model: chartModel
54 size: 0.4
62 size: 0.4
55 horizontalPosition: 0.2
63 horizontalPosition: 0.2
56 verticalPosition: 0.3
64 verticalPosition: 0.3
57 // Define how your data maps to pie slices with the ModelMapper API of the pie series
65
58 modelMapper.mapLabels: 1
66 // model: chartModel
59 modelMapper.mapValues: 2
67 // // TODO: the current mapper api
60 modelMapper.first: 0
68 // modelMapper.mapLabels: 1
61 modelMapper.count: -1 // "Undefined" = -1 by default
69 // modelMapper.mapValues: 2
62 modelMapper.orientation: PieModelMapper.Vertical
70 // modelMapper.first: 0
71 // modelMapper.count: -1 // "Undefined" = -1 by default
72 // modelMapper.orientation: PieModelMapper.Vertical
73
74 // TODO: the new mapper api
75 // PieModelMapperVertical {
76 // model: chartModel
77 // labelsColumn: 0
78 // valuesColumn: 1
79 // }
63 }
80 }
64
81
82 // TODO: the new mapper api
83 // PieModelMapperVertical {
84 // series: pieSeries
85 // model: chartModel
86 // labelsColumn: 0
87 // valuesColumn: 1
88 // }
89
65 AreaSeries {
90 AreaSeries {
66 name: "area"
91 name: "area"
67 upperSeries: LineSeries {
92 upperSeries: LineSeries {
68 model: chartModel
93 model: chartModel
69 modelMapper.mapX: 2
94 modelMapper.mapX: 2
70 modelMapper.mapY: 2
95 modelMapper.mapY: 2
71 }
96 }
72 lowerSeries: LineSeries {
97 lowerSeries: LineSeries {
73 model: chartModel
98 model: chartModel
74 modelMapper.mapX: 2
99 modelMapper.mapX: 2
75 modelMapper.mapY: 0
100 modelMapper.mapY: 0
76 }
101 }
77 }
102 }
78
103
79 // TODO: BarSeries with ChartModel base model API
104 // TODO: BarSeries with ChartModel base model API
80 // BarSeries {
105 // BarSeries {
81 // model: chartModel
106 // model: chartModel
82 // modelMapper.first: 0
107 // modelMapper.first: 0
83 // }
108 // }
84 }
109 }
85
110
86
111
87 // TODO: you could also implement appending to your model, for example:
112 // TODO: you could also implement appending to your model, for example:
88 // pieSeries.model.append(["Others", 52.0]);
113 // pieSeries.model.append(["Others", 52.0]);
89
114
90 // TODO: show how to use data from a list model in a chart view
115 // TODO: show how to use data from a list model in a chart view
91 // i.e. copy the data into a chart model
116 // i.e. copy the data into a chart model
92 // ListModel {
117 // ListModel {
93 // id: listModel
118 // id: listModel
94 // ListElement {
119 // ListElement {
95 // label: "Volkswagen"
120 // label: "Volkswagen"
96 // value: 13.5
121 // value: 13.5
97 // }
122 // }
98 // ListElement {
123 // ListElement {
99 // label: "Toyota"
124 // label: "Toyota"
100 // value: 10.9
125 // value: 10.9
101 // }
126 // }
102 // // and so on...
127 // // and so on...
103 // }
128 // }
104
129
105 }
130 }
General Comments 0
You need to be logged in to leave comments. Login now