creazione area di disegno con jquery

[Daniele78]

Dovrei inserire all' interno di una pagina web un' area di disegno.
Si disegna tenendo premuto il pulsante sx del mouse.
Si tratta quindi di prelevare le coordinate del mouse quando il cursore è sul div e il pulsante è premuto.
Il codice che ho scritto non funziona se mentre sono sul div rilascio e premo nuovamente il pulsante.

[Daniele78]

Ho dimenticato l' allegato

[phylum]

usando jquery 1.4.3 quel codice funziona

per disegnare

Codice: Seleziona tutto

px= $('<span>').css({
'position':'absolute',
'background-color':'#000000',
'width':'10px',
'height':'10px',
top: y+offset.top ,
left: x+offset.left 
});
$(document.body).append(px);

+$(document).mouseup

[Daniele78]

Grazie!
Ho aggiunto il tuo codice e funziona.
L' unica di cui mi sono reso conto solo adesso è che è necessario eseguire un' interpolazione dei punti prima di stampare a video.
Adesso provo a cercare in giro o realizzarne una io.

Il problema a cui mi riferivo prima è un altro.
In pratica se mentre disegno lascio il pulsante e poi lo ripremo il cursore appare a forma di mano e non disegna più.
Per risolvere devo portare il puntatore fuori dal div e poi di nuovo dentro.

[phylum]

beh si devi tenere conto anche dell'accelerazione del ratto

[Daniele78]

beh si devi tenere conto anche dell'accelerazione del ratto

Si infatti.
Se funzionasse bene magari anche a bassa velocità sarebbe già un passo avanti.

[Daniele78]

Cercando un po' in giro ho trovato funzioni JS che permettono di disegnare segmenti di retta passando come parametri le coordinate degli estremi.
Esiste anche un plugin jquery per far ciò.

L' esperimento non è però riuscito in quanto si riduceva notevolmente il numero di punti ottenuti al passaggio del mouse.

Quello che penso di fare è di usare jquery per prelevare i punti al passaggio del mouse per poi darli in pasto a php il quale creerà l' immagine usando le funzioni di disegno delle prorie librerie.

Comunque lo farò poi con calma.
Non mi serve urgentemente.

[angus]

questo e gli articoli relativi li hai per caso visti?
http://www.motyar.info/2010/01/draw-with-jquery.html

[Daniele78]

questo e gli articoli relativi li hai per caso visti?
http://www.motyar.info/2010/01/draw-with-jquery.html

Ho inserito questo codice al posto del mio trai tag <script></script> così come è

Da però lo stesso problema.
Facendo debug ho scoperto che se mi muovo sul div e premo e rilascio il pulsante sx mentre il mouse è in movimento la variabile draw rimane true.

Ciò non accade se il mouse è fermo o si trova al di fuori del div.

Grazie.

[angus]

A questo punto credo di non aver capito quello che ti serve.
...vuoi disegnare delle linee o "a mano libera" ?
inoltre, del risultato cosa ne devi fare? solo visualizzarlo o salvarlo da qualche parte? se si, in un formato "bitmap" o vettoriale?