HG_REPOSITORIES/LPP/INSTRUMENTATION/USERS/JEANDET/qtcharts Commit - r1385:c13c825c33e5

Documentation for QML custom model demo

Tero Ahola -

r1385:c13c825c33e5

parent child

Context file:

r1385:c13c825c33e5

Collapse all files

doc/src/demos-qmlcustommodel.qdoc created 644 +29 0

@@ -0,0 +1,29
	1	/*!
	2	\example demos/qmlcustommodel
	3	\title QML Custom Model
	4	\subtitle
	5
	6	This example shows how to use your own QAbstractItemModel derived data model as a data source for a ChartView.
	7	\image demos_qmlcustommodel.png
	8
	9	First we create a ChartView:
	10	\snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 1
	11
	12	Then our data model that contains the shares of top-5 car manufacturers in Finland for the last 5 years. The model
	13	could be constructed from various sources depending on the use case, but here we use static data for the sake of
	14	simplicity. Check customtablemodel.cpp, declarativemodel.cpp and plugin.cpp to see how to make your own
	15	QAbstractItemModel accessible on QML.
	16	\snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 2
	17
	18	Then we create several series as children for the same ChartView. First a pie series that illustrates the shares of
	19	the car manufacturers in Finland in 2011:
	20	\snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 3
	21
	22	And one line series for each manufacturer presenting the share between 2007-2011, for example this one is for
	23	Volkswagen. The series is not visible by default; it is made visible when the user clicks on the Volkswagen slice
	24	on the pie series:
	25	\snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 4
	26
	27	And finally a bar series that shows the share for all the other manufacturers between 2007-2011:
	28	\snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 5
	29	*/

demos/qmlcustommodel/declarativemodel.cpp 0 -12

@@ -94,16 +94,4 void DeclarativeTableModel::append(QVariantList values)
94	dataChanged(beginIndex, endIndex);	94	dataChanged(beginIndex, endIndex);
95	}	95	}
96		96
97	//void DeclarativeTableModel::appendPoint(QXYModelMapper mapper, DeclarativeXyPoint point)
98	//{
99	// Q_UNUSED(mapper)
100	// Q_UNUSED(point)
101	// // TODO: XYModelMapper implementation has change, this code has to be updated.
102	//// qDebug() << "DeclarativeTableModel::appendPoint:" << point;
103	//// QVariantList values;
104	//// values.insert(mapper->mapX(), point->x());
105	//// values.insert(mapper->mapY(), point->y());
106	//// append(values);
107	//}
108
109	#include "moc_declarativemodel.cpp"	97	#include "moc_declarativemodel.cpp"

demos/qmlcustommodel/declarativemodel.h 0 -1

             public:
                 explicit DeclarativeTableModel(QObject *parent = 0);
                 QDeclarativeListProperty<QObject> modelChildren();
-            //    void appendPoint(QXYModelMapper *mapper, DeclarativeXyPoint *point);
             public: // from QDeclarativeParserStatus
                 void classBegin();

demos/qmlcustommodel/qml/qmlcustommodel/main.qml +12 -3

             Rectangle {
                 width: parent.width
-                height: parent.height
+                height: parent.heigh
+                //![1]
                 ChartView {
                     id: chartView
                     title: "Top-5 car brand shares in Finland"
                     anchors.fill: parent
-                    theme: ChartView.ChartThemeLight
                     axisX.max: 10
                     axisX.min: 0
                     axisY.max: 20
                     axisY.min: 0
                     animationOptions: ChartView.SeriesAnimations
                     axisXLabels: [0, "2007", 1, "2008", 2, "2009", 3, "2010", 4, "2011", 5, "2012"]
+                    // ...
+                //![1]
-                    // For dynamic data we use a custom data model derived from QAbstractiItemModel
+                    //![2]
                     CustomModel {
                         id: customModel
                         CustomModelElement { values: [0, "Manufacturer", 0, 1, 2, 3, 4] }
                         CustomModelElement { values: [5, "Volvo", 7.1, 6.7, 6.5, 6.3, 7.0] }
                         CustomModelElement { values: [6, "Others", 57.7, 54.9, 48.7, 50.5, 51.7] }
                     }
+                    //![2]
+                    //![5]
                     BarSeries {
                         name: "Others"
                         barMargin: 0
                             first: 2
                         }
                     }
+                    //![5]
+                    //![4]
                     LineSeries {
                         name: "Volkswagen"
                         visible: false
                             first: 2
                         }
                     }
+                    //![4]
                     LineSeries {
                         name: "Toyota"
                         }
                     }
+                    //![3]
                     PieSeries {
                         id: pieSeries
                         size: 0.4
                             }
                         }
                     }
+                    //![3]
                     VPieModelMapper {
                         series: pieSeries

doc/src/demos.qdoc +1 0

                         <li><a href="demos-dynamicspline.html">Dynamic spline chart</a></li>
                         <li><a href="demos-qmlchart.html">Qml Basic Charts</a></li>
                         <li><a href="demos-qmlweather.html">Qml Weather</a></li>
+                        <li><a href="demos-qmlcustommodel.html">Qml Custom Model</a></li>
                     </ul>
                     </td>
                     </tr>

General Comments 0

Write
Preview

You need to be logged in to leave comments. Login now

No TODOs yet

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages