{"id":215,"date":"2018-01-19T11:27:25","date_gmt":"2018-01-19T11:27:25","guid":{"rendered":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/?page_id=215"},"modified":"2018-01-30T13:49:06","modified_gmt":"2018-01-30T13:49:06","slug":"4-3-1-tipus-dimatge-en-un-entorn-digital","status":"publish","type":"page","link":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/4-3-1-tipus-dimatge-en-un-entorn-digital\/","title":{"rendered":"4.3.1. Tipus d&#8217;imatge en un entorn digital"},"content":{"rendered":"<p>En un entorn digital ens trobarem b\u00e0sicament amb dos tipus d\u2019imatges: <strong>vectorials<\/strong> i de <strong>mapa de bits<\/strong>.<\/p>\n<div class=\"featured featured-blue\"><p>Una imatge de mapa de bits (tamb\u00e9 coneguda com a imatge <em>raster<\/em> o imatge de p\u00edxels) \u00e9s una graella bidimensional de quadr\u00edcules o cel\u00b7les anomenades p\u00edxels.<\/p>\n<\/div>\n<p class=\"Normalesp\"><span lang=\"CA\">Com si d\u2019un paper mil\u00b7limetrat es tract\u00e9s, cada quadr\u00edcula intenta representar la informaci\u00f3 d\u2019una fotografia, dibuix, etc. i rep el nom de p\u00edxel. Cada p\u00edxel, al seu torn, emmagatzema informaci\u00f3 sobre quatre canals de color, coneguts normalment com RGBA (<em>Red<\/em>, <em>Green<\/em>, <em>Blue<\/em> i <em>Alpha<\/em>), l\u2019\u00faltim dels quals es refereix al grau de transpar\u00e8ncia.<\/span><\/p>\n<div class=\"featured featured-blue\"><p>Una imatge vectorial s\u2019emmagatzema de manera diferent descrivint diverses figures geom\u00e8triques (l\u00ednies, corbes, pol\u00edgons) que, conjuntament, creen una imatge.<\/p>\n<\/div>\n<div class=\"featured featured-grey\"><\/p>\n<p>Suposem que prenem la foto d\u2019un cercle blau sobre un fons blanc. Si l\u2019emmagatzemem com a mapa de bits, el que tindrem ser\u00e0 una quadr\u00edcula que codificar\u00e0 l\u2019escena p\u00edxel a p\u00edxel, amb una majoria de p\u00edxels blancs i uns quants de blaus que defineixen un cercle.<\/p>\n<p>En canvi, pel que fa a la imatge vectorial equivalent d\u2019aquest mateix cercle blau el fitxer contindr\u00e0 informaci\u00f3 d\u2019on est\u00e0 el centre del cercle en la imatge, quant mesura el radi, quin \u00e9s el gruix de la l\u00ednia i el mat\u00eds de blau del cercle.<\/p>\n<p>Suposem que la nostra fotografia del cercle blau est\u00e0 codificada en una graella de 100 x 100 p\u00edxels. Aix\u00f2 vol dir que ocupa un total de 10.000 p\u00edxels. Cada p\u00edxel ha de contenir informaci\u00f3 sobre vermell, blau, verd i transpar\u00e8ncia, i per tant necessitem 4 bytes. Aix\u00f2 ens dona 40.000 bytes, que dividits per 1.024 ens donen un total de 39 kB.<\/p>\n<p>Aquest mateix cercle, convertit en imatge vectorial, ocupar\u00e0 uns quants bytes: les coordenades del centre del cercle, la longitud del radi, el gruix de la l\u00ednia i el color del cercle.<\/p>\n<p>\n<\/div>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>En un entorn digital ens trobarem b\u00e0sicament amb dos tipus d\u2019imatges: vectorials i de mapa de bits. Com si d\u2019un paper mil\u00b7limetrat es tract\u00e9s, cada quadr\u00edcula intenta representar la informaci\u00f3 d\u2019una fotografia, dibuix, etc. i rep el nom de p\u00edxel. Cada p\u00edxel, al seu torn, emmagatzema informaci\u00f3 sobre quatre canals de color, coneguts normalment com [&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\/prod-digital\/wp-json\/wp\/v2\/pages\/215"}],"collection":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/comments?post=215"}],"version-history":[{"count":3,"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/pages\/215\/revisions"}],"predecessor-version":[{"id":901,"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/pages\/215\/revisions\/901"}],"wp:attachment":[{"href":"http:\/\/disseny-test.uoc.edu\/materials\/prod-digital\/wp-json\/wp\/v2\/media?parent=215"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}