Marco Tarini, Università dell'insubria AA 2016/2017. Computer Graphics. Facciamo una primissima applicaizone grafica rasterization based
|
|
|
- Norberto Rossini
- 6 anni fa
- Visualizzazioni
Transcript
1 Computer Graphics Hello Triangle Università dell Insubria Corso di Laurea in Informatica Anno Accademico 2016/17 HELLO WORLD, I M A TRIANGLE! Marco Tarini Piano Facciamo una primissima applicaizone grafica rasterization based Mandiamo un triangolo 2D a schermo Hello Triangle Il corrispondente dell «hello world» di molti linguaggi di program Avvertenze: Sarà più faticoso del tipico «hello world» C è molto da mettere a punto per mandare anche un solo triangolo (e, in compenso, non poi molto di più per una scena complessa) Il progetto usa congiuntamente TRE linguaggi: HTML, JavaScript (con WebGL), GLSL ogni pezzo è scritto in uno dei tre Seguiremo abbastanza da vicino il libro di testo «Introduction to Computer Graphics: A Practical Learning Approach» Grafica computazionale - Es 00 1
2 Linguaggi HTML, JavaScript: Useremo meno costrutti possibili solo quelli strettamente necessari (ma è possibile espandere il progetto per chi li conosce) Spiegheremo (al volo) le features principali che ci serviranno La rete trabocca di ottimi tutorials, manuali, etc su ciascuno di loro GLSL: Lo stesso linguaggio GLSL usato nel ray tracer visto a lezione Una state machine Le API di OpenGL sono basate sullo stato Lo stato corrente include ad esempio, il clear color (colore di con cui cancellare lo schermo) e molto, molto altro Molti comandi OpenGL/WebGL non fanno nulla di immediato cambiano lo stato, dunque il comportamento dei comandi successivi (queries sullo stato: glget ( COSTANTE, valori_da_riempire ); ) es (in C): double v[4]; glgetdoublev( gl.color_clear_value, v ); Grafica computazionale - Es 00 2
3 WebGL pipeline (su GPU) Mesh: vertex array buffer GPU-RAM vertex puller Input Vertex: XYZ (object space) vertex shader Transformed Vertex: XY (clip space) primitive assembler (& setup) Primitive: point ( 1 x V ) line ( 2 x V ) triangle ( 3 x V ) r r WebGL pipeline : rasterizer punti rasterizer lines rasterizer triangles Fragments: buffer pos (fixed, XY) + interpolated attributes fragment shader Pixels: RGB output combiner Frame buffer to screen Grafica computazionale - Es 00 3
4 WebGL pipeline Vertex Puller (VP) prende i vertici da buffers in memoria Video Vertex Shader (VS) include la transform. geometrica Primitive Assembler (PA) ogni 1,2,3 vertici produce una primitiva Rasterizer (RS) fabbrica tutti i frammenti: edge test + inteprolaz attributi Fragment Shader (FS) produce i pixel values, include tipicamente il lighting Output Combiner (OC) depth test, alpha blend, stencil ops, etc programmable! in GLSL (OpenGL Shading Language) First Rendering (hello world): piano Mandiamo un semplice triangolo Ogni stato del pipeline settato al minimo indispensabile per questo task No transform, no lighting. Vertex shader minimale: simply pass down the vertices Fragment shader minimale: give the same color to all fragments Grafica computazionale - Es 00 4
5 Plan of attack 1. Costruiamo una paginetta per il nostro programma 2. Initializzaziamo WebGL 3. Prepariamo un buffer in memoria GPU con le coord del triangolo 4. Settiamo ogni fase del pipeline 5. Disegnamo HTML JavaScript (+ WebGL) e GLSL HTML Page <html> <head> <script> /* qui il JavaScript */ </script> </head> <body> <canvas id = miocanvas" width = 500 height = 500 style = "border: 1px solid black" ></canvas> </body> </html> head body Grafica computazionale - Es 00 5
6 Scheletro degli script Specifichiamo che è JavaScript ma può essere sottointeso <script type="text/javascript"> function initwebgl() { } function setupvertexarraybuffer () { } function setupvertexpuller() { } function setupshaders() { } function render() { } function main() { initwebgl(); setupvertexarraybuffer(); setupvertexpuller(); setupshaders(); draw(); } </script> window.onload = main; Passo 2: inizializziamo WebGL OpenGL (tutte le versioni) = state machine comandi per cambiare lo stato interno (non fanno nulla di visibile) comandi per far cose il risultato dipende dallo stato in OpenGL base: lo stato è implicito (aka rendering context ) in WebGL: stato = JavaScript object: WebGLRenderingContext legato ad un Canvas HTML (l output del rendering) funzioni WebGL = metodi di questo object var gl = null; /* contesto (var globale) */ function setupwebgl() { var canvas = document.getelementbyid("output-canvas"); gl = canvas.getcontext("webgl"); } Grafica computazionale - Es 00 6
7 Passo 2: inizializziamo WebGL (notes) Associamo la var JavasScipt canvas al canvas HTML definito nel sorgente HTML della pagina I Canvas sono oggetti su cui WebGL disegna L alpha può essere usato per la trasparenza nei confronti degli altri elementi HTML Il metodo getcontext restutisce il suo contesto WebGL webgl is the string denoting it in most browsers in some cases you need to use experimental-webgl Tutte le funzioni / variabili / constanti di WebGL sono membri di questo context gl. Codice per disegnare: preliminare cancellare lo schermo Red Green Blue Alpha function draw() { gl.clearcolor( 0.0, 0.0, 0.0, 1.0 ); gl.clear( gl.color_buffer_bit ); /*... */ } Specifichiamo che vogliamo cancellare del Frame ( color ) Buffer (la griglia di RGB) (vedremo che ci sono altri buffer in output) Grafica computazionale - Es 00 7
8 Codice per disegnare: preliminare cancellare lo schermo Il comando clearcolor modifica lo stato (specifica con che colore cancellare lo schermo) Il comando clear fa resetta uno o più buffer (specificando quali) maschera di bit è una «framebuffer operation» agisce direttamente sui buffer in output, senza passare dal pipeline Reminder: Clip Space + 1 IL CANVAS Clip Space (proj normalized space) Grafica computazionale - Es 00 8
9 Riempiamo il Vertex Array Buffer Un buffer in GPU mem che contiene un array di vertici Per ogni vertice, tutti i suoi dati i dati associati ai vertice sono detti «attributi» per noi (per ora), l unico attributo è la POSIZIONE 2D Prima prepariamo un buffer coi i dati da tenere in memoria CPU (system RAM), con JavaScript: var single_triangle_mesh = { vertexpositions : [ [0.0, 0.0], // 1st vertex [1.0, 0.0], // 2nd vertex [0.0, 1.0], // 3rd vertex ] }; Riempiamo il Vertex Array Buffer var mymesh = { vertexpositions : [ [0.0, 0.0], // 1st vertex [1.0, 0.0], // 2nd vertex [0.0, 1.0], // 3rd vertex ] }; una buona struttura intuiviva, ma non va bene per WebGL. Ci vuole più semplice / a basso livello! Grafica computazionale - Es 00 9
10 Riempiamo il Vertex Array Buffer var mymesh = [ ]; 0.0, 0.0, // 1st vertex 1.0, 0.0, // 2nd vertex 0.0, 1.0 // 3rd vertex struttura piatta (singolo livello): meglio, ma non va ancora bene per WebGL Here s why not: JavaScript does not represent arrays as contiguous areas (reason: they can be non-homogenous) Definiamo cosa disegnare positions var positions = [ ]; 0.0, 0.0, // 1st vertex 1.0, 0.0, // 2nd vertex 0.0, 1.0 // 3rd vertex 0.0 Usiamo invece una struttra dati apposita (array di record omogenei e contigui): il Float32Array System RAM Grafica computazionale - Es 00 10
11 Riempiamo il Vertex Array Buffer var javacriptarray = [ 0.0, 0.0, 1.0, 0.0, 0.0, 1.0 ]; var data = new Float32Array( javacriptarray ); javacriptarray data System RAM Definiamo cosa disegnare var javascriptarray = [ 0.0, 0.0, 1.0, 1.0, 1.0, 1.0 ]; var data = new Float32Array( javascriptarray ); o, in alternativa: var data = new Float32Array(6); // 6 floats (3x2) data[0] = 0.0; data[1] = 0.0; data[2] = 1.0; data[3] = 0.0; data[4] = 0.0; data[5] = 1.0; comunque: data (System RAM) (CPU RAM) Grafica computazionale - Es 00 11
12 Object Names (concetto generale in WebGL / OpenGL) Situazione: ho degli oggetti che abitano in Video RAM tipicamente, duplicati da oggetti inizialmente in System RAM es: array buffer, index buffer, programs, textures, etc Q: come agisco su questi oggetti? cioè, come mi riferisco ad essi? leggere, scrivere, etc, richiede di passare dal BUS! A: attraverso «object names» : un indice di una data istanza di quel tipo di oggetto (uno specifico array buffer, etc) in pratica, un NUMERO che fa da ID dell oggetto il name è in System RAM (quindi una variabile JS, per noi) e punta ad un oggetto in Video RAM i names vengono creati attraverso apposite chiamate «create <something>» (che inizializza l ogg) o «gen <something>» vengono distrutti (liberati per usi futuri) attraverso «delete <something>» Binding (concetto generale in WebGL / OpenGL) Situazione: diversi comandi che agiscono su qualcosa (es: su un array buffer) istanze diverse di quel qualcosa (es: diversi array buffers, in Video ram) Q: come decido su quale delle istanza agisce un comando? Modo 1: passo sempre, a ciascun comando, (il name de) l istanza su cui intendo agire, Modo 2: in un dato momento un unica istanza «binded» (nello stato!) (es: un array buffer binded, un program binded, etc) Esiste un comando bind per settare qual è. I comandi successivi agiscono implicitamente su quell istanza. WebGL (OpenGL, etc): usa di solito il Modo 2 nota: l op di binding può avere un piccolo costo In realtà, si dice «bound» Grafica computazionale - Es 00 12
13 Carichiamo i dati del triangolo in un buffer sulla scheda video var tmp = [0.0, 0.0, 1.0, 1.0, 1.0, 1.0 ]; var data = new Float32Array(tmp); var bufferuffer = gl.createbuffer(); // crea un nome, es. 13 gl.bindbuffer(gl.array_buffer, positionsbuffer ); gl.bufferdata(gl.array_buffer, typedpositions, gl.static_draw); bufferid data array buffer N copy System RAM ( CPU RAM ) motherboard BUS Video RAM ( GPU RAM ) video card Carichiamo i dati del triangolo in un buffer sulla scheda video var positions = [0.0, 0.0, 1.0, 1.0, 1.0, 1.0 ]; var typedpositions = new Float32Array(positions); var positionsbuffer = gl.createbuffer(); // crea un nome, es. 13 gl.bindbuffer(gl.array_buffer, positionsbuffer ); gl.bufferdata(gl.array_buffer, typedpositions, gl.static_draw); positionsbuffer array buffer N System RAM ( CPU RAM ) motherboard BUS Video RAM ( GPU RAM ) video card Grafica computazionale - Es 00 13
14 Carichiamo i dati del triangolo in un buffer sulla scheda video (note) Copiare i dati in un oggetto WebGL in GPU-RAM: un array buffer var bufferid = gl.createbuffer(); name per il buffer in Video RAM (verrà usato per riferirsi ad esso in futuro) gl.bindbuffer(gl.array_buffer, bufferid ); gl.bufferdata(gl.array_buffer, data, gl.static_draw); dati (in system RAM) da cui copiare Bind: from now on, my commands relative to array buffers must be applied to this one credo che questo buffer verrà letto spesso, ma modificato di rado (please optimize stuff accordingly) Settiamo il Vertex Puller (in pratica, speighiamogli come i dati sono formattati nei buffer) In WebGL: vertex position = just another per-vertex attribute Scegliamo un index con cui riferirsi a questo attribute (facciamo, lo 0) const positionattribindex = 0; // global Abilitiamolo («caro Vertex Puller: questo attributo va mandato al Vertex Shader») gl.enablevertexattribarray( positionattribindex ); Specifichiamo il Context dell attributo (che tipo è + come accederlo) gl.vertexattribpointer( unsigned int index, int size, int type, bool normalized, unsigned int stride, unsigned int offset ); Nel nostro caso: gl.vertexattribpointer( positionattribindex, 2, gl.float, false, 0, 0 ); Grafica computazionale - Es 00 14
15 Settiamo il Vertex Puller (in pratica, speighiamogli come i dati sono formattati nei buffer) l attributo di indice 0 cosiste di 2 float successivi nel buffer (*) (quindi un vec2 ) storati direttamente come floating point (non fixed point, cioè interi / 2^32)... i due float per il vertice successivo li trovi dopo tot bytes ( stride ): (qui è 0 ==> quanto ti aspetti: 2*size_of_float ) a partire dalla posizione 0 del buffer ( offset ). queste info saranno usate dal vertex puller per passare gli attributi al vertex shader gl.vertexattribpointer( positionattribindex, 2, gl.float, false, 0, 0 ); (*) : quello attualmente binded Definiamo gli Shaders Ora dobbiamo fornire due programmi ( shaders ): vertex shader (da eseguire per ogni vertice) fragment shader (da eseguire per ogni frammento) Scritti nel linguaggio GLSL simile al C («C-like»): no oggetti alto livello (deve essere compliato) eseguito nella scheda video (nello stage corrispondente) vec2, vec3, vec4, mat4, etc come tipi base in Direct3D si sarebbe usato il simile linguaggio «HLSL» Per il nostro hello-world, scriveremo shader minimali: che facciano solo in minimo indispensabile, e cioè per il vertex shader: produrre coodrinate clip del vertice (per il Rasterizzatore) qui: usiamo quelle passate dal Vertex Puller come attributo, che sono già in coord clip (niente transform) per un fragment shader: produrre il colore RGB per frammento (per l Output Combiner) qui: usiamo un colore costante Grafica computazionale - Es 00 15
16 Shaders minimali Mesh: vertex array buffer GPU-RAM vertex puller Input Vertex: XYZ (object space) vertex shader attribute vec2 aposition; Transformed Vertex: XY (clip space) primitive assembler (& setup) void main(void) { gl_position = vec4( aposition, 0.0, 1.0 ); } Primitive: point ( 1 x V ) line ( 2 x V ) triangle ( 3 x V ) GLSL r r Shaders minimali e: rasterizer punti rasterizer lines rasterizer triangles Fragments fragment shader Pixels: RGB output combiner Color buffer to screen GPU-RAM void main(void) { gl_fragcolor = vec4(0.0, 0.0, 1.0, 1.0); } GLSL Grafica computazionale - Es 00 16
17 Shaders minimali vertex shader: attribute vec2 aposition; X & Y void main(void) { gl_position = vec4( aposition, 0.0, 1.0 ); } Z W (affine) GLSL fragment shader: void main(void) { gl_fragcolor = vec4(0.0, 0.0, 1.0, 1.0); } GLSL Setup della fase per vertice e per frammento Costriuire e compilare il Vertex Shader: var vssource = "..."; var vertexshader = gl.createshader(gl.vertex_shader); gl.shadersource( vertexshader, vssource); gl.compileshader( vertexshader ); Poi, ripetere per il Fragment shader Grafica computazionale - Es 00 17
18 Setup della fase per vertice e per frammento Name dello shader (per riferirsi a lui in futuro) Qui va immesso il sorgente dello shader (come stringa JS!) (un programma GLSL) o FRAGMENT_ ovviamente var vssource = "..."; var vertexshaderid = gl.createshader(gl.vertex_shader); gl.shadersource( vertexshaderid, vssource); gl.compileshader( vertexshaderid ); Questo shader ha questo sorgente Ebbene sì: compilazione (del GLSL) a tempo di esecuzione (del JS)! Risulato: un programma a basso livello che può essere eseguito sulla GPU. Può generare errori (di compilazione): usare gl.glgetshaderinfolog per farseli restituire Un modo pratico per includere il sorgente degli shaders (una stringa) nei file HTML <head> file: index.html <script type="text/glsl" id="ilmiovertshader" >... void main() {... } </script> GLSL <script type="text/javascript" >... var vertshadersource = document.getelementbyid("ilmiovertshader").textcontent;... JavaScript </script> </head> HTML5 Grafica computazionale - Es 00 18
19 GL Programs 1 Program = 1 Vertex shader + 1 Fragment shader + (eventuali altri shader) var programid = gl.createprogram(); gl.attachshader(programid, vertexshaderid); gl.attachshader(programid, fragmentshaderid); gl.bindattriblocation(programid, positionattribindex,"aposition"); gl.linkprogram(programid); gl.useprogram(programid); Costuiamo e settiamo un Program name per il program: (per riferirsi ad esso in futuro) ecco i fragment e vertex shader di cui è composto quello che il vertex puller chiama attributo di indice 0, negli shader di questo program si chiama "aposition" var programid = gl.createprogram(); gl.attachshader(programid, vertshaderid); gl.attachshader(programid, fragshaderid); gl.bindattriblocation( programid, 0, "aposition" ); gl.linkprogram(programid); gl.useprogram(programid); linking dei due shader (controllando che siano compatibili) (può generare errori!) ecco, fra tutti i program che ho definito fin ora (uno solo in realtà) ora attiviamo questo (fino a contrordine) Grafica computazionale - Es 00 19
20 Draw Alla fine, mandiamo il nostro primo triangolo (nella draw, dopo la cancellazione dello schermo): gl.drawarrays( gl.triangles, 0, 3); «manda nel pipeline 3 vertici, assemblandoli tre-a-tre in primitive TRIANGOLO, prendendo i loro vertici a partire dal primo (di indice 0)» Per una visione d insieme del codice, vedere l implementazione sul sito: Esercitaz 00 Consiglio: invece che utilizzare l implementazione fornita, scrivere la propria implementando uno ad uno tutti i passi come descritto qui Grafica computazionale - Es 00 20
Computer Graphics. Reminder: API. Il primo Hello World. Storia. Open Graphic Language Libreria C-like. Specifiche API. ver 4.
Computer Graphics Il primo Hello World Reminder: API Applicazioni Università dell Insubria Corso di Laurea in Informatica Anno Accademico 2014/15 HELLO WORLD, I M A TRIANGLE! SDK Algoritmi API Driver Scheda
Corso di Tecniche Avanzate per la Grafica
Corso di Tecniche Avanzate per la Grafica GLSL Docente: Massimiliano Corsini Laurea Specialistica in Informatica Università di Ferrara Cosa sono gli shaders? Gli shaders sono programmi che vengono eseguiti
Grafica Real-Time, Hardware Grafico e Linguaggi di Shading. Alessandro Martinelli
Grafica Real-Time, Hardware Grafico e Linguaggi di Shading Alessandro Martinelli Grafica Real Time Il concetto di 'Real Time' in ambito grafico ha una valenza molto particolare: Fino agli anni '80, solo
WebGL. Lezione 18: 15 Maggio 2014
WebGL Lezione 18: 15 Maggio 2014 Cronologia: Grafica 3D nell Hardware In principio (giurassico informatico) postazioni specializzate La Silicon Graphics si afferma come produttrice di workstation grafiche
scrivere window.alert(). 2 Nell esempio sarebbe scritto solo var hello, senza pertanto attribuire alla variabile hello alcun valore
In genere il metodo alert() è usato per verificare il valore delle variabili durante la fase di correzione degli errori (debugging), fase che può essere svolta anche con l ausilio di appositi programmi
Normal maps: come si ottengono (2/4)
Normal maps: come si ottengono (2/4) Photometric Stereo (una forma di inverse lighting ) da: N immagini (N>=4) reali Stesso punto di vista Illuminazione diversa (possibilmente, controllata e nota) a Normal
Computer Graphics. Memoria RAM nelle schede grafiche. Texture Mapping: paradigma di memoria. Concetto. Tessiture: Caso più comune.
Computer Graphics Memoria RAM nelle schede grafiche Lezione 3: Università dell Insubria Facoltà di Scienze MFN di Varese Corso di Laurea in Informatica Anno Accademico 202/3 molti dettagli a poco prezzo:
Cenni al rendering di ombre
Cenni al rendering di ombre Davide Gadia Corso di Programmazione Grafica per il Tempo Reale Laurea Magistrale in Informatica per la Comunicazione a.a. 2012/2013 Ombre Componenti fondamentali per aumentare
Lezione 6 Introduzione al C++ Mauro Piccolo
Lezione 6 Introduzione al C++ Mauro Piccolo piccolo@di.unito.it Linguaggi di programmazione Un linguaggio formale disegnato per descrivere la computazione Linguaggi ad alto livello C, C++, Pascal, Java,
Metodologie Informatiche Applicate al Turismo
Metodologie Informatiche Applicate al Turismo Esercitazione con HTML 5 - Video e Grafica Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://pages.di.unipi.it/milazzo milazzo di.unipi.it
ANALISI E SVILUPPO DI SHADER GRAFICI IN LINGUAGGIO GLSL ANALYSIS AND DEVELOPMENT OF GRAPHICS SHADERS USING GLSL
UNIVERSITÀ DEGLI STUDI DI PARMA FACOLTÀ DI INGEGNERIA Corso di Laurea in Ingegneria Informatica ANALISI E SVILUPPO DI SHADER GRAFICI IN LINGUAGGIO GLSL ANALYSIS AND DEVELOPMENT OF GRAPHICS SHADERS USING
Cenni al rendering di ombre
Cenni al rendering di ombre Davide Gadia Corso di Programmazione Grafica per il Tempo Reale Laurea Magistrale in Informatica per la Comunicazione a.a. 2013/2014 Ombre Componenti fondamentali per aumentare
Introduzione al C++ (continua)
Introduzione al C++ (continua) I puntatori Un puntatore è una variabile che contiene un indirizzo di memoria pi_greco 3.141592 pi_greco_ptr indirizzo di 3.141592 & DEREFERENZIAZIONE RIFERIMENTO * se x
Le cose da sapere prima di iniziare a creare un videogioco. Game Making e dintorni - Fabrizio Mascheroni 1
Le cose da sapere prima di iniziare a creare un videogioco Game Making e dintorni - Fabrizio Mascheroni 1 Contenuti 1. Introduzione 2. Cos è un videogioco 3. Com è Fatto un Videogioco 4. Cenni sulla Pipeline
Pipeline di rendering. Pipeline di rendering. Outline. Grafica off-line vs Grafica real-time
Pipeline di rendering Davide Gadia Corso di Programmazione Grafica per il Tempo Reale Laurea Magistrale in Informatica per la Comunicazione a.a. 2013/2014 Outline Grafica off-line vs Grafica real-time
9 - Array. Programmazione e analisi di dati Modulo A: Programmazione in Java. Paolo Milazzo
9 - Array Programmazione e analisi di dati Modulo A: Programmazione in Java Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso di Laurea
Allocazione dinamica della memoria
Andrea Marin Università Ca Foscari Venezia Laurea in Informatica Corso di Programmazione part-time a.a. 2011/2012 Tipi di memoria dati Nella macchina astratta C esistono tre tipi di memoria per allocare
Introduzione. Costruzione di Interfacce Primi passi in OpenGL. Sierpinski Gasket. Sierpinski gasket. Event driven programming. Stuttura del programma
Introduzione Costruzione di Interfacce Primi passi in OpenGL cignoni@iei.pi.cnr.it http://vcg.iei.pi.cnr.it/~cignoni Abbiamo visto Cosa significa rendering L approccio object viewer Mettiamo in pratica
Primi passi col linguaggio C
Andrea Marin Università Ca Foscari Venezia Laurea in Informatica Corso di Programmazione part-time a.a. 2011/2012 Come introdurre un linguaggio di programmazione? Obiettivi: Introduciamo una macchina astratta
Grafica al calcolatore - Computer Graphics
Grafica al calcolatore - Computer Graphics 8 Pipeline di rasterizzazione - 2 12/12/14 Grafica 2014 1 Riepilogo Operazioni geometriche Pixel processing 12/12/14 Grafica 2014 2 Rasterizzazione/scan connversion
Introduzione alla GPGPU Corso di sviluppo Nvidia CUDATM. Davide Barbieri
Introduzione alla GPGPU Corso di sviluppo Nvidia CUDATM Davide Barbieri Contatti skype: davbar86 mail: davide.barbieri@ghostshark.it Panoramica corso Introduzione al mondo delle GPU Modello GPGPU Nvidia
Gestione dinamica della memoria
Programmazione M-Z Ingegneria e Scienze Informatiche - Cesena A.A. 2016-2017 Gestione dinamica della memoria Pietro Di Lena - pietro.dilena@unibo.it A pessimistic programmer sees the array as half empty.
Esercitazione Google Maps
Esercitazione Google Maps Esercizio 1 Visualizzare i risultati della API comuni.php su una mappa geografica. Soluzione Come prima cosa, occorre creare una chiave di utilizzo della libreria Google Maps.
Guida introduttiva al PHP
Fabio Castellini 26/01/2016 Guida introduttiva al PHP Cos'è il PHP? Il PHP è un linguaggio di scripting interpretato, simile al JavaScript, per intenderci, originariamente concepito per la programmazione
Programmazione Java Variabili membro, Metodi La parola chiave final
Programmazione Java Variabili membro, Metodi La parola chiave final Davide Di Ruscio Dipartimento di Informatica Università degli Studi dell Aquila diruscio@di.univaq.it. Sommario 2 2» Variabili membro»
Il compilatore Dev-C++
Il compilatore Dev-C++ Compilatore per Windows: http://www.bloodshed.net/dev/index.html Oppure dal sito: http://web.tiscali.it/no-redirect-tiscali/adinfo/devcpp4970- gcc295.exe Informatica 1 1 Requisiti
Breve Ripasso del linguaggio C
Breve Ripasso del linguaggio C Michelangelo Diligenti Ingegneria Informatica e dell'informazione diligmic@diism.unisi.it Compilazione, linking, ecc sorgente oggetto librerie sorgente oggetto editor sorgente
Il linguaggio C. Puntatori e dintorni
Il linguaggio C Puntatori e dintorni 1 Puntatori : idea di base In C è possibile conoscere e denotare l indirizzo della cella di memoria in cui è memorizzata una variabile (il puntatore) es : int a = 50;
Complementi. - Ridefinizione di tipo - - Costrutto switch - - Programmazione su più file - - Parametri della funzione main - Funzione system -
Complementi - Ridefinizione di tipo - - Costrutto switch - - Programmazione su più file - - Parametri della funzione main - Funzione system - Università degli Studi di Brescia Prof. Massimiliano Giacomin
Fortran in pillole : prima parte
Fortran in pillole : prima parte Annamaria Mazzia Dipartimento di Metodi e Modelli Matematici per le Scienze Applicate Corso di Metodi Numerici per l Ingegneria Introduzione al Fortran Un libro consigliato
Laboratorio di Programmazione: Linguaggio C Lezione 21 del 19 maggio 2014
Laboratorio di Programmazione: Linguaggio C Lezione 21 del 19 maggio 2014 Damiano Macedonio Esercizio 1 Scrivere una funzione che riceve in ingresso un puntatore ad un array di interi e modifica tale array
Utilizza i tipi di dati comuni a tutto il framework.net Accesso nativo ai tipi.net (C# è nato con.net) Concetti fondamentali:
1 Tipi di dati 1 Tipi di dati Utilizza i tipi di dati comuni a tutto il framework.net Accesso nativo ai tipi.net (C# è nato con.net) Concetti fondamentali: Tutto è un oggetto Tutto eredita implicitamente
Caveat. Sintesi di Immagini. Sintesi di Immagini. Rendering: Approccio Fisico
Sintesi di Immagini Metafora fondamentale Object vs viewer Object (scene): rappresentazione digitale (forma e caratteristiche) di un oggetto reale tridimensionale Viewer: strumento che permette di otternere
Unità Didattica 1 Linguaggio C. Fondamenti. Struttura di un programma.
Unità Didattica 1 Linguaggio C Fondamenti. Struttura di un programma. 1 La storia del Linguaggio C UNIX (1969) - DEC PDP-7 Assembly Language BCPL - un OS facilmente accessibile che fornisce potenti strumenti
INTRODUZIONE ALLA PROGRAMMAZIONE
INTRODUZIONE ALLA PROGRAMMAZIONE Prof. Enrico Terrone A. S: 2008/09 Definizioni Programmare significa risolvere problemi col computer, cioè far risolvere problemi al computer attraverso un insieme di informazioni
Definizione di classi. Walter Didimo
Definizione di classi Walter Didimo Definizione di classi Fino ad ora abbiamo imparato a: creare oggetti da classi già pronte usare gli oggetti creati, invocando metodi la creazione e l uso di oggetti
GAME DEV: tools programming. Parte 2: programming
GAME DEV: tools programming Parte 2: programming Marco Tarini Tools per programmare un tool: 1. Tools per GUI programming 2. API grafiche (opengl, directx) 3. Interfacciamento con SO (sist. op.) finestre
Pipeline di rendering
Pipeline di rendering Davide Gadia Corso di Programmazione Grafica per il Tempo Reale Laurea Magistrale in Informatica per la Comunicazione a.a. 2012/2013 Outline Grafica off-line vs Grafica real-time
Fondamenti di Grafica Tridimensionale
Fondamenti di Grafica Tridimensionale La Pipeline Grafica Marco Di Benedetto marco.dibenedetto@isti.cnr.it Visualizzazione dell Informazione noi siamo qui Informazione mondo reale (es: 3D scans) creazione
Fondamenti di Grafica Tridimensionale
Fondamenti di Grafica Tridimensionale La Pipeline Grafica Marco Di Benedetto marco.dibenedetto@isti.cnr.it Visualizzazione dell Informazione noi siamo qui Informazione mondo reale (es: 3D scans) creazione
Programmazione. Andrea Passerini Informatica. Programmazione
Andrea Passerini passerini@disi.unitn.it Informatica Linguaggi di programmazione Il calcolatore è in grado di comprendere solo istruzioni in linguaggio macchina. Il linguaggio macchina non è adatto alla
Corso di Laurea in INFORMATICA
Corso di Laurea in INFORMATICA INGEGNERIA DELLA CONOSCENZA E SISTEMI ESPERTI (a.a. 2010-2011) MODULO 1 Parte I 1.4 CLIPS: C Language Integrated Production System Introduzione all'ambiente CLIPS. Claudia
ARTICOLO06: Cubo 3D (quarto esempio completo)
ARTICOLO06: Cubo 3D (quarto esempio completo) Salve a tutti! In questo articolo cercheremo di disegnare il nostro prima oggetto interamente 3D ( un insieme di poligoni). QUARTO ESEMPIO: CUBO COLORATO Finalmente
Puntatori, array, incrementi Array come parametri Array di puntatori. Programmazione 1. Lezione 12. Vincenzo Marra.
Programmazione 1 Lezione 12 Vincenzo Marra vincenzo.marra@unimi.it Dipartimento di Matematica Federigo Enriques Università degli Studi di Milano 28 maggio 2014 Puntatori ed array Nel linguaggio C esiste
Funzioni, Stack e Visibilità delle Variabili in C
Funzioni, Stack e Visibilità delle Variabili in C Programmazione I e Laboratorio Corso di Laurea in Informatica A.A. 2016/2017 Calendario delle lezioni Lez. 1 Lez. 2 Lez. 3 Lez. 4 Lez. 5 Lez. 6 Lez. 7
Capitolo 6 - Array. Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved.
1 Capitolo 6 - Array Array Array Gruppo di locazioni di memoria consecutive Stesso nome e tipo Per riferirsi a un elemento, specificare Nome dell array Posizione Formato: arrayname[ position number ] Primo
LEZIONE PRECEDENTE. 1 Abilità Informatiche e Telematiche. 03/04/2015 Dott. ssa Carmen De Maio
LEZIONE PRECEDENTE Introduzione a Sprite; Operatori e funzioni; Come usare i blocchi Movimenti per far muovere uno Sprite; Come usare i blocchi Penna per disegnare sullo stage; Esercizi 1 TO DO: Completa
Introduzione a API e game engine per la programmazione grafica
Introduzione a API e game engine per la programmazione grafica OpenGL e WebGL Davide Gadia Corso di Programmazione Grafica per il Tempo Reale Laurea Magistrale in Informatica per la Comunicazione a.a.
Esercizi di riepilogo (Fondamenti di Informatica 1 Walter Didimo)
Esercizi di riepilogo (Fondamenti di Informatica 1 Walter Didimo) Selezione di prove di esame al calcolatore Esercizio 1 (esame del 13/01/2006) La classe Matrice definisce oggetti che rappresentano matrici
INTRODUZIONE ALLA PROGRAMMAZIONE AD ALTO LIVELLO IL LINGUAGGIO JAVA. Fondamenti di Informatica - D. Talia - UNICAL 1. Fondamenti di Informatica
Fondamenti di Informatica INTRODUZIONE ALLA PROGRAMMAZIONE AD ALTO LIVELLO IL LINGUAGGIO JAVA Fondamenti di Informatica - D. Talia - UNICAL 1 Fondamenti di Informatica - Programma Un programma è una formulazione
A. Lorenzi, A. Rizzi Java. Programmazione ad oggetti e applicazioni Android Istituto Italiano Edizioni Atlas
Classi e oggetti A. Lorenzi, A. Rizzi Java. Programmazione ad oggetti e applicazioni Android Istituto Italiano Edizioni Atlas Oggetti La programmazione orientata agli oggetti, OOP (Object-Oriented Programming),
High Dynamic Range Rendering in OpenGL
Università degli Studi di Trieste Corso di Laurea Specialistica in Ingegneria Informatica Elementi di Grafica Digitale High Dynamic Range Rendering in OpenGL Studente: Alberto Dotta - 81700080 Docente:
Computer Graphics. v 1. Rasterizer: lines (segmenti) la rasterizzazione from vertex to pixels. Rasterizzazione: lines (segmenti)
Computer Graphics Università dell Insubria Corso di Laurea in Informatica la rasterizzazione from vertex to pixels Rasterizer: lines (segmenti) Vertici (punti in R 3 ) computazioni per vertice Z Vertici
Il sistema C è formato dal linguaggio C, dal preprocessore, dal compilatore, dalle librerie e da altri strumenti di supporto.
Sistema C e organizzazione del codice Il sistema C è formato dal linguaggio C, dal preprocessore, dal compilatore, dalle librerie e da altri strumenti di supporto. Un programma C è costituito da un insieme
Introduzione al Many/Multi-core Computing
Introduzione al Many/Multi-core Computing Sistemi Operativi e reti 6 giugno 2011 Outline del corso Introduzione Definizioni Motivazioni Storia Architettura Framework Algoritmica Parte I Introduzione Definizioni
Capitolo 5 -- Stevens
Libreria standard di I/O Capitolo 5 -- Stevens Libreria standard di I/O rientra nello standard ANSI C perché è stata implementata su molti sistemi operativi oltre che su UNIX le sue funzioni individuano
19 - Eccezioni. Programmazione e analisi di dati Modulo A: Programmazione in Java. Paolo Milazzo
19 - Eccezioni Programmazione e analisi di dati Modulo A: Programmazione in Java Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://www.di.unipi.it/ milazzo milazzo di.unipi.it Corso
ISA Input / Output (I/O) Data register Controller
ISA Input / Output (I/O) Numerose Periferiche di tanti tipi diversi, collegati alla CPU mediante BUS diversi. Solo Input (tastiera, mouse), producono dati che la CPU deve leggere. Solo Output (Schermo),
Problema: calcolare il massimo tra K numeri
Problema: calcolare il massimo tra K numeri Scrivere un algoritmo che fornisca in input ad un programma un numero K e K interi positivi. L algoritmo deve restituire il valore massimo tra quelli introdotti
Introduzione a Processing. Roberto Ranon
Introduzione a Processing Roberto Ranon www.dimi.uniud.it/ranon/processing.html 1 Processing è, insieme, un ambiente e linguaggio di programmazione per creare prodotti multimediali interattivi open source
Concetti base programmazione. Antonio Gallo
Concetti base programmazione Antonio Gallo info@laboratoriolibero.com Programma Insieme di istruzioni: Strtturato Ad oggetti Strutturato Ha una struttura più lineare Basato sui concetti di sequenza, selezione,
Istruzioni di controllo. Ancora sull istruzione if. then-else: else: Flusso di controllo. L istruzione if-then. then-else: else: Sintassi.
Istruzioni di controllo L istruzione if-then then-else: else: Sintassi Le istruzioni di un programma sono normalmente eseguite in sequenza Le istruzioni di controllo permettono di variare tale comportamento
Fondamenti di Informatica
Esercizio 1. (3 punti) Fondamenti di Informatica PROVA SCRITTA 25 gennaio 2016 Data l istruzione assembler MIPS add $1,$2,$3, memorizzata all interno della memoria istruzioni della CPU, descrive la sua
Informatica! Appunti dal laboratorio 1!
Informatica Appunti dal laboratorio 1 Sistema Operativo Windows Vista, Windows 7, Mac OS X, Linux, Debian, Red Hat, etc etc Il sistema operativo è un programma che serve a gestire TUTTE le risorse presenti
Analisi di massima: L utente dovrà inserire un numero limite, e tramite vari calcoli verrà stampato a video la sequenza.
Relazione tecnica Fibonacci ANDENA GIANMARCO Traccia: Creare un algoritmo che permetta, dato un valore intero e positivo, di stabilire la sequenza utilizzando la regola di fibonacci dei numeri fino al
Introduzione al Linguaggio C Corso di Informatica Laurea in Fisica
Introduzione al Linguaggio C Corso di Informatica Laurea in Fisica prof. ing. Corrado Santoro A.A. 2009-10 Dai flow-chart ai linguaggi... Abbiamo imparato ad usare uno strumento formale i flowchart per
perror: individuare l errore quando una system call restituisce -1
perror: individuare l errore quando una system call restituisce -1 Quando una system call (o una funzione di libreria) non va a buon fine, restituisce come valore -1 Come si fa a sapere più precisamente
A.A. 2006/2007 Laurea di Ingegneria Informatica. Fondamenti di C++ Horstmann Capitolo 3: Oggetti Revisione Prof. M. Angelaccio
A.A. 2006/2007 Laurea di Ingegneria Informatica Fondamenti di C++ Horstmann Capitolo 3: Oggetti Revisione Prof. M. Angelaccio Obbiettivi Acquisire familiarità con la nozione di oggetto Apprendere le proprietà
Variabili. Unità 2. Domenico Daniele Bloisi. Corso di Programmazione e Metodi Numerici Ingegneria Aerospaziale BAER
Corso di Programmazione e Metodi Numerici Ingegneria Aerospaziale BAER Domenico Daniele Bloisi Docenti Metodi Numerici prof. Vittoria Bruni vittoria.bruni@sbai.uniroma1.it Programmazione prof. Domenico
18 - Vettori. Programmazione e analisi di dati Modulo A: Programmazione in Java. Paolo Milazzo
18 - Vettori Programmazione e analisi di dati Modulo A: Programmazione in Java Paolo Milazzo Dipartimento di Informatica, Università di Pisa http://pages.di.unipi.it/milazzo milazzo di.unipi.it Corso di
Sommario. Problema computazionale Sviluppo software Algoritmi. Istruzioni Sequenziali, Condizionali, Cicliche; Javascript
Sommario Problema computazionale Sviluppo software Algoritmi Diagrammi di Flusso; Pseudo Codice Istruzioni Sequenziali, Condizionali, Cicliche; Javascript Il Problema computazionale È computazionale un
Computer Graphics. Stack di matrici di modellazione: reminder! (vedi lez 13) comporre una scena con la Model Transform. Note implementative
Computer Graphics Università dell Insubria Corso di Laurea in Informatica Anno Accademico 2014/15 Marco Tarini comporre una scena con la Model Transform Stack di matrici di modellaione: reminder! (vedi
Sistemi Mobili e Wireless Android - Risorse
Sistemi Mobili e Wireless Android - Risorse Stefano Burigat Dipartimento di Matematica e Informatica Università di Udine www.dimi.uniud.it/burigat stefano.burigat@uniud.it Risorse in Android In Android,
Le Funzioni e la Ricorsione
Aula V Dip. di Matematica G. Castelnuovo Univ. di Roma La Sapienza Le Funzioni e la Ricorsione Igor Melatti Slides disponibili (assieme ad altro materiale) in: http://www.dsi.uniroma1.it/ melatti/programmazione1.2007.2008.html
Programmazione Orientata agli Oggetti in Linguaggio Java
Programmazione Orientata agli Oggetti in Linguaggio Java Classi e Oggetti: Metafora Parte a versione 2.2 Questo lavoro è concesso in uso secondo i termini di una licenza Creative Commons (vedi ultima pagina)
Spazio di indirizzamento virtuale
Programmazione M-Z Ingegneria e Scienze Informatiche - Cesena A.A. 016-01 Spazio di indirizzamento virtuale Pietro Di Lena - pietro.dilena@unibo.it // The function name says it all int stack_overflow (){
Lezione 6 programmazione in Java
Lezione 6 programmazione in Java Nicola Drago drago@sci.univr.it Dipartimento di Informatica Università di Verona Anteprima Le costanti I vettori Cos è un vettore Come si usa I vari tipi di vettori Esempi
Scritto da Martedì 12 Luglio :14 - Ultimo aggiornamento Venerdì 15 Luglio :47
In questo articolo mostreremo come è possibile eseguire un programma esterno o uno script usando il linguaggio PHP. Le funzioni che si occupano di eseguire dei comandi sono quattro: - shell_exec() - exec()
Il linguaggio C. Notate che...
Il linguaggio C Notate che... 1 Il C è un linguaggio a blocchi int main (void) { blocco } 2 Il C è un linguaggio a blocchi (2) Non è possibile mischiare dichiarazioni e comandi! int main (void) { } Dichiarazione
Introduzione al MATLAB c Parte 3 Script e function
Introduzione al MATLAB c Parte 3 Script e function Lucia Gastaldi DICATAM - Sezione di Matematica, http://lucia-gastaldi.unibs.it Indice 1 M-file di tipo Script e Function Script Function 2 Gestione dell
Strutture dati e loro organizzazione. Gabriella Trucco
Strutture dati e loro organizzazione Gabriella Trucco Introduzione I linguaggi di programmazione di alto livello consentono di far riferimento a posizioni nella memoria principale tramite nomi descrittivi
Programmazione web lato client con JavaScript. Marco Camurri 1
Programmazione web lato client con JavaScript Marco Camurri 1 JavaScript E' un LINGUAGGIO DI PROGRAMMAZIONE che consente di inserire codice in una pagina web Sintassi simile a Java (e al C), ma NON E'
Introduzione ai Laboratori di Fondamenti di Analisi dei Dati. Antonino Furnari
Introduzione ai Laboratori di Fondamenti di Analisi dei Dati Antonino Furnari furnari@dmi.unict.it www.dmi.unict.it/~furnari/ Laboratori di FAD Docente: Antonino Furnari (www.dmi.unict.it/~furnari/); Ricevimento:
Computer Graphics. 3D Rendering. Digital representation of 3D objects. Scena 3D rendering image. Geometry of a 3D object. 3D Model
Computer Graphics 3D Rendering Università dell Insubria Digital representation of 3D objects Facoltà di Scienze MFN di Varese Corso di Laurea in Informatica Anno Accademico 2014/15 Scena 3D rendering image
Linguaggio C - sezione dichiarativa: costanti e variabili
Dipartimento di Elettronica ed Informazione Politecnico di Milano Informatica e CAD (c.i.) - ICA Prof. Pierluigi Plebani A.A. 2008/2009 Linguaggio C - sezione dichiarativa: costanti e variabili La presente
Informatica ALGORITMI E LINGUAGGI DI PROGRAMMAZIONE. Francesco Tura. F. Tura
Informatica ALGORITMI E LINGUAGGI DI PROGRAMMAZIONE Francesco Tura francesco.tura@unibo.it 1 Lo strumento dell informatico: ELABORATORE ELETTRONICO [= calcolatore = computer] Macchina multifunzionale Macchina
Corso di Tecniche Avanzate per la Grafica Texturing
Corso di Tecniche Avanzate per la Grafica Texturing Docente: Massimiliano Corsini Laurea Specialistica in Informatica Università di Ferrara Texturing Il concetto di texturing è importante Si tratta di
LEZIONE 11 IMPARIAMO A PROGRAMMARE: I DATI E LE VARIABILI Laboratorio di Informatica per l Educazione A. A. 2014/2015
1 LEZIONE 11 IMPARIAMO A PROGRAMMARE: I DATI E LE VARIABILI A. A. 2014/2015 PRIMI PASSI La più semplice sequenza di istruzioni che possiamo scrivere è quella costituita da un solo comando. come si fa a
Funzioni. Unità 1. Domenico Daniele Bloisi. Corso di Fondamenti di Informatica Ingegneria delle Comunicazioni BCOR Ingegneria Elettronica BELR
Corso di Fondamenti di Informatica Ingegneria delle Comunicazioni BCOR Ingegneria Elettronica BELR Domenico Daniele Bloisi Docenti Parte I prof. Silvio Salza salza@dis.uniroma1.it http://www.dis.uniroma1.it/~salza/fondamenti.htm
Esempio. Le istruzioni corrispondono a quelle di sopra, ma sono scritte in modo simbolico. E indipendente dalla machina
Il compilatore C Astrazione Linguaggio macchina implica la conoscenza dei metodi usati per la rappresentazione dell informazioni nella CPU Linguaggio Assembly è il linguaggio delle istruzioni che possono
Programmazione orientata agli oggetti La classe Object, metodi e classi final, this. Object
Programmazione orientata agli oggetti La classe, metodi e classi final, this 1 La classe Negli esempi fatti nella prima parte del corso abbiamo definito alcune classi, per esempio Counter e Orologio, senza
layout senza tabelle Posizionamento con i CSS Ad ogni elemento HTML corrisponde un area rettangolare, detta box Contenuto
Posizionamento con i CSS creare layout senza tabelle 1 Gestione degli elementi della pagina Il box model Ad ogni elemento HTML corrisponde un area rettangolare, detta box Margine Bordo Area di padding
Programmazione Java Struttura di una classe, Costruttore, Riferimento this
Programmazione Java Struttura di una classe, Costruttore, Riferimento this romina.eramo@univaq.it http://www.di.univaq.it/romina.eramo/tlp Roadmap > Struttura di una classe > Costruttore > Riferimento
Programma del corso. Elementi di Programmazione. Introduzione agli algoritmi. Rappresentazione delle Informazioni. Architettura del calcolatore
Programma del corso Introduzione agli algoritmi Rappresentazione delle Informazioni Architettura del calcolatore Reti di Calcolatori Elementi di Programmazione Algoritmi e programmi Algoritmo Sequenza
Introduzione a Java. Riferimenti
Introduzione a Java Si ringraziano Massimiliano Curcio e Matteo Giacalone 1: Introduction 1 Riferimenti! Java tutorial: http://java.sun.com/docs/books/tutorial/! Il Java tutorial è parte di una più ampia
Parte 6 JSON, Web Storage API, funzioni JavaScript e user script
Sapienza Università di Roma corso di laurea in Ingegneria informatica e automatica Linguaggi e tecnologie per il Web a.a. 2017/2018 Parte 6 JSON, Web Storage API, funzioni JavaScript e user script Riccardo
Indice. La gestione dei file in C e gli stream. Apertura e chiusura di un file. Operazioni sui file. Accesso sequenziale e non sequenziale
File in C Indice La gestione dei file in C e gli stream Apertura e chiusura di un file Operazioni sui file Accesso sequenziale e non sequenziale Gestione dei file in C In C all interno della standard library
Input/Output di numeri
Input/Output di numeri I/O di numeri Per utilizzare le funzioni di I/O occorre include il file di intestazione (o file header) stdio.h utilizzando all inizio del sorgente la direttiva #include
Stringhe e allocazione dinamica della memoria
Stringhe e allocazione dinamica della memoria Esercizio Scrivere un programma strings.c che legge da standard input una sequenza di parole separate da uno o più spazi, e stampa le parole lette, una per
Inside C : Puntatori. Indirizzo: operatore & p = &v; x = a; Puntatori Referenziazione e Dereferenziazione Arrays
Pointers: Puntatori (I) Le variabili finora incontrate sono caratterizzate da un nome (o identificativo), un tipo, ed occupano un area di memoria di dimensione dipendente dal tipo. Per accedere ad una