##// END OF EJS Templates
HG_REPOSITORIES » LPP » INSTRUMENTATION » USERS » JEANDET » qtcharts
RSS

Clone from http://code.qt.io/qt/qtcharts.git

World Weather Online credits to the QML weather app
Tero Ahola -
r1390:2c5f43a71879
parent child
Show More
Side by Side Unified
Context file:
r1390:2c5f43a71879 Loading diff...:
Show file before | Show file after | Hide comments
@@ -1,158 +1,167
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.1
21 import QtQuick 1.1
22 import QtCommercial.Chart 1.0
22 import QtCommercial.Chart 1.0
23
23
24 Rectangle {
24 Rectangle {
25 width: 360
25 width: 360
26 height: 360
26 height: 360
27
27
28 //![1]
28 //![1]
29 ChartView {
29 ChartView {
30 id: chartView
30 id: chartView
31 title: "Weather forecast"
31 title: "Weather forecast"
32 //![1]
32 //![1]
33 anchors.top: parent.top
33 anchors.top: parent.top
34 anchors.bottom: weatherImageRow.top
34 anchors.bottom: weatherImageRow.top
35 anchors.left: parent.left
35 anchors.left: parent.left
36 anchors.right: parent.right
36 anchors.right: parent.right
37 legend.alignment: Qt.AlignTop
37 legend.alignment: Qt.AlignTop
38 axisXLabels: ["0", "Mo", "1", "Tu", "2", "We", "3", "Th", "4", "Fr", "5", "Sa"]
38 axisXLabels: ["0", "Mo", "1", "Tu", "2", "We", "3", "Th", "4", "Fr", "5", "Sa"]
39
39
40 //![2]
40 //![2]
41 BarSeries {
41 BarSeries {
42 BarSet {
42 BarSet {
43 id: rainfallSet
43 id: rainfallSet
44 name: "Rainfall"
44 name: "Rainfall"
45 }
45 }
46 }
46 }
47
47
48 ScatterSeries {
48 ScatterSeries {
49 id: maxTempSeries
49 id: maxTempSeries
50 name: "Max. temperature"
50 name: "Max. temperature"
51 }
51 }
52
52
53 ScatterSeries {
53 ScatterSeries {
54 id: minTempSeries
54 id: minTempSeries
55 name: "Min. temperature"
55 name: "Min. temperature"
56 }
56 }
57 //![2]
57 //![2]
58 }
58 }
59
59
60 // A timer to refresh the forecast every 5 minutes
60 // A timer to refresh the forecast every 5 minutes
61 Timer {
61 Timer {
62 interval: 300000
62 interval: 300000
63 repeat: true
63 repeat: true
64 triggeredOnStart: true
64 triggeredOnStart: true
65 running: true
65 running: true
66 onTriggered: {
66 onTriggered: {
67 if (weatherAppKey != "") {
67 if (weatherAppKey != "") {
68 //![3]
68 //![3]
69 // Make HTTP GET request and parse the result
69 // Make HTTP GET request and parse the result
70 var xhr = new XMLHttpRequest;
70 var xhr = new XMLHttpRequest;
71 xhr.open("GET",
71 xhr.open("GET",
72 "http://free.worldweatheronline.com/feed/weather.ashx?q=Jyv%c3%a4skyl%c3%a4,Finland&format=json&num_of_days=5&key="
72 "http://free.worldweatheronline.com/feed/weather.ashx?q=Jyv%c3%a4skyl%c3%a4,Finland&format=json&num_of_days=5&key="
73 + weatherAppKey);
73 + weatherAppKey);
74 xhr.onreadystatechange = function() {
74 xhr.onreadystatechange = function() {
75 if (xhr.readyState == XMLHttpRequest.DONE) {
75 if (xhr.readyState == XMLHttpRequest.DONE) {
76 var a = JSON.parse(xhr.responseText);
76 var a = JSON.parse(xhr.responseText);
77 parseWeatherData(a);
77 parseWeatherData(a);
78 }
78 }
79 }
79 }
80 xhr.send();
80 xhr.send();
81 //![3]
81 //![3]
82 } else {
82 } else {
83 // No app key for worldweatheronline.com given by the user -> use static data
83 // No app key for worldweatheronline.com given by the user -> use static data
84 var responseText = "{ \"data\": { \"current_condition\": [ {\"cloudcover\": \"10\", \"humidity\": \"61\", \"observation_time\": \"06:26 AM\", \"precipMM\": \"0.0\", \"pressure\": \"1022\", \"temp_C\": \"6\", \"temp_F\": \"43\", \"visibility\": \"10\", \"weatherCode\": \"113\", \"weatherDesc\": [ {\"value\": \"Sunny\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0001_sunny.png\" } ], \"winddir16Point\": \"SE\", \"winddirDegree\": \"140\", \"windspeedKmph\": \"7\", \"windspeedMiles\": \"4\" } ], \"request\": [ {\"query\": \"Jyvaskyla, Finland\", \"type\": \"City\" } ], \"weather\": [ {\"date\": \"2012-05-09\", \"precipMM\": \"0.4\", \"tempMaxC\": \"14\", \"tempMaxF\": \"57\", \"tempMinC\": \"7\", \"tempMinF\": \"45\", \"weatherCode\": \"116\", \"weatherDesc\": [ {\"value\": \"Partly Cloudy\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png\" } ], \"winddir16Point\": \"S\", \"winddirDegree\": \"179\", \"winddirection\": \"S\", \"windspeedKmph\": \"20\", \"windspeedMiles\": \"12\" }, {\"date\": \"2012-05-10\", \"precipMM\": \"2.4\", \"tempMaxC\": \"13\", \"tempMaxF\": \"55\", \"tempMinC\": \"8\", \"tempMinF\": \"46\", \"weatherCode\": \"266\", \"weatherDesc\": [ {\"value\": \"Light drizzle\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0017_cloudy_with_light_rain.png\" } ], \"winddir16Point\": \"SW\", \"winddirDegree\": \"219\", \"winddirection\": \"SW\", \"windspeedKmph\": \"21\", \"windspeedMiles\": \"13\" }, {\"date\": \"2012-05-11\", \"precipMM\": \"11.1\", \"tempMaxC\": \"15\", \"tempMaxF\": \"59\", \"tempMinC\": \"7\", \"tempMinF\": \"44\", \"weatherCode\": \"266\", \"weatherDesc\": [ {\"value\": \"Light drizzle\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0017_cloudy_with_light_rain.png\" } ], \"winddir16Point\": \"SSW\", \"winddirDegree\": \"200\", \"winddirection\": \"SSW\", \"windspeedKmph\": \"20\", \"windspeedMiles\": \"12\" }, {\"date\": \"2012-05-12\", \"precipMM\": \"2.8\", \"tempMaxC\": \"7\", \"tempMaxF\": \"44\", \"tempMinC\": \"2\", \"tempMinF\": \"35\", \"weatherCode\": \"317\", \"weatherDesc\": [ {\"value\": \"Light sleet\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0021_cloudy_with_sleet.png\" } ], \"winddir16Point\": \"NW\", \"winddirDegree\": \"311\", \"winddirection\": \"NW\", \"windspeedKmph\": \"24\", \"windspeedMiles\": \"15\" }, {\"date\": \"2012-05-13\", \"precipMM\": \"0.4\", \"tempMaxC\": \"6\", \"tempMaxF\": \"42\", \"tempMinC\": \"2\", \"tempMinF\": \"35\", \"weatherCode\": \"116\", \"weatherDesc\": [ {\"value\": \"Partly Cloudy\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png\" } ], \"winddir16Point\": \"WNW\", \"winddirDegree\": \"281\", \"winddirection\": \"WNW\", \"windspeedKmph\": \"21\", \"windspeedMiles\": \"13\" } ] }}";
84 var responseText = "{ \"data\": { \"current_condition\": [ {\"cloudcover\": \"10\", \"humidity\": \"61\", \"observation_time\": \"06:26 AM\", \"precipMM\": \"0.0\", \"pressure\": \"1022\", \"temp_C\": \"6\", \"temp_F\": \"43\", \"visibility\": \"10\", \"weatherCode\": \"113\", \"weatherDesc\": [ {\"value\": \"Sunny\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0001_sunny.png\" } ], \"winddir16Point\": \"SE\", \"winddirDegree\": \"140\", \"windspeedKmph\": \"7\", \"windspeedMiles\": \"4\" } ], \"request\": [ {\"query\": \"Jyvaskyla, Finland\", \"type\": \"City\" } ], \"weather\": [ {\"date\": \"2012-05-09\", \"precipMM\": \"0.4\", \"tempMaxC\": \"14\", \"tempMaxF\": \"57\", \"tempMinC\": \"7\", \"tempMinF\": \"45\", \"weatherCode\": \"116\", \"weatherDesc\": [ {\"value\": \"Partly Cloudy\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png\" } ], \"winddir16Point\": \"S\", \"winddirDegree\": \"179\", \"winddirection\": \"S\", \"windspeedKmph\": \"20\", \"windspeedMiles\": \"12\" }, {\"date\": \"2012-05-10\", \"precipMM\": \"2.4\", \"tempMaxC\": \"13\", \"tempMaxF\": \"55\", \"tempMinC\": \"8\", \"tempMinF\": \"46\", \"weatherCode\": \"266\", \"weatherDesc\": [ {\"value\": \"Light drizzle\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0017_cloudy_with_light_rain.png\" } ], \"winddir16Point\": \"SW\", \"winddirDegree\": \"219\", \"winddirection\": \"SW\", \"windspeedKmph\": \"21\", \"windspeedMiles\": \"13\" }, {\"date\": \"2012-05-11\", \"precipMM\": \"11.1\", \"tempMaxC\": \"15\", \"tempMaxF\": \"59\", \"tempMinC\": \"7\", \"tempMinF\": \"44\", \"weatherCode\": \"266\", \"weatherDesc\": [ {\"value\": \"Light drizzle\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0017_cloudy_with_light_rain.png\" } ], \"winddir16Point\": \"SSW\", \"winddirDegree\": \"200\", \"winddirection\": \"SSW\", \"windspeedKmph\": \"20\", \"windspeedMiles\": \"12\" }, {\"date\": \"2012-05-12\", \"precipMM\": \"2.8\", \"tempMaxC\": \"7\", \"tempMaxF\": \"44\", \"tempMinC\": \"2\", \"tempMinF\": \"35\", \"weatherCode\": \"317\", \"weatherDesc\": [ {\"value\": \"Light sleet\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0021_cloudy_with_sleet.png\" } ], \"winddir16Point\": \"NW\", \"winddirDegree\": \"311\", \"winddirection\": \"NW\", \"windspeedKmph\": \"24\", \"windspeedMiles\": \"15\" }, {\"date\": \"2012-05-13\", \"precipMM\": \"0.4\", \"tempMaxC\": \"6\", \"tempMaxF\": \"42\", \"tempMinC\": \"2\", \"tempMinF\": \"35\", \"weatherCode\": \"116\", \"weatherDesc\": [ {\"value\": \"Partly Cloudy\" } ], \"weatherIconUrl\": [ {\"value\": \"http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png\" } ], \"winddir16Point\": \"WNW\", \"winddirDegree\": \"281\", \"winddirection\": \"WNW\", \"windspeedKmph\": \"21\", \"windspeedMiles\": \"13\" } ] }}";
85 var a = JSON.parse(responseText);
85 var a = JSON.parse(responseText);
86 parseWeatherData(a);
86 parseWeatherData(a);
87 }
87 }
88 }
88 }
89 }
89 }
90
90
91 Row {
91 Row {
92 id: weatherImageRow
92 id: weatherImageRow
93 anchors.bottom: parent.bottom
93 anchors.bottom: poweredByText.top
94 anchors.bottomMargin: 10
94 anchors.bottomMargin: 10
95 anchors.left: parent.left
95 anchors.left: parent.left
96 anchors.leftMargin: 25
96 anchors.leftMargin: 25
97 anchors.right: parent.right
97 anchors.right: parent.right
98 anchors.rightMargin: 25
98 anchors.rightMargin: 25
99
99
100 ListModel {
100 ListModel {
101 id: weatherImageModel
101 id: weatherImageModel
102 }
102 }
103
103
104 Repeater {
104 Repeater {
105 id: repeater
105 id: repeater
106 model: weatherImageModel
106 model: weatherImageModel
107 delegate: Image {
107 delegate: Image {
108 source: imageSource
108 source: imageSource
109 width: weatherImageRow.width / weatherImageModel.count
109 width: weatherImageRow.width / weatherImageModel.count
110 height: width
110 height: width
111 fillMode: Image.PreserveAspectCrop
111 fillMode: Image.PreserveAspectCrop
112 }
112 }
113 }
113 }
114 }
114 }
115
115
116 Text {
117 id: poweredByText
118 anchors.bottom: parent.bottom
119 anchors.bottomMargin: 10
120 anchors.left: parent.left
121 anchors.leftMargin: 25
122 text: "Powered by World Weather Online"
123 }
124
116 function parseWeatherData(weatherData) {
125 function parseWeatherData(weatherData) {
117 // Clear previous values
126 // Clear previous values
118 chartView.axisX.min = 0;
127 chartView.axisX.min = 0;
119 chartView.axisX.max = 5;
128 chartView.axisX.max = 5;
120 chartView.axisY.min = 0;
129 chartView.axisY.min = 0;
121 chartView.axisY.max = 5;
130 chartView.axisY.max = 5;
122 maxTempSeries.clear();
131 maxTempSeries.clear();
123 minTempSeries.clear();
132 minTempSeries.clear();
124 weatherImageModel.clear();
133 weatherImageModel.clear();
125
134
126 //![4]
135 //![4]
127 // Loop through the parsed JSON
136 // Loop through the parsed JSON
128 for (var i in weatherData.data.weather) {
137 for (var i in weatherData.data.weather) {
129 var weatherObj = weatherData.data.weather[i];
138 var weatherObj = weatherData.data.weather[i];
130 //![4]
139 //![4]
131
140
132 //![5]
141 //![5]
133 // Store temperature values, rainfall and weather icon
142 // Store temperature values, rainfall and weather icon
134 maxTempSeries.append(i, weatherObj.tempMaxC);
143 maxTempSeries.append(i, weatherObj.tempMaxC);
135 minTempSeries.append(i, weatherObj.tempMinC);
144 minTempSeries.append(i, weatherObj.tempMinC);
136 rainfallSet.append(i, weatherObj.precipMM);
145 rainfallSet.append(i, weatherObj.precipMM);
137
146
138 weatherImageModel.append({"imageSource":weatherObj.weatherIconUrl[0].value});
147 weatherImageModel.append({"imageSource":weatherObj.weatherIconUrl[0].value});
139 //![5]
148 //![5]
140
149
141 // Update scale of the chart
150 // Update scale of the chart
142 chartView.axisX.min = 0;
151 chartView.axisX.min = 0;
143 chartView.axisX.max = i;
152 chartView.axisX.max = i;
144 while (chartView.axisY.min >= Number(weatherObj.tempMinC))
153 while (chartView.axisY.min >= Number(weatherObj.tempMinC))
145 chartView.axisY.min = chartView.axisY.min - 10;
154 chartView.axisY.min = chartView.axisY.min - 10;
146 while (chartView.axisY.max <= Number(weatherObj.tempMaxC))
155 while (chartView.axisY.max <= Number(weatherObj.tempMaxC))
147 chartView.axisY.max = chartView.axisY.max + 10;
156 chartView.axisY.max = chartView.axisY.max + 10;
148
157
149 // Set the x-axis labels to the dates of the forecast
158 // Set the x-axis labels to the dates of the forecast
150 // TODO: the API could probably be more intuitive..
159 // TODO: the API could probably be more intuitive..
151 // Now it takes an array of strings: chartView.axisXLabels = ["value1", "label1", "value2", "label2", ...]
160 // Now it takes an array of strings: chartView.axisXLabels = ["value1", "label1", "value2", "label2", ...]
152 var xLabels = chartView.axisXLabels;
161 var xLabels = chartView.axisXLabels;
153 xLabels[Number(i) * 2] = i;
162 xLabels[Number(i) * 2] = i;
154 xLabels[(Number(i) * 2) + 1] = weatherObj.date.substring(5, 10);
163 xLabels[(Number(i) * 2) + 1] = weatherObj.date.substring(5, 10);
155 chartView.axisXLabels = xLabels;
164 chartView.axisXLabels = xLabels;
156 }
165 }
157 }
166 }
158 }
167 }
General Comments 0
You need to be logged in to leave comments. Login now