· 6 years ago · Jan 11, 2020, 01:02 PM
1/*
2Einführung JSON
3Zugriff auf API
4Auslesen von Werten
5Current
6https://api.weatherstack.com/current?access_key=2580abcd35aaf3945f989be3f68aa54c&query=Rotkreuz
7Forecast
8https://api.weatherstack.com/forecast?access_key=2580abcd35aaf3945f989be3f68aa54c&query=New York&forecast_days=7
9
10Dokumentation
11https://weatherstack.com/documentation
12 */
13
14let key='2580abcd35aaf3945f989be3f68aa54c'; // digital ideation key. persönlicher Gebrauch! 3 Monate gültig
15
16//for the sun function
17let angleA = 4;
18let speedA = 3;
19let speedB = 0;
20let radius = 10;
21let angle = 0;
22
23//for the rain function
24let swarm = [];
25let run = [];
26let w=0;
27let amount = 590;
28
29
30let tempNoiseX = 25;
31let tempNoiseY = 2;
32let tempTilesNumber = 25;
33let spining = 0;
34
35let winddir;
36let temperature = 0;
37
38let tempState = 1;
39let cloudcover;
40let rainIntensity;
41let sunnyweather;
42
43let dataLoaded = false;
44
45function preload(){
46 let url = 'https://api.weatherstack.com/current?access_key='+key+'&query=Rotkreuz';
47 loadJSON(url, gotWeather);
48}
49
50function setup() {
51 createCanvas(700, 700);
52//background(random(150,200));
53background(178,178,220,100)
54drawTemperature(tempNoiseX, tempNoiseY, tempTilesNumber, getColor(temperature));
55//drawTemperature(tempNoiseX, tempNoiseY, tempTilesNumber, getColor(30));
56
57//for the rain
58for (let i = 0; i < amount; i++) {
59 swarm[i] = random(0, 700);
60 run[i] = random(4,6);
61 }
62
63
64}
65
66function draw() {
67 //background(random(150,200));
68 //drawTemperature(tempNoiseX, tempNoiseY, tempTilesNumber, getColor(temperature));
69
70 if (!dataLoaded)
71 return;
72
73
74 if (rainIntensity > 0.2)
75 {
76 drawTemperature(tempNoiseX, tempNoiseY, tempTilesNumber, getColor(temperature));
77 getRainIntensity()
78 }
79
80 if (weather_descriptions.includes("Sunny"))
81 {
82 sunnyWeather()
83 }
84
85 if (weather_descriptions.includes("Snow"))
86 {
87 drawTemperature(tempNoiseX, tempNoiseY, tempTilesNumber, getColor(temperature));
88 getSnow()
89 }
90
91 drawWind(getWindDir(winddir));
92 //drawWind(getWindDir("E"));
93
94 drawClouds();
95
96}
97
98function getWindDir(winddir)
99{
100 let direction = {x : 0, y : 0};
101 if (winddir.includes("N"))
102 {
103 direction.x = width/2;
104 direction.y = 40;
105 }
106 else if (winddir.includes("S"))
107 {
108 direction.x = width/2;
109 direction.y = 660;
110 }
111
112 if (winddir.includes("W"))
113 {
114 direction.x = 40;
115 direction.y = 350;
116 }
117 else if (winddir.includes("E"))
118 {
119 direction.y = width/2;
120 direction.x = 660;
121 }
122 return direction;
123}
124
125/*
126Return an array corresponding to the values rgb depending on the specified temperature
127*/
128function getColor(temperature)
129{
130 return temperature > 30 ? [201, 46, 98] :
131 temperature > 25 ? [65, 167, 166] :
132 temperature > 20 ? [253, 188,180] :
133 temperature > 15 ? [162, 143, 151] :
134 temperature > 10 ? [236, 232, 228] :
135 temperature > 5 ? [150, 200, 217] :
136 temperature > 0 ? [139, 139, 175] :
137
138 [139, 139, 175];
139
140 // if (temperature > 30)
141 // {
142 // return [255, 17, 0];
143 // }
144 // else
145 // {
146 // if (temperature > 20)
147 // {
148 // return [255, 98, 0];
149 // }
150 // else
151 // {
152 // if (temperature > 10)
153 // {
154 // return [219, 186, 75];
155 // }
156 // else {
157 // return [95, 102, 237];
158 // }
159 // }
160 // }
161}
162
163function drawTemperature(noiseX, noiseY, tiles, color) {
164 ellipseMode(CENTER);
165
166 let xOff = noiseX;
167 let yOff = noiseY;
168 //Deux dimensions avec deux arguments
169 for(let j=0.5; j<tiles;j++){
170 for(let i=0.5; i<tiles;i++){
171 let colorNoise = noise(yOff, xOff)*100;
172 fill(color[0] + colorNoise, color[1] + colorNoise, color[2] + colorNoise);
173
174 //color[3] + colorNoise), color[4] + colorNoise, color[5] + colorNoise,
175 // color[6] + colorNoise, color[7] + colorNoise;
176 noStroke();
177
178 rect(i*width/tiles,j*height/tiles,width/tiles, height/tiles);
179 //ellipse(i*width/10,j*height/30,width/tiles, height/0.2);
180
181 ellipse(i*width/tiles,j*height/tiles,width/tiles, height/tiles);
182
183 fill(color[0] + colorNoise-10, color[1] + colorNoise-10, color[2] + colorNoise)
184 //fill(255,200);
185 ellipse(i*width/tiles,j*height/tiles,(width/tiles)/1.5, (height/tiles)/1.5);
186
187 fill(color[0] + colorNoise-30, color[1] + colorNoise-30, color[2] + colorNoise)
188
189 ellipse(i*width/tiles,j*height/tiles,(width/tiles)/3, (height/tiles)/3);
190
191 xOff+=0.6;
192
193
194 }
195 }
196
197
198
199};
200
201function drawWind(direction)
202{
203 let center = {x : 0, y : 0};
204 //let length = 200;
205 //strokeWeight(10);
206 //stroke(206, 27, 27);
207 //line (center.x, center.y, center.x + direction.x * length, center.y + direction.y * length);
208noStroke();
209 fill(255);
210 //rect (center.x + direction.x, center.y + direction.y, 20,20);
211ellipse (center.x + direction.x, center.y + direction.y, 30,30);
212 //drawCloud({x: center.x + direction.x, y: center.y + direction.y}, getRainIntensity(rainIntensity));
213 //* length, center.y + direction.y * length);
214}
215
216function drawClouds()
217{
218 drawCloud({x : width / 2, y : height / 2});
219}
220
221/*function getRainIntensity(rainIntensity)
222{
223 let max = 3;
224 return Math.min(rainIntensity, max);
225} */
226
227function getRainIntensity(rainIntensity)
228{
229 push();
230translate(width/2-85,height/2-20)
231 randomSeed(300);
232 for (let i = 0; i < swarm.length; i++) {
233 let x = random(0, width-450);
234
235 fill(random(20,255),110,random(100,230));
236 circle(x, swarm[i], random(1,6));
237 swarm[i] += run[i];
238 if (swarm[i] - w > height+100) {
239 swarm[i] = - w;
240
241 }
242 }
243 pop();
244 }
245
246
247 function getSnow()
248 {
249
250push();
251 randomSeed(300);
252 for (let i = 0; i < swarm.length; i++) {
253 let x = random(0, width);
254
255 fill(255);
256 circle(x, swarm[i], random(1,6));
257 swarm[i] += run[i];
258 if (swarm[i] - w > height+100) {
259 swarm[i] = - w;
260
261 }
262 }
263pop();
264 }
265
266
267function sunnyWeather()
268{
269 let a = map(sin(radians(angle)), -10, 1, 0, 255);
270let Ay = radius+100 * sin(radians(angleA)+10);
271 let Ax = radius-200 * cos(radians(angleA)+10);
272
273push();
274 translate(width/2, height/2);
275
276 // Point
277
278 fill(255,247,123,100);
279 angleA += speedA;
280
281 //rotate(PI / 3.5);
282 rotate(angleA);
283
284 stroke(255);
285 strokeWeight(2);
286 //ellipse (Ax, Ay, Ax, Ay);
287// triangle(Ax, 30, Ay, Ax, 6, Ax-10);
288 triangle(Ax, Ay, 30, 10, Ax+20, Ay+20);
289
290 fill(253,188,250,100);
291 stroke(150,200,217);
292 strokeWeight(2);
293 //ellipse (Ax, Ay, Ax, Ay);
294// triangle(Ax, 30, Ay, Ax, 6, Ax-10);
295 triangle(Ax-10, Ay-10, 30, 10, Ax-30, Ay-30);
296
297fill(256,219,184,100);
298 rect(0,0,0.3,50);
299pop();
300 }
301
302
303
304function gotWeather(weather) {
305 console.log(weather);
306 winddir=weather.current.wind_dir;
307 temperature=weather.current.temperature;
308 cloudcover=weather.current.cloudcover;
309 rainIntensity = weather.current.precip;
310 dataLoaded = true;
311 weather_descriptions = weather.current.weather_descriptions[0].split(" ");
312
313}