{"id":960,"date":"2019-07-07T21:05:50","date_gmt":"2019-07-07T19:05:50","guid":{"rendered":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/?page_id=960"},"modified":"2019-07-31T11:47:51","modified_gmt":"2019-07-31T09:47:51","slug":"5-5-dades","status":"publish","type":"page","link":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/5-5-dades\/","title":{"rendered":"5.5. Dades"},"content":{"rendered":"<p>El cap\u00edtol 12 del llibre ens parla de com recuperar dades de fonts externes. Explica dues possibilitats:<\/p>\n<ul>\n<li>la <strong>recuperaci\u00f3 de dades <em>csv<\/em><\/strong>, que \u00e9s un format que podem generar amb fulls de c\u00e0lcul, i<\/li>\n<li>la <strong>recuperaci\u00f3 de dades <em>json<\/em><\/strong>, que \u00e9s un est\u00e0ndard de compartici\u00f3 de dades mitjan\u00e7ant internet.<\/li>\n<\/ul>\n<p>Cada cas s\u2019ha de tractar de manera diferent, ja que les dades ens arriben de maneres diferents. El format <em>csv<\/em> ens ser\u00e0 \u00fatil per a recuperar dades que tinguem nosaltres o dades que en passin des de fitxers de full de c\u00e0lcul. Com sabreu, els fulls de c\u00e0lcul tenen files i columnes i el que es recupera s\u00f3n les files i les columnes que caldr\u00e0 tractar d\u2019alguna manera. L\u2019exemple 12-2 parteix d\u2019un arxiu amb una sola fila i l\u2019exemple 12-3 ja treballa amb files i columnes.<\/p>\n<p>El format <em>json<\/em> guarda per a cada registre informaci\u00f3 de qu\u00e8 \u00e9s cada valor. Com explica el llibre, el format <em>csv<\/em> ocupa menys, per\u00f2 en canvi pot ser menys clar. De nou, amb aquest format t\u00e9 dos exemples: el 15-4 on recupera un sol registre i el 15-5 on recupera un conjunt de registres i fa servir un <em>array<\/em> d\u2019objectes per a guardar les dades.<\/p>\n<p>Finalment, aquest cap\u00edtol parla de les <a href=\"https:\/\/es.wikipedia.org\/wiki\/Interfaz_de_programaci%C3%B3n_de_aplicaciones\" target=\"_blank\" rel=\"noopener\">API<\/a> per\u00f2 b\u00e0sicament es refereix a l\u2019acc\u00e9s a dades obertes que podem recuperar de bases de dades p\u00fabliques.<\/p>\n<h2>Exercici<\/h2>\n<p>Modificar la funci\u00f3 <span style=\"font-family: Courier, Arial;\">owl<\/span> de l\u2019exemple 9-7 per tal que permeti indicar un color en comptes d\u2019un to de gris. La funci\u00f3 rebr\u00e0, doncs, sis par\u00e0metres:<\/p>\n<pre>function own(x,y,r,g,b,s)<\/pre>\n<p>On <em>r<\/em>, <em>g<\/em>, <em>b<\/em> seran els valors dels tres colors b\u00e0sics (<em>red<\/em>, <em>green<\/em>, <em>blue<\/em>). El cos del mussol es pintar\u00e0 segons el color indicat. La manera de pintar la cara es pot deixar tal com est\u00e0 a la funci\u00f3 original.<\/p>\n<p>Les funcions <span style=\"font-family: Courier, Arial;\">setup()<\/span> i <span style=\"font-family: Courier, Arial;\">draw()<\/span> seran aquestes:<\/p>\n<pre>function setup() {\r\n createCanvas(480, 120);\r\n}\r\nfunction draw() {\r\n background(204);\r\n randomSeed(0);\r\n for (var i = 35; i &lt; width + 40; i += 40) {\r\n  var r = int(random(0, 102));\r\n  var g = int(random(0, 102));\r\n  var b = int(random(0, 102));\r\n  var scalar = random(0.25, 1.0);\r\n  owl(i, 110, r, g, b, scalar);\r\n }\r\n}<\/pre>\n<p>I el que es pintar\u00e0 \u00e9s aix\u00f2:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-967\" src=\"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-content\/uploads\/sites\/17\/2019\/07\/PID_00258586_5_003.jpg\" alt=\"\" width=\"500\" height=\"128\" srcset=\"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-content\/uploads\/sites\/17\/2019\/07\/PID_00258586_5_003.jpg 500w, http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-content\/uploads\/sites\/17\/2019\/07\/PID_00258586_5_003-300x77.jpg 300w\" sizes=\"(max-width: 500px) 100vw, 500px\" \/><\/p>\n<h2>Soluci\u00f3 a l\u2019exercici<\/h2>\n<h3>Mussol de colors<\/h3>\n<pre>function owl(x, y, r, g, b, s) {\r\n push();\r\n translate(x, y);\r\n scale(s); \/\/ Set the scale\r\n stroke(r,g,b); <strong>\/\/ Seleccionem el color<\/strong>\r\n strokeWeight(70);\r\n line(0, -35, 0, -65); \/\/ Body\r\n noStroke();\r\n fill(255-g);\r\n ellipse(-17.5, -65, 35, 35); \/\/ Left eye dome\r\n ellipse(17.5, -65, 35, 35); \/\/ Right eye dome\r\n arc(0, -65, 70, 70, 0, PI); \/\/ Chin\r\n fill(g);\r\n ellipse(-14, -65, 8, 8); \/\/ Left eye\r\n ellipse(14, -65, 8, 8); \/\/ Right eye\r\n quad(0, -58, 4, -51, 0, -44, -4, -51); \/\/ Beak pop();\r\n}\r\n\r\n<\/pre>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>El cap\u00edtol 12 del llibre ens parla de com recuperar dades de fonts externes. Explica dues possibilitats: la recuperaci\u00f3 de dades csv, que \u00e9s un format que podem generar amb fulls de c\u00e0lcul, i la recuperaci\u00f3 de dades json, que \u00e9s un est\u00e0ndard de compartici\u00f3 de dades mitjan\u00e7ant internet. Cada cas s\u2019ha de tractar de [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false},"acf":[],"_links":{"self":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/pages\/960"}],"collection":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/comments?post=960"}],"version-history":[{"count":6,"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/pages\/960\/revisions"}],"predecessor-version":[{"id":3282,"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/pages\/960\/revisions\/3282"}],"wp:attachment":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/programacio\/wp-json\/wp\/v2\/media?parent=960"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}