Come disegnare grafici

anonymous_be1147 · 2008-02-12CET22:19:36+01:00

"In questo forum \u00e8 possibile utilizzare [_url=http:\//\//geonext.de:1j6io4n8]GeoNext[\//_url:1j6io4n8], [_url=http:\//\//www.geogebra.org:1j6io4n8]GeoGebra[\//_url:1j6io4n8], oppure [_url=http:\//\//www1.chapman.edu\//~jipsen\//svg\//asciisvg.html:1j6io4n8]ASCIIsvg[\//_url:1j6io4n8] per disegnare grafici e figure.\n\n\n[*:1j6io4n8]\nGeoNext ha un'interfaccia grafica del tutto intuitiva. La procedura per inserire nel proprio messaggio le figure ottenute \u00e8 illustrata nel video seguente (si consiglia di visualizzarlo in HD (720p) a tutto schermo):\n\n[ytpar id=\"geonext\" start=\"1\" end=\"77\":1j6io4n8]http:\//\//youtu.be\//deuqTY-Vm7Y[\//ytpar]\n\nEcco alcuni esempi del tipo di grafici che si possono ottenere:\n\n[jxg]eNrtm+uP0zgQwD9v\//wpLK923bR59rogi8dgeJ50AwR6CL5zcJtvmLo2rJN1tF\//G\//33j8iJs6LQsc7EIogsz4FXt+M7YTJ\//j94uWLi3eXYSd4e\//H6zR8vX4Red9QPHCV1gimjeRR2ToKMLuNwwuZpwkiUwN8inmeMeIGDKZAjya5YvqRlwrIwcEwJEum6XLAc9PICVDO2XMZZCTp1BcorlpVFchuH3iBwtMBrj0JoK8F7kbqTYEk3yRKEKCzzdRw4lcxTN6HbdQNng8JWCFsUbpKoXIS9AaqEwNWLOJkvyrDnol5K0J4jGiQEWmTRugh9z\//WHkEVI2BeWR0lGyxhEciIV4RVNi5j3jwuon+eJVuM1aouMrpQWr\//ndsDyZJ3zwsCv+eKQ7w3vj9wdVfxyVl1d2y9hSlfJ2ynhGCZGL519nSanyD9ydAgNjzByRj5co41y3YOTWOUU6z5nSaZyqrBsj71Znlll47uU6LZPmimGcFuxmowcKBa3fmnpZt6xQGCQrk2zN0F7YgMyuW5GyLGrmJ7IJc6QOl65y87JApW5VgKqLCVGWEvl4iQ1jW1Vi\//u7P2DTK\//D3KsozIyctcJ\//HNiuXyDku2CvvdczAGWwlNGl+V4dkAHRyvUTtlZQkknGFeKWBCjvRDdj9wcukJ0F7VCjmRZFfcBxXSQCzeMxG04v2iHXJWFNoxUJD2SSEsnD51+W8y4VVzBaZFtFjIkcJLVK5YAtHBcJxKwV1W3UkwpbN\//5zlbZyIoyHYm8o9uB5KukjSWPOUzgI7\//K22w6xaVV6hQshtIdCTZjSNwV6qJIFnSeRx2u12IaXgJ0YUQsIBxtwRVAGKU8DBaKI1jqLiC9zJOYx5CC+WgG2leGASWRm\//jvIDsIrhjDMVRLSleCefgAfjDxw8fLxdJQUBRwIDPeCPkhoIij8HIEblJygXBaWNzSXh93U+fhLOIAM5rW65g8JYrLW1Q3Eh5wxkc9NVw8vEE+HxfjShYluZiXpAXeLeOvt2Awm1dxxIIKYgEuMkQ5g38X\//YRcHEVNqjJKaAvkRGCGCiYr+S0JRTXSZFMU9WMkoRv5XQWqzqEILApc\//ZvLDCA\//phi50SzZ2QNT134M5m4rsotXZUTk2Rzns4p5elahzkApDQ8fXL+7Mno2bCPYMk4K+LpKS\//koiMZMVj09\//TpmP94MWMAHPPuIHzhSBghtRqZqkJuTWS4siWK0jfMpjWz1aSoFCK9CLN1moJehsp\//iiuwB\//9XdljFTn4legNzHhAPIy2vBATrkklZtmRo5PQkvOOr3OQ9WxPgjOTrLAOrEJoRqCHOybWohLAr5SffyEUGrYu0LvJ9XYTPNjit4rQiNwGP1ZKfSM+Ze\//FA+AupHIacqJlzoNYB2Pkegr2VeZ0q8xFmz78xszLrnaHtHYS2oraCy6C2jq2kz8RWcSuSe77BrQbXdffB\//aHk8ip2djyVQpMpUzSaYtmjlz9i7LZgCo8P2VaukxyNn5XFJxYWh40snvVUVFU0nnktji2O3wzHpxYcR4049rquv0ej39LY0viFNKbbOctMHl\//9TS1EjhuIhJUrzPtyOpfCXtKwOWnUnFSr8A5oP4i16pHFqkn2ZPIYfo1ki6Vsb9JMNi507wfZU2A4ViOAmGncTgzcXrl6N9VsbYu5LfZuNPi+xQ+ZvNHmR42+Y3XT7GO3vxfQ9ncp+3Y\//FNIOW\//6g6Xdsf8T4O9avm79m\//5Nd+KC3VD3dEn3Ji7KKZlzQPakS8FrWtltDEMOGh1ZG06KMKJa46BgUWoicWon0WiJbIn8QkTMrkX5LZEvkdyCSLxr1OtG6iXlmWTJ6\//oEHPP1x7QkPV7SbmHYT8wWbmBlbrlghH3pWTNqQ7DUgWW5XMX9D7\//E39Cgox8hW61LTjEI9RawMqqSfe6MiwmUjvTqe2ulVyQ9go8LWJZq0moQvLJOw15vdYady\//j\//MwpaQ9ZnTcO+zp+Gxy3\//HpmFb3LrDNFyLXPdiGj4cwawhzBbDbEGMn8CpELPgFtlx+7ptSK9d9LWLvgOLvgpDPGJnzqt8qqXZXJWXD2+yuWubaJteqIhuiAd\//sksiYZlEEVQtnhZKQSZhD8UDQdFZoc5plKwLcUBNXt91\//u09rPl3MhkB1pzNA6vHyaEHhaOHs3rE18m\//0XS1oI\//Uy2WCJ94Ug01AejYgR8eAHDYCOWgCctQC+csBOY3Lu\//Lo23gcH+Nx0MjjqInHYcvjL8fjnC6Xh4DUesnjpXW6Pm+gUZ1AmxmH0Yg6jTYTx9GIPo82kwfS9NkJv\//622kPFVin2jqT93PtnQcmB\//fOwz3+NeIrkQ\//vne4TnoZNpZO9oGqmdTSO23RWxH08jtfNpEhbjeBqpzqc1eIVtzeC7R7yC2ryC1r2C1rwCnKJfd4ph6xStU9w7p7AtXHzviFNMbU4xrTvFtD5VuN3huH6w6bx1i9Yt7p9b9Gxu4R9xi+c2t3hed4vnNbdwu\//3acT+\//XUG1XvGDvSJwjE\//H+Iti\//N4XPzsDq8Dd43eDJWPplPLP8Yh4v\//bXm4vX+u0akYexaZ5TMmP8y7Fb6FlCVnFesIymye0tQKxdjQRRXMzyZIX9P1aM0BJAh9JmoY74hlHfV1BAN2ZlHJlajpZF3ekE0zVIGX7W6wMHhtgJxKty9xH\//qhZfmgtvF4PhqE+m\//wO2DuLg[\//jxg]\n\n[jxg]eNrtWW1v2zYQ\//hz\//CgL5shWIJSt2XjBNH9ImxYCiBZqsaL9koC1a5iqLBiUlcoL+990dX0QndjNgw7qisYuEd7zjkcfnuYvU9PX5u7fnH6+yQfrh\//P3lb+\//eZqPh8TiNnDRIp4rrPBvspRVfiuxCFaVULJfwrxZFpViSRjQDFrKaK73kjVRVlkahBJO8bRZKg94OQDVTy6WoGtC5ESjnqmpqeSey0SSNvICr5xnEkrQXq9tLl7yTSxDyrNGtSKNextkui4dxGnUkrI2wJuFW5s0iO5yQygioXghZLJrsMCa9lSBeZAIyBhFV3tZZMoqTIzAxEp1F6VxWvBEgsj2rsLsyY1IXWjotDUlZV3yVzXlZg5bGuBelZSExdXSQ5OTYHwXPkown\//WkiZ4uL3Sm1dF6jDZ9R4GGs0L6tZOPsJ\//GGwyTIWGTs0KMR2kcIrL2lmUfLkk9F6Uy7wHbtja0JWi\//bspG7F4Y8LdRt5xNFgtevQ71d2y5orqNqZNUqui0KYM19FCtb19Ce2RBhpr7u3VujL2DSRzVX792MaL2MHXp0Sq2dR\//HxjQgvpfhEsvUxluhzI8XtSmm7w0atsvHwFC5DrYymFPMmO5gQvWlM2qlqGkDCAdlagSY0YR\//MgXTa8gDi9VHYngV2j\//q0h3SHZO3MeI1ju8uZVnXtsmUEez8lFIX9lzF+Ly5waVTQXM7rhc0UDUm5UhJqQ0CcXoGEdTtJp3z2udCqrUxJsHEu7MfHgam5LIXFk54B6PCnvYNNWvSscIVks4z4OrJZRWBXLkQql7wQ2XA4hIpGQ6gtjMENBLtlpAIg5hKLaO00UaBCBZ5SlAILaO0I2tnrhSSoMv8gdA3mprRTBaWsNpxGhhxYfq\//vr++vFrJmoKgh4TMMwm45KLSAS87ZrWwWjJpGd8VwveGXL4YspnzjassVJG+58lJHYmflDjE4Gbt0Yj4BfEniMgo3y7XpCnZAu438dlMO27oRFhBWMBOwyQy6Bv22ZwS4xA42pNEcoG8hYwSTKOhWtmkZxY2s5bR0YZxkuKX5TLg1jGBg02j1WRgYwHlCcbDnsReYZvsxfC4u4thZW6oiYmRV4DyiFOe9jiwASGW2f3b66uz41dGYgGXrrKmn++gUE5GCGmzOu\//\//yBL\//oFiQgCncH5YsyEZTUPjP9gnibhOH+Lkm03AhDe8x67nuFma+zqi1L0NtS+Wc9h\//vAn\//bArnbiyJwGeh4gHjJtRwYEbaOsbCMFGtueDDv+EU0+qZYBzphuqwpuhfGKwQpCsxuzCFNzx5N\//iSKTZ4o8U+S\//pQh2m0LzlWm59hHg9R\//+T35muVMk4tgwhvWUYXTceVtRF8mSF5ey+il50f0M+3NKYx\//1Dt8HckdfRW4I3ZN4TAgLoPsYuwTBELsOvAafG+D16I3tJ4TQN4Qv\//sVlgbIDNeMtqDl9CjXddfLjwKUvSD8aXEy96dFyFW8ByyjegRbXW9fsV9Zd3ydhu2Wu3waT2HiZ77wbE52bgeeX4WjsHmHoJIfD2D\//HbOvB3yc4k78JToORB204BOfRGL87wWmm0X8XODc78f+2FbNHvZg9aMbMdWPrTO2Ybe\//H7EFDtmAJ+jHrG\//IOsoy2kWX0BFnCfvyYLeHsJl02ZwK+HBwODzf4cjAaHh09E+aZMN+SMGkUvBrBN1z0Npteq8CtwO7pvVijVDnl+LoJ6LVeiez3y\//P3sAgOUUf0OuNaczZT+GbkDk4m2Qqe9VTFS3l3ByD2LGRpLuqZlis6\//1NujDcAdPAOnQbmHZ3fV1rDMWaNyEMtQmuLejBIpy1IFb20TgAHgThIlYbH1Cz+Bd8a42hg+G+SEbn\//EPgLPnPI1g==[\//jxg]\n\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]GeoGebra anch'esso un'interfaccia grafica e il suo utilizzo \u00e8 semplicissimo. La procedura per inserire nel proprio messaggio le costruzioni ottenute \u00e8 illustrata nel video che segue (si consiglia di visualizzarlo a tutto schermo).\n\nN.B. Siccome \u00e8 richiesto il plugin Java per l'esecuzione, si consiglia di limitare l'uso di GeoGebra nei propri post alle sole costruzioni dinamiche e di usare GeoNext o ASCIIsvg per le normali figure geometriche.\n\n[ytpar id=\"geogebra\" start=\"80\" end=\"177\":1j6io4n8]http:\//\//youtu.be\//deuqTY-Vm7Y[\//ytpar]\n\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]\nQui di seguito \u00e8 quindi spiegato il solo utilizzo di ASCIIsvg.\n\nAl momento i disegni prodotti con ASCIIsvg possono essere visualizzati soltanto usando Internet Explorer, unitamente al plugin SVG Viewer di Adobe (scaricabile gratuitamente), Mozilla\//Firefox, Opera 9.5 o superiore, Google Chrome oppure Safari 3 o superiore.\n\nEcco un esempio: il grafico delle funzioni $y=\\sin(x)$ e $y=x^2-2$.\n\n[asvg]width=550;\n height=550;\n axes(); \//\// visualizza gli assi coordinati\n stroke=\"red\";\n plot(\"sin(x)\"); \//\// disegna la funzione seno\n stroke=\"green\";\n plot(\"x^2-2\"); \//\// disegna la conica d'equazione y = x^2 - 2[\//asvg]\n\nPer ottenere questo risultato \u00e8 stato inserito nel messaggio il seguente testo\n\n\n[asvg]\nwidth=550; \//\// specifica la larghezza della figura (in pixel)\nheight=550; \//\// specifica l'altezza della figura (in pixel)\naxes(); \//\// visualizza gli assi\nstroke="red"; \//\// seleziona il colore rosso\nplot("sin(x)"); \//\// disegna la funzione seno\nstroke="green"; \//\// seleziona il colore verde\nplot("x^2-2"); \//\// disegna la conica d'equazione y = x^2 - 2\n[\//asvg]\n\n\nQui di seguito potete trovare un elenco e una breve guida ai comandi principali e alcune note sulla sintassi da usare (\u00e8 la stessa di JavaScript). Notare che non \u00e8 necessario conoscere alcun linguaggio di programmazione per realizzare semplici grafici, basta rispettare le prime tre regole che seguono e conoscere i comandi specifici per tracciare le linee. Potete anche semplicemente copiare e riadattare gli esempi scritti nei box Codice.\n\nSintassi\n\nLa sintassi \u00e8, come detto, la stessa di JavaScript con le seguenti avvertenze:\n\n[list=1][*:1j6io4n8]tutte le istruzioni devono[list=a]\n[*:1j6io4n8]essere scritte tra le etichette\n\n[asvg]\n\n\n[\//asvg]\n\n\nche possono essere inserite automaticamente nel messaggio premendo l'apposito bottone dell'editor oppure la combinazione di tasti ALT e.\n\n\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]terminare con un punto e virgola[\//*:m:1j6io4n8][\//list:o:1j6io4n8][\//*:m:1j6io4n8]\n[*:1j6io4n8]i numeri decimali tra -1 e 1 devono avere uno zero iniziale: es. 0.7 e non .7\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]utilizzare una delle due istruzioni axes(), eventualmente specificando gli intervalli degli assi x e y (vedi oltre), oppure noaxes()\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]le istruzioni dei cicli di iterazione while e for devono essere racchiuse tra parentesi graffe (non \u00e8 necessario inserire un punto e virgola dopo quella di chiusura)\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]tutte le variabili devono essere dichiarate preventivamente con la parola chiave var, cio\u00e8 per iniziare a usare per esempio una variabile di nome zeta bisogna scrivere var zeta;[\//*:m:1j6io4n8][\//list:o:1j6io4n8]\n\nElenco comandi\n\nNota: nel seguito con le lettere minuscole a,b,... si indicano dei numeri reali qualsiasi, con A, B, C dei generici punti. Il testo tra parentesi graffe \u00e8 opzionale per un dato comando.\n\n[*:1j6io4n8]{width = w; height = h;xmin = a; xmax = b; ymin = c; ymax = d; } axes(); specifica la regione del piano interessata al grafico, visualizza gli assi cartesiani\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]{ width = w; height = h;xmin = a; xmax = b; ymin = c; ymax = d; } noaxes(); specifica la regione del piano interessata al grafico, non visualizza gli assi cartesiani\n\nN.B. width e height devono sottostare alle condizioni: \$ 300 \\le \\text{width} \\le 700 \$, \$ 200 \\le \\text{height} \\le 700 \$.\n\n[\//*:m:1j6io4n8]\n[*:1j6io4n8][ a , b ] \u00e8 la notazione per indicare il punto del piano di coordinate a e b\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]dot( [a,b] ) disegna il punto specificato tra parentesi\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]line( [a, b] , [c, d] ) traccia il segmento avente per estremi i punti [a, b] e [c, d]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]marker = \"marcatore\" imposta il marcatore dot, arrow, arrowdot, none (valore di default), cio\u00e8 il simbolo grafico da usare come estremo nelle linee o come punti intermedi nelle spezzate e curve poligonali\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]stroke = \"colore\" imposta il colore da usare nei successivi comandi di disegno\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]strokewidth = \"dimensione\" imposta la grossezza in pixel del tratto\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]circle( [x, y] , r ) disegna un cerchio avente per origine il punto [x, y] e raggio r\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]ellipse( [x, y] , rx , ry) disegna un'ellisse avente centro nel punto [x, y] , asse orizzontale uguale a rx, asse verticale ry\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]rect( [x, y] , [u, v] ) disegna un rettangolo avente il vertice inferiore sinistro nel punto [x, y] e il vertice superiore destro nel punto [u, v]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]fill = \"colore\" imposta il colore di riempimento\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]path( [ [x1, y1] , [x2, y2] , ... , [xn, yn] ] ) traccia una sottile linea congiungente nell'ordine i punti [x1, y1], ..., [xn, yn]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]plot(\"f(x)\") traccia il grafico della funzione f(x)\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]arc( [x,y] , [u,v] , r ) disegna un arco di cerchio in senso orario da [x,y] a [u,v] con raggio r.\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]text( [x,y] , \"etichetta\" , posizione ) aggiunge del testo nel punto [x,y] nella posizione specificata (above, below, left, right, aboveleft, aboveright, belowleft, belowright)[\//*:m:1j6io4n8][\//list:u:1j6io4n8]\nCostanti principali\n[*:1j6io4n8]Math.E la costante $e$, base dei logaritmi naturali[\//*:m:1j6io4n8]\n[*:1j6io4n8]Math.LN2 logaritmo in base 2[\//*:m:1j6io4n8]\n[*:1j6io4n8]Math.LN10 logaritmo in base 10[\//*:m:1j6io4n8]\n[*:1j6io4n8]Math.PI pigreco[\//*:m:1j6io4n8]\n[*:1j6io4n8]Math.SQRT2 radice di 2[\//*:m:1j6io4n8][\//list:u:1j6io4n8]\nQui di seguito vengono illustrati pi\u00f9 in dettaglio i vari comandi con l'aiuto di un esempio.\n\n[*:1j6io4n8]{ xmin = a; xmax = b; ymin = c; ymax = d; } axes(); imposta il sistema di coordinate (di norma xmin, xmax, ymin, ymax hanno il valore 5, quindi possono anche essere omessi. Se non si vuole visualizzare gli assi cartesiani basta sostituire axes() con noaxes()\n\n\u00c8 possibile anche aggiungere una scala sugli assi e\//o una griglia tramite i parametri \"labels\" e \"grid\" nel seguente modo:\n\n\naxes("labels", "grid");\n\n\n[asvg]axes(\"labels\", \"grid\");[\//asvg]\n\nOvviamente si pu\u00f2 specificare sia la scala da usare che l'ampiezza delle maglie della griglia cos\u00ec:\n\n\naxes(1,2, "labels", 2, 2, "grid");\n\n\n[asvg]axes(1,2, \"labels\", 2, 2, \"grid\");[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8][ a , b ] \u00e8 la notazione per indicare il punto del piano di coordinate a e b. Ad esempio per indicare il punto di coordinate x = -4 e y = 6.8 si scriver\u00e0\n\n\n[-4, 6.8]\n\n\nPer comodit\u00e0, ad esempio nel caso il punto venga usato pi\u00f9 volte nel codice che realizza il grafico, \u00e8 possibile assegnare le coordinate a una variabile, cio\u00e8 creare una sorta di nome mnemonico da utilizzare al posto della scrittura estesa delle coordinate. Ad esempio, si potrebbe indicare il punto visto sopra con la lettera P (o una qualsiasi altra lettera anche minuscola o parola) scrivendo:\n\n\nvar P = [-4, 6.8];\n\nA questo punto nelle istruzioni successive si potr\u00e0 semplicemente scrivere P.\n\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]dot( [a,b] ) disegna il punto specificato tra parentesi, cio\u00e8 avente coordinate a e b. Esempio:\n\n\naxes();\ndot([-1, -1]); \//\// disegna il punto di coordinate x=-1 e y=-1\nvar A = [3,2]; \//\// crea una variabile di nome A alla quale è assegnato il punto di coordinate x=3, y=2\ndot(A); \//\// disegna il punto A\nvar punto1 = [-4, 4.2]; \//\// crea la variabile punto1 e le assegna le coordinate x = -4, y = 4.2\ndot(punto1); \//\// disegna punto1\n\n\n\n[asvg]axes(\"labels\");\ndot([-1, -1]); \//\// disegna il punto di coordinate x=-1 e y=-1\nvar A = [3,2]; \//\// crea una variabile di nome A alla quale \u00e8 assegnato il punto di coordinate x=3, y=2\ndot(A); \//\// disegna il punto A\ntext(A, \"A\", above);\nvar punto1 = [-4, 4.2]; \//\// crea la variabile punto1 e le assegna le coordinate x = -4, y = 4.2\ndot(punto1); \//\// disegna -2punto1\ntext(punto1, \"punto1\", below);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]line( [a, b] , [c, d] ) traccia il segmento avente per estremi i punti [a, b] e [c, d]. Esempio:\n\n\naxes();\nline([-4, 0], [4, 4]); \//\// traccia il segmento di estremi P(-4, 0), Q(4, 4)\nline([3, -3.5], [3, 2]); \//\// traccia il segmento di estremi R(3, -3.5), M(3, 2)\n\n[asvg]axes();\nline([-4, 0], [4, 4]); \//\// traccia il segmento di estremi P(-4, 0), Q(4, 4)\ntext([-4,0], \"P\", \"below\");\ntext([4,4], \"Q\", \"above\");\nline([3, -3.5], [3, 2]); \//\// traccia il segmento di estremi R(3, -3.5), M(3, 2)\ntext([3,-3.5], \"R\", \"below\");\ntext([3,2], \"M\", \"above\");[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]marker = \"marcatore\" imposta il simbolo da usare come estremo nelle linee o come punti intermedi nelle spezzate e curve poligonali. La parola marcatore deve essere una delle seguenti: dot, arrow, arrowdot, none (valore di default). Ecco un esempio d'uso dei vari marcatori:\n\n\naxes();\nmarker = "dot";\nline([1,1], [4,4]);\nmarker = "arrow";\nline([-1,1],[-4,4]);\nmarker = "arrowdot";\nline([-1,-1],[-4,-4]);\nmarker = "none";\nline([1,-1],[4,-4]);\n\n[asvg]axes();\nmarker = \"dot\";\nline([1,1], [4,4]);\nmarker = \"arrow\";\nline([-1,1],[-4,4]);\nmarker = \"arrowdot\";\nline([-1,-1],[-4,-4]);\nmarker = \"none\";\nline([1,-1],[4,-4]);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]stroke = \"colore\" imposta il colore da usare nei successivi comandi di disegno. colore \u00e8 il nome in inglese di uno dei colori standard HTML. Esempio\n\n\naxes();\nstroke = "mediumaquamarine"; \//\// seleziona il colore mediumaquamarine\nline([-4, 0], [4, 4]); \//\// traccia il segmento di estremi P(-4, 0), Q(4, 4)\nstroke = "lightsalmon"; \//\// seleziona il colore lightsalmon\nline([3, -3.5], [3, 2]); \//\// traccia il segmento di estremi R(3, -3.5), M(3, 2)\n\n[asvg]axes();\nstroke = \"mediumaquamarine\"; \//\// seleziona il colore mediumaquamarine\nline([-4, 0], [4, 4]); \//\// traccia il segmento di estremi P(-4, 0), Q(4, 4)\ntext([-4,0], \"P\", \"below\");\ntext([4,4], \"Q\", \"above\");\nstroke = \"lightsalmon\"; \//\// seleziona il colore lightsalmon\nline([3, -3.5], [3, 2]); \//\// traccia il segmento di estremi R(3, -3.5), M(3, 2)\ntext([3,-3.5], \"R\", \"below\");\ntext([3,2], \"M\", \"above\");[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]strokewidth = \"dimensione\" imposta la grossezza in pixel del tratto. dimensione \u00e8 chiaramente un numero intero positivo. Esempio\n\n\n\n\nnoaxes();\nline([-4,4], [4,4]);\nstrokewidth=6;\nline([4,4], [4,-4]);\nstrokewidth=3;\nline([4,-4], [-4,4]);\n\n\n[asvg]noaxes();\nline([-4,4], [4,4]);\nstrokewidth=3;\nline([4,4], [4,-4]);\nstrokewidth=6;\nline([4,-4], [-4,4]);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]circle( [x, y] , r ) disegna un cerchio avente per origine il punto [x, y] e raggio r. Esempio\n\n\naxes();\ncircle([-1,-1], 3);\n\n\n[asvg]axes();\ncircle([-1,-1], 3);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]ellipse( [x, y] , rx , ry) disegna un'ellisse avente centro nel punto [x, y] , asse orizzontale uguale a rx, asse verticale ry. Esempio\n\n\naxes();\nellipse([0, 0], 4, 2);\n\n\n[asvg]axes();\nellipse([0,0], 4, 2);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]rect( [x, y] , [u, v] ) disegna un rettangolo avente il vertice inferiore sinistro nel punto [x, y] e il vertice superiore destro nel punto [u, v]. Esempio\n\n\naxes();\nrect([-2,3],[4,4]);\n\n\n[asvg]axes();\nrect([-2,3],[4,4]);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]fill = \"colore\" imposta il colore di riempimento di figure chiuse nei successivi comandi di disegno. colore \u00e8 il nome in inglese di uno dei colori standard HTML. Esempio\n\n\nnoaxes();\nfill="lightyellow";\nrect([-2,3],[4,4]);\nfill="dodgerblue";\ncircle([0,0], 3);\n\n\n[asvg]noaxes();\nfill=\"lightyellow\";\nrect([-2,3],[4,4]);\nfill=\"dodgerblue\";\ncircle([0,0], 3);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]path( [ [x1, y1] , [x2, y2] , ... , [xn, yn] ] ) traccia una sottile linea congiungente nell'ordine i punti [x1, y1], ..., [xn, yn]. Se il primo e l'ultimo punto specificato coincidono, la linea tracciata \u00e8 chiusa. Notare che i punti vanno racchiusi tra una coppia di parentesi quadre. Esempio\n\n\nnoaxes();\npath( [ [-4,-1],[4,-1],[-1,4],[-3,4],[-4,-1] ] );\n\n\n[asvg]noaxes();\npath([[-4,-1],[4,-1],[-1,4],[-3,4],[-4,-1]]);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]plot(\"f(x)\") traccia il grafico della funzione f(x), espressa con la consueta notazione ASCIIMathML. Per esempio per tracciare il grafico della funzione $f(x) = (x^2-1) \\cdot ln|x^2-1|$ si scriver\u00e0\n\n\nxmin=-2.5; xmax=2.5;\nymin=-1;\naxes("labels");\nstroke="blue";\nplot("(x^2-1) * log( abs(x^2-1) )");\n\n\n[asvg]xmin=-2.5; xmax=2.5;\nymin=-1;\naxes(\"labels\");\nstroke=\"blue\";\nplot(\"(x^2-1) * log( abs(x^2-1) )\");[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]arc( [x,y] , [u,v] , r ) disegna un arco di cerchio in senso orario da [x,y] a [u,v] con raggio r. Il valore di r deve essere chiaramente maggiore o uguale alla met\u00e0 della distanza tra i due punti. Esempio\n\n\nxmin = 0; xmax = 4;\nnoaxes();\n\nline([0,0],[4,0]);\n\nstroke="gold";\narc([4,0], [0,0], 2);\n\nstroke="magenta";\narc([4,0], [0,0], 3);\n\nstroke="green";\narc([4,0], [0,0], 4);\n\nstroke="red";\narc([4,0], [0,0], 5);\n\n\n[asvg]xmin = 0; xmax = 4;\nnoaxes();\nline([0,0],[4,0]);\nstroke=\"gold\";\narc([4,0], [0,0], 2);\nstroke=\"magenta\";\narc([4,0], [0,0], 3);\nstroke=\"green\";\narc([4,0], [0,0], 4);\nstroke=\"red\";\narc([4,0], [0,0], 5);[\//asvg]\n[\//*:m:1j6io4n8]\n[*:1j6io4n8]text( [x,y] , \"etichetta\" , posizione ) scrive il contenuto tra i doppi apici (etichetta) relativamente al punto [x,y], cio\u00e8 nella posizione specificata da posizione, che pu\u00f2 assumere i valori above (sopra), below (sotto), left (sinistra), right (destra), aboveleft (sopra a sinistra), aboveright (sopra a destra), belowleft (sotto a sinistra), belowright (sotto a destra). Esempio\n\n\nxmin=-4; xmax=4;\nnoaxes();\nvar N = [0,3]; dot(N);\ntext(N, "N", above);\nvar NE = [3,3]; dot(NE);\ntext(NE, "NE", aboveright);\nvar NW = [-3,3]; dot(NW);\ntext(NW, "NW", aboveleft);\nvar Ee = [3,0]; dot(Ee);\ntext(Ee, "E", right);\nvar W = [-3,0]; dot(W);\ntext(W, "W", left);\nvar S = [0,-3]; dot(S);\ntext(S, "S", below);\nvar SE = [3,-3]; dot(SE);\ntext(SE, "SE", belowright);\nvar SW = [-3,-3]; dot(SW);\ntext(SW, "SW", belowleft);\n\n\n\n[asvg]xmin=-4; xmax=4;\nnoaxes();\nvar N = [0,3]; dot(N);\ntext(N, \"N\", above);\nvar NE = [3,3]; dot(NE);\ntext(NE, \"NE\", aboveright);\nvar NW = [-3,3]; dot(NW);\ntext(NW, \"NW\", aboveleft);\nvar Ee = [3,0]; dot(Ee);\ntext(Ee, \"E\", right);\nvar W = [-3,0]; dot(W);\ntext(W, \"W\", left);\nvar S = [0,-3]; dot(S);\ntext(S, \"S\", below);\nvar SE = [3,-3]; dot(SE);\ntext(SE, \"SE\", belowright);\nvar SW = [-3,-3]; dot(SW);\ntext(SW, \"SW\", belowleft);[\//asvg][\//*:m:1j6io4n8][\//list:u:1j6io4n8]\n\nEcco infine un paio di esempi di come \u00e8 possibile colorare\//evidenziare una regione del piano delimitata da curve arbitrarie:\n\n[asvg]xmin=0; xmax=3.14;ymin=0;ymax=2;\n axes();\n\n plot(\"sin(x)\",0,3.14);\n plot(\"sin(x)+1\");\n line([0,0], [0, 1]);\n line([3.14, 0], [3.14,1]);\n\n var incr = 0.05; \//\// distanza tra due rette verticali\n\n var xm = 3.14; \//\// semiasse\n\n var xi = xm\//incr;\n\n function fillRegion (xmin, xmax, color) {\n var x1, y1,y2, x;\n\n stroke=color;\n\n for (x=xmin; x< xmax; x++) {\n x1 = incr*x;\n y1 = Math.sin(x1);\n y2 = Math.sin(x1)+1;\n\n \//\// traccia la retta\n line([x1,y1 ], [x1, y2]);\n }\n }\n\n \//\// riempie le tre regioni del piano\n fillRegion(0,xi, \"cadetblue\");\n\n fontsize=\"24\";fontweight=\"bold\";\n text([1.5, 1.5],\"D\");\n\n fontsize=\"16\";fontweight=\"normal\";\n text([2.5,0.9],\"y=sin(x)\");\n text([0.9,2],\"y=sin(x)+1\");[\//asvg]\n\nIl grafico \u00e8 stato ottenuto disegnando delle rette verticali tramite una piccola funzione Javascript\n\n\nvar incr = 0.05; \//\// distanza tra due rette verticali \n\nvar xm = 3.14;\n\nvar xi = xm\//incr;\nfunction fillRegion (xmin, xmax, color) {\n var x1, y1,y2, x;\n\n stroke=color;\n\n for (x=xmin; x< xmax; x++) {\n x1 = incr*x;\n y1 = Math.sin(x1);\n y2 = Math.sin(x1)+1;\n\n \//\// traccia la retta\n line([x1,y1 ], [x1, y2]);\n }\n}\n\nfillRegion(0, xi, "cadetblue");\n\n\nAltro esempio:\n[asvg]initPicture(); \//\// visualizza gli assi coordinati\n axesstroke=\"red\";\n\n var incr = 0.01; \//\// distanza tra due rette verticali\n var xm = 6; \//\// semiasse\n var xi = xm\//incr;\n\n \//*\n * traccia rette verticali sopra\//sotto\n * il diagramma di |x*sin(x)|\n *\n *\//\n function fillRegion (xmin, xmax, ymax, color) {\n var x1, y1, x;\n\n stroke=color;\n\n for (x=xmin; x< xmax; x++) {\n x1 = incr*x;\n\n \//\// coordinata y della funzione\n y1 = Math.abs(Math.sin(x1)*x1);\n\n \//\// traccia la retta\n line([x1,ymax ], [x1, y1]);\n }\n }\n\n \//\// riempie le tre regioni del piano\n fillRegion(0,xi,-xm, \"khaki\");\n fillRegion(-xi,xi,xm, \"gainsboro\");\n fillRegion(-xi,0,-xm, \"peachpuff\");\n\n \//\// disegna la curva |x*sin(x)|\n stroke=\"green\";\n plot(\"abs(sin(x)*x)\",-xm, xm);\n\n \//\// Imposta proprieta font\n fontfamily=\"Arial\";fontstyle=\"normal\";fontsize=\"36\";\n fontstroke=\"black\";\n \//\// scrive etichette\n text([0,3.5],\"A\");\n fontfill=\"brown\";\n text([3,-3],\"C\");\n fontfill=\"red\";\n text([-3,-3],\"B\");\n\n axes(); \//\// visualizza gli assi[\//asvg]\nusando la seguente funzione JavaScript\n\n\nfunction fillRegion (xmin, xmax, ymax, color) {\n\n var x1, y1, x;\n\n stroke=color;\n\n for (x=xmin; x< xmax; x++) {\n x1 = incr*x;\n\n \//\// coordinata y della funzione\n y1 = Math.abs(Math.sin(x1)*x1);\n\n \//\// traccia la retta\n line([x1,ymax ], [x1, y1]);\n }\n}\n[\//*:m:1j6io4n8][\//list:u:1j6io4n8]"

Fai una domanda Tutte le categorie

anonymous_be1147

12 feb 2008, 22:19

In questo forum è possibile utilizzare [_url=http://geonext.de:1j6io4n8]GeoNext[/_url:1j6io4n8], [_url=http://www.geogebra.org:1j6io4n8]GeoGebra[/_url:1j6io4n8], oppure [_url=http://www1.chapman.edu/~jipsen/svg/asciisvg.html:1j6io4n8]ASCIIsvg[/_url:1j6io4n8] per disegnare grafici e figure.

N.B. Siccome è richiesto il plugin Java per l'esecuzione, si consiglia di limitare l'uso di GeoGebra nei propri post alle sole costruzioni dinamiche e di usare GeoNext o ASCIIsvg per le normali figure geometriche.

Al momento i disegni prodotti con ASCIIsvg possono essere visualizzati soltanto usando Internet Explorer, unitamente al plugin SVG Viewer di Adobe (scaricabile gratuitamente), Mozilla/Firefox, Opera 9.5 o superiore, Google Chrome oppure Safari 3 o superiore.

[asvg]
width=550;        // specifica la larghezza della figura (in pixel)
height=550;        // specifica l'altezza della figura (in pixel)
axes();            // visualizza gli assi
stroke="red";      // seleziona il colore rosso
plot("sin(x)");    // disegna la funzione seno
stroke="green";    // seleziona il colore verde
plot("x^2-2");     // disegna la conica d'equazione y = x^2 - 2
[/asvg]

JavaScript

Sintassi

[asvg]


[/asvg]

ALT e

0.7

axes()

noaxes()

while

for

var

zeta

var zeta;

Elenco comandi

width =

; height =

;xmin =

; xmax =

; ymin =

; ymax =

;

axes();

width =

; height =

;xmin =

; xmax =

; ymin =

; ymax =

;

noaxes();

width

height

[

]

dot(

)

line(

)

marker = "

marcatore

dot

arrow

arrowdot

none

stroke = "

colore

strokewidth = "

dimensione

circle(

)

ellipse(

)

rect(

)

fill = "

colore

path( [

] )

plot("

arc(

)

text(

, "

" ,

posizione

)

posizione

above

below

left

right

aboveleft

aboveright

belowleft

belowright

Math.E

Math.LN2

Math.LN10

Math.PI

Math.SQRT2

xmin =

; xmax =

; ymin =

; ymax =

;

axes();

noaxes()

"labels"

"grid"

axes("labels", "grid");

axes(1,2, "labels", 2, 2, "grid");

[

]

[-4, 6.8]

var P = [-4, 6.8];

dot(

)

axes();
dot([-1, -1]);     // disegna il punto di coordinate x=-1 e y=-1
var A = [3,2];     // crea una variabile di nome A alla quale è assegnato il punto di coordinate x=3, y=2
dot(A);            // disegna il punto A
var punto1 = [-4, 4.2];    // crea la variabile punto1 e le assegna le coordinate x = -4, y = 4.2
dot(punto1);              // disegna punto1

line(

)

axes();
line([-4, 0], [4, 4]);    // traccia il segmento di estremi P(-4, 0), Q(4, 4)
line([3, -3.5], [3, 2]);  // traccia il segmento di estremi R(3, -3.5), M(3, 2)

marker = "

marcatore

dot

arrow

arrowdot

none

axes();
marker = "dot";
line([1,1], [4,4]);
marker = "arrow";
line([-1,1],[-4,4]);
marker = "arrowdot";
line([-1,-1],[-4,-4]);
marker = "none";
line([1,-1],[4,-4]);

stroke = "

colore

colori standard

axes();
stroke = "mediumaquamarine";    // seleziona il colore mediumaquamarine
line([-4, 0], [4, 4]);          // traccia il segmento di estremi P(-4, 0), Q(4, 4)
stroke = "lightsalmon";         // seleziona il colore lightsalmon
line([3, -3.5], [3, 2]);        // traccia il segmento di estremi R(3, -3.5), M(3, 2)

strokewidth = "

dimensione

dimensione

noaxes();
line([-4,4], [4,4]);
strokewidth=6;
line([4,4], [4,-4]);
strokewidth=3;
line([4,-4], [-4,4]);

circle(

)

axes();
circle([-1,-1], 3);

ellipse(

)

axes();
ellipse([0, 0], 4, 2);

rect(

)

axes();
rect([-2,3],[4,4]);

fill = "

colore

colori standard

noaxes();
fill="lightyellow";
rect([-2,3],[4,4]);
fill="dodgerblue";
circle([0,0], 3);

path( [

] )

noaxes();
path( [ [-4,-1],[4,-1],[-1,4],[-3,4],[-4,-1] ] );

plot("

xmin=-2.5; xmax=2.5;
ymin=-1;
axes("labels");
stroke="blue";
plot("(x^2-1) * log( abs(x^2-1) )");

arc(

)

xmin = 0; xmax = 4;
noaxes();

line([0,0],[4,0]);

stroke="gold";
arc([4,0], [0,0], 2);

stroke="magenta";
arc([4,0], [0,0], 3);

stroke="green";
arc([4,0], [0,0], 4);

stroke="red";
arc([4,0], [0,0], 5);

text(

, "

" ,

posizione

)

posizione

above

below

left

right

aboveleft

aboveright

belowleft

belowright

xmin=-4; xmax=4;
noaxes();
var N = [0,3]; dot(N);
text(N, "N", above);
var NE = [3,3]; dot(NE);
text(NE, "NE", aboveright);
var NW = [-3,3]; dot(NW);
text(NW, "NW", aboveleft);
var Ee = [3,0]; dot(Ee);
text(Ee, "E", right);
var W = [-3,0]; dot(W);
text(W, "W", left);
var S = [0,-3]; dot(S);
text(S, "S", below);
var SE = [3,-3]; dot(SE);
text(SE, "SE", belowright);
var SW = [-3,-3]; dot(SW);
text(SW, "SW", belowleft);

var incr = 0.05;    // distanza tra due rette verticali 

var xm = 3.14;

var xi = xm/incr;
function fillRegion (xmin, xmax, color) {
        var x1, y1,y2, x;

        stroke=color;

        for (x=xmin; x< xmax; x++) {
            x1 = incr*x;
            y1 = Math.sin(x1);
            y2 = Math.sin(x1)+1;

            // traccia la retta
            line([x1,y1 ], [x1, y2]);
         }
}

fillRegion(0, xi, "cadetblue");

function fillRegion (xmin, xmax, ymax, color) {

        var x1, y1, x;

        stroke=color;

        for (x=xmin; x< xmax; x++) {
            x1 = incr*x;

            // coordinata y della funzione
            y1 = Math.abs(Math.sin(x1)*x1);

            // traccia la retta
            line([x1,ymax ], [x1, y1]);
         }
}

Risposte

Eustein

29 giu 2016, 10:50

Nel frattempo sono riuscito a superare le difficoltà e ad inserire il grafico.
Ma se voglio postare un altro messaggio sullo stesso argomento (Rotazione assi spazio-tempo) e inserire un altro messaggio e un altro grafico, senza cancellare il precedente, devo rispondere a me stesso o agire in qualche altro modo?

Grazie
Saluti
Massimo

Eustein

10 giu 2016, 15:25

Scusate,
sembra che Geonext richieda Java 7 per funzionare, ma i computer sono già aggiornati con Java 8, e Java 7 risult non più disponibile sul web.
Inoltre Java blocca Geogebra e l'altro programma per motivi legati alla sicurezza.
Vorrei inserire un grafico.
Qualcuno può aiutarmi?
Grazie
Distinti saluti
Massimo

anonymous_be1147

6 gen 2013, 21:15

Prego.

marcosocio

6 gen 2013, 21:12

Grazie mille!

anonymous_be1147

6 gen 2013, 21:07

Specificando gli estremi degli intervalli tramite le variabili xmin e xmax. Esempio:

xmin=-3;xmax=0; // intervallo prima funzione
plot("x-1");

xmin=0; xmax=1; // intervallo seconda funzione
plot("-x^2-1"); 

xmin=1;xmax=3; // intervallo terza funzione
plot("x-3");

[asvg]width=600;height=600;
axes(1,1,"label", "grid");
stroke="red";

xmin=-3;xmax=0;
plot("x-1");

xmin=0; xmax=1;
plot("-x^2-1");

xmin=1;xmax=3;
plot("x-3");[/asvg]

marcosocio

6 gen 2013, 18:08

Forse è una domanda stupida, ma come si disegna una funzione definita a tratti con ASCIIsvg?

Rispondi

Per rispondere a questa discussione devi prima effettuare il login.

Come disegnare grafici

Segnala Post di