In rete questa pagina: http://www.elegio.it/svg/svg2014/pallini_altro-esterni.html
Vedere anche: http://www.elegio.it/svg/svg2014/pallini_altro.html
Libreria esterna: http://www.elegio.it/svg/svg2014/pallini_altro.js.html
http://www.elegio.it/svg/svg2014/ondulata.html
http://www.elegio.it/svg/svg2014/facile-usare-svg.html

Aggiunta dinamica di immagini SVG

Qui metto a punto una libreria che sia compatibile con tutti i browser e che funzioni sia quando il file ha estensione .html sia quando ha estensione .xhtml.

Se si desidera è possibile usare una macro_immagine_svg come faccio qui lasciando visibile questa macro ossia non specificando come istruzione di style CSS display:none.

Attenzione! Al posto dei normali delimitatori delle marche ossia < e > vanno usate le parentesi graffe { al posto di < e } al posto di > in modo da non fare nascere equivoci ossia per evitare che questa macro_immagine_svg venga considerata dal browser una vera immagine da visualizzare. Ovviamente, sostituendo i corretti delimitatori di marche questa deve essere una giusta immagine SVG altrimenti la macro_immagine_svg non produrrebbe nessuna vera immagine.

{svg xmlns="http://www.w3.org/2000/svg" 
     xmlns:xlink="http://www.w3.org/1999/xlink"
     id="svgaggiunti" 
     width="500" height="250"  viewBox="0 0 2000 1000"}
{g stroke="blue" stroke-width="10" }
{path id="pathaggiunti" fill="#ffaa00" d="M 100 100 L 1900 100 L 1000 900 Z "  /}
{a xlink:href="http://www.elegio.it/max/"}
{path id="bispathaggiunti" fill="cyan" fill-opacity="0.5"
      d="M 100 200 L 900 200 1900 950 50 950 Z "/}{/a}{/g}
{/svg}

Se Javascript è attivato e se il browser usato accetta le istruzioni ( non le accetta certamente Internet Explorer versione 8 e precedenti ) qua sotto dovrebbero apparire sei immagini variamente colorate e modificate...

Ondulata ossia spezzata anche ad archi e segmenti _ pallini di dimensione variabile.

Questo esempio serve a sperimentare il meccanismo di interruzione del grafico ( per cambiare grafico basta ricaricare di nuovo questa pagina ) e la funzione che mette i pallini di dimensione crescente per indicare il senso di percorrenza della linea. In pratica viene proposta una libreria che consente di applicare vari metodi di costruzione di grafici di funzioni. Una funzione che usa la curva di Bézier quadratica basata su un unico punto di controllo. ( vedere http://www.elegio.it/calcolatrice/archivio-utili-201308.html#n002 )

Espressione matematica della funzione y1=y1(x) [ linea nera ]

tan(x/PI)/(1+random())

Espressione matematica della funzione y2=y2(x) [ linea blu ]

exp(x*x/20)*cos(3*x+random()*0.1)/2

== Punti di calcolo delle funzioni

== Fattore di scala delle ascisse positive.

== Fattore di scala delle ordinate (scalay).

== Ascissa prescelta

Funzioni graficate:

?

In rete ho lasciato precedenti versioni sperabilmente meno belle e riutilizzabile di questa:
http://www.elegio.it/svg/grafico2funzioni+.html
Versione 20090701 aggiornata e ampliata nel 20140620
http://www.elegio.it/svg/
http://www.elegio.it/omnia/sv/

Note varie

Ogni funzione è graficata come atan(valfunzione/scalay) per cui, per annullare l'effetto di questa compressione verticale basta scegliere come Fattore di scala delle ordinate scalay = 1 e applicare la funzione tan alla funzione che si vuole graficare.

Per esempio graficare la funzione tan(x/(4*PI)) usando come Punti di calcolo delle funzioni il valore 200 e come Fattore di scala delle ascisse positive il valore 0.1.

Come ULTIMA considerazione sottolineo il fatto che l'uso di archi di cerchio o di segmenti consente di calcolare esattamente in modo semplice la lunghezza della ondulata e questo fatto è una caratteristica utile quando si fanno calcoli di meccanica razionale analitica ( vedere per esempio il capitolo X dedicato alla Meccanica Analitica, del Finzi-Pastori : http://www.elegio.it/doc/finzipastori/#367 ).