-
Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 17:49:00.0 alle 2010-01-15 17:49:00.0Sono agli inizi, mi serve solo poter fare una piccola cosa.
function quadrato() {
var canvas = document.getElementById("canvas");
var square = canvas.getContext("2d");
square.fillStyle = "rgb(0,0,0)";
square.fillRect (10, 10, 50, 50);
}
Vorrei poter fare in modo che se clicco col sinistro del mouse in un punto qualsiasi del canvas mi disegna un quadrato come quello che ho messo in square.fillRect (10, 10, 50, 50);
Come si fa in javascript nel modo più semplice possibile?-
Re: Javascript HELP!
- Scritto da:
> Sono agli inizi, mi serve solo poter fare una
> piccola
> cosa.
>
> function quadrato() {
> var canvas = document.getElementById("canvas");
> var square = canvas.getContext("2d");
> square.fillStyle = "rgb(0,0,0)";
> square.fillRect (10, 10, 50, 50);
>
> }
>
> Vorrei poter fare in modo che se clicco col
> sinistro del mouse in un punto qualsiasi del
> canvas mi disegna un quadrato come quello che ho
> messo in square.fillRect (10, 10, 50,
> 50);
> Come si fa in javascript nel modo più semplice
> possibile?
Assegna al canvas con quell'id una funzione per l'evento onClick() (O simile).
Qualcosa del tiposquare.addEvent("click", alert('mi hai clickato !'));`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 17:57:00.0 alle 2010-01-15 17:57:00.0
- Scritto da: Giambo
>
> - Scritto da:
> > Sono agli inizi, mi serve solo poter fare una
> > piccola
> > cosa.
> >
> > function quadrato() {
> > var canvas = document.getElementById("canvas");
> > var square = canvas.getContext("2d");
> > square.fillStyle = "rgb(0,0,0)";
> > square.fillRect (10, 10, 50, 50);
> >
> > }
> >
> > Vorrei poter fare in modo che se clicco col
> > sinistro del mouse in un punto qualsiasi del
> > canvas mi disegna un quadrato come quello che ho
> > messo in square.fillRect (10, 10, 50,
> > 50);
> > Come si fa in javascript nel modo più semplice
> > possibile?
>
> Assegna al canvas con quell'id una funzione per
> l'evento onClick() (O
> simile).
> Qualcosa del tipo
>> square.addEvent("click", alert('mi hai clickato > !')); >
Grazie!-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 18:22:00.0 alle 2010-01-15 18:22:00.0
- Scritto da:
>
> - Scritto da: Giambo
> >
> > - Scritto da:
> > > Sono agli inizi, mi serve solo poter fare una
> > > piccola
> > > cosa.
> > >
> > > function quadrato() {
> > > var canvas =
> document.getElementById("canvas");
> > > var square = canvas.getContext("2d");
> > > square.fillStyle = "rgb(0,0,0)";
> > > square.fillRect (10, 10, 50, 50);
> > >
> > > }
> > >
> > > Vorrei poter fare in modo che se clicco col
> > > sinistro del mouse in un punto qualsiasi del
> > > canvas mi disegna un quadrato come quello che
> ho
> > > messo in square.fillRect (10, 10, 50,
> > > 50);
> > > Come si fa in javascript nel modo più semplice
> > > possibile?
> >
> > Assegna al canvas con quell'id una funzione per
> > l'evento onClick() (O
> > simile).
> > Qualcosa del tipo
> >> > square.addEvent("click", alert('mi hai clickato > > !')); > >
>
> Grazie!
Ho creato una funzione clicca che quando faccio clic col mouse chiama la funzione draw.
Ma come faccio a dire a draw quali sono le coordinate del punto in cui ho cliccato?
Mi basta quello poi con un draw(x,y); penso di avere risolto la parte iniziale di quello che devo fare.
-
Re: Javascript HELP!
- Scritto da:
> Ho creato una funzione clicca che quando faccio
> clic col mouse chiama la funzione
> draw.
> Ma come faccio a dire a draw quali sono le
> coordinate del punto in cui ho
> cliccato?
La tua funzione draw riceve un parametro, che e' l'evento. Da questo puoi ricavare le coordinate del mousefunction draw(e) { alert("x: " + e.pageX + " y: " + e.pageY); }
`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 19:02:00.0 alle 2010-01-15 19:02:00.0
- Scritto da: Giambo
>
> - Scritto da:
>
> > Ho creato una funzione clicca che quando faccio
> > clic col mouse chiama la funzione
> > draw.
> > Ma come faccio a dire a draw quali sono le
> > coordinate del punto in cui ho
> > cliccato?
>
> La tua funzione draw riceve un parametro, che e'
> l'evento. Da questo puoi ricavare le coordinate
> del
> mouse
>
>> function draw(e) { > alert("x: " + e.pageX + " y: " + e.pageY); > } >
>
Ora riesco a disegnare i quadrati dove clicco. Però i quadrati non li fa proprio sotto il puntatore, ma un po' più in basso a destra:
Come si può sistemare?
function draw(e) {
var canvas = document.getElementById("canvas");
var quadrato = canvas.getContext("2d");
quadrato.fillStyle = "rgb(0,0,0)";
quadrato.fillRect (e.pageX, e.pageY, 50, 50);
}
function clicca(){
var canvas = document.getElementById("canvas");
canvas.onclick= draw;
}
-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 19:47:00.0 alle 2010-01-15 19:47:00.0
- Scritto da:
>
> - Scritto da: Giambo
> >
> > - Scritto da:
> >
> > > Ho creato una funzione clicca che quando
> faccio
> > > clic col mouse chiama la funzione
> > > draw.
> > > Ma come faccio a dire a draw quali sono le
> > > coordinate del punto in cui ho
> > > cliccato?
> >
> > La tua funzione draw riceve un parametro, che e'
> > l'evento. Da questo puoi ricavare le coordinate
> > del
> > mouse
> >
> >> > function draw(e) { > > alert("x: " + e.pageX + " y: " + e.pageY); > > } > >
> >
>
> Ora riesco a disegnare i quadrati dove clicco.
> Però i quadrati non li fa proprio sotto il
> puntatore, ma un po' più in basso a
> destra:
> [img]http://img693.imageshack.us/img693/517/quadra
>
> Come si può sistemare?
>
> function draw(e) {
> var canvas = document.getElementById("canvas");
> var quadrato = canvas.getContext("2d");
>
> quadrato.fillStyle = "rgb(0,0,0)";
> quadrato.fillRect (e.pageX, e.pageY, 50, 50);
>
> }
>
> function clicca(){
> var canvas = document.getElementById("canvas");
> canvas.onclick= draw;
>
>
> }
Ora funziona correttamente:
quadrato.fillRect (e.pageX-10, e.pageY-10, 50, 50);
Però è una soluzione un po' sporca, ho messo -10 a x e y.
-
Re: Javascript HELP!
- Scritto da:
> Però i quadrati non li fa proprio sotto il
> puntatore, ma un po' più in basso a
> destra:
Credo che sia per via dell'offset del canvas stesso:<html> <body> <canvas id="areadDiDisegno" style="border-style:dashed;" width="800" height="600" onClick="disegnaCanvas(event, this)"/> </body> <script language="javascript"> function disegnaCanvas(event, canvas) { var quadrato = canvas.getContext("2d"); quadrato.fillStyle = "rgb(200,0,0)"; var x = event.clientX - canvas.offsetLeft; var y = event.clientY - canvas.offsetTop quadrato.fillRect(x, y, 10, 10); } </script> </html>`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 20:47:00.0 alle 2010-01-15 20:47:00.0
- Scritto da: Giambo
>
> - Scritto da:
>
> > Però i quadrati non li fa proprio sotto il
> > puntatore, ma un po' più in basso a
> > destra:
>
> Credo che sia per via dell'offset del canvas
> stesso:
>
><html> > <body> > <canvas id="areadDiDisegno" > style="border-style:dashed;" width="800" > height="600" onClick="disegnaCanvas(event, > this)"/> > </body> > <script language="javascript"> > function disegnaCanvas(event, canvas) { > var quadrato = canvas.getContext("2d"); > quadrato.fillStyle = "rgb(200,0,0)"; > var x = event.clientX - canvas.offsetLeft; > var y = event.clientY - canvas.offsetTop > quadrato.fillRect(x, y, 10, 10); > } > </script> > </html>
Purtroppo anche così non lo disegna sotto la punta:
-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-15 21:10:00.0 alle 2010-01-15 21:10:00.0ok ho risolto:
ho creato una variabile boxsize e poi ho fatto
quadrato.fillRect (x-(boxsize/2), y-(boxsize/2), boxsize, boxsize);
-
Re: Javascript HELP!
- Scritto da:
> ok ho risolto:
>
> ho creato una variabile boxsize e poi ho fatto
>
> quadrato.fillRect (x-(boxsize/2), y-(boxsize/2),
> boxsize, boxsize);
Bravo
!
Avevo capito che volevi l'angolo in alto a sinistra del quadrato esattamente sotto il puntatore, e non il suo centro ...`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-15 22:26:00.0 alle 2010-01-15 22:26:00.0Trollate totali: 21351
- Scritto da: Giambo
>
> - Scritto da:
> > ok ho risolto:
> >
> > ho creato una variabile boxsize e poi ho fatto
> >
> > quadrato.fillRect (x-(boxsize/2), y-(boxsize/2),
> > boxsize, boxsize);
>
> Bravo
!
> Avevo capito che volevi l'angolo in alto a
> sinistra del quadrato esattamente sotto il
> puntatore, e non il suo centro
> ...
che noia
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
Re: Javascript HELP!
- Scritto da: The Lich
> > Avevo capito che volevi l'angolo in alto a
> > sinistra del quadrato esattamente sotto il
> > puntatore, e non il suo centro
> > ...
>
> che noia
Se non ne sei capace, astieniti per favore, grazie
!
`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-16 14:23:00.0 alle 2010-01-16 14:23:00.0Trollate totali: 21351
- Scritto da: Giambo
>
> - Scritto da: The Lich
>
> > > Avevo capito che volevi l'angolo in alto a
> > > sinistra del quadrato esattamente sotto il
> > > puntatore, e non il suo centro
> > > ...
> >
> > che noia
>
> Se non ne sei capace, astieniti per favore,
> grazie
> !
mi annoia perchè se non è capace di fare cose così elementari dovrebbe studiare meglio il linguaggio, prima
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
Re: Javascript HELP!
- Scritto da: The Lich
> > > che noia
> >
> > Se non ne sei capace, astieniti per favore,
> > grazie
> > !
>
> mi annoia perchè se non è capace di fare cose
> così elementari dovrebbe studiare meglio il
> linguaggio,
> prima
Mah, io sono un sostenitore dell'"impara sperimentando". Per raffinarsi c'e' sempre tempo piu' tardi, non credi ?`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-16 16:06:00.0 alle 2010-01-16 16:06:00.0Trollate totali: 21351
- Scritto da: Giambo
>
> - Scritto da: The Lich
>
> > > > che noia
> > >
> > > Se non ne sei capace, astieniti per favore,
> > > grazie
> > > !
> >
> > mi annoia perchè se non è capace di fare cose
> > così elementari dovrebbe studiare meglio il
> > linguaggio,
> > prima
>
> Mah, io sono un sostenitore dell'"impara
> sperimentando". Per raffinarsi c'e' sempre tempo
> piu' tardi, non credi
> ?
sì, la filosofia per diventare smanettoni del cavolo
prima occorre una solida base teorica POI forse si può iniziare a fare qualcosa con cognizione di causa
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
Re: Javascript HELP!
- Scritto da: The Lich
> > > mi annoia perchè se non è capace di fare cose
> > > così elementari dovrebbe studiare meglio il
> > > linguaggio,
> > > prima
> >
> > Mah, io sono un sostenitore dell'"impara
> > sperimentando". Per raffinarsi c'e' sempre tempo
> > piu' tardi, non credi
> > ?
>
> sì, la filosofia per diventare smanettoni del
> cavolo
>
> prima occorre una solida base teorica POI forse
> si può iniziare a fare qualcosa con cognizione di
> causa
Se hai le basi della programmazione, mi pare alquanto inutile leggerti totalmente le specifiche del linguaggio e poi cominciare da zero a sviluppare.`"la realta' non e' cosi' terrificante come vogliono farti credere" - Giambo ` - Wakko che cita Giambo-
Re: Javascript HELP!
- Scritto da: Giambo
>
> - Scritto da: The Lich
>
> > > > mi annoia perchè se non è capace di fare
> cose
> > > > così elementari dovrebbe studiare meglio il
> > > > linguaggio,
> > > > prima
> > >
> > > Mah, io sono un sostenitore dell'"impara
> > > sperimentando". Per raffinarsi c'e' sempre
> tempo
> > > piu' tardi, non credi
> > > ?
> >
> > sì, la filosofia per diventare smanettoni del
> > cavolo
> >
> > prima occorre una solida base teorica POI forse
> > si può iniziare a fare qualcosa con cognizione
> di
> > causa
>
> Se hai le basi della programmazione, mi pare
> alquanto inutile leggerti totalmente le
> specifiche del linguaggio e poi cominciare da
> zero a
> sviluppare.
Quoto, il try&fail è il modo più veloce per imparare.-
Re: Javascript HELP!Scritto daavvelentaniCubicolarioil 2010-01-16 16:23:00.0 alle 2010-01-16 16:23:00.0Trollate totali: 18184
- Scritto da: ChanServ
>
> - Scritto da: Giambo
> >
> > - Scritto da: The Lich
> >
> > > > > mi annoia perchè se non è capace di fare
> > cose
> > > > > così elementari dovrebbe studiare meglio
> il
> > > > > linguaggio,
> > > > > prima
> > > >
> > > > Mah, io sono un sostenitore dell'"impara
> > > > sperimentando". Per raffinarsi c'e' sempre
> > tempo
> > > > piu' tardi, non credi
> > > > ?
> > >
> > > sì, la filosofia per diventare smanettoni del
> > > cavolo
> > >
> > > prima occorre una solida base teorica POI
> forse
> > > si può iniziare a fare qualcosa con cognizione
> > di
> > > causa
> >
> > Se hai le basi della programmazione, mi pare
> > alquanto inutile leggerti totalmente le
> > specifiche del linguaggio e poi cominciare da
> > zero a
> > sviluppare.
>
> Quoto, il try&fail è il modo più veloce per
> imparare.
RETURN OF A LEGENDI think happiness is love
- Vladimir Putin
-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-16 18:03:00.0 alle 2010-01-16 18:03:00.0Trollate totali: 21351
- Scritto da: ChanServ
>
> - Scritto da: Giambo
> >
> > - Scritto da: The Lich
> >
> > > > > mi annoia perchè se non è capace di fare
> > cose
> > > > > così elementari dovrebbe studiare meglio
> il
> > > > > linguaggio,
> > > > > prima
> > > >
> > > > Mah, io sono un sostenitore dell'"impara
> > > > sperimentando". Per raffinarsi c'e' sempre
> > tempo
> > > > piu' tardi, non credi
> > > > ?
> > >
> > > sì, la filosofia per diventare smanettoni del
> > > cavolo
> > >
> > > prima occorre una solida base teorica POI
> forse
> > > si può iniziare a fare qualcosa con cognizione
> > di
> > > causa
> >
> > Se hai le basi della programmazione, mi pare
> > alquanto inutile leggerti totalmente le
> > specifiche del linguaggio e poi cominciare da
> > zero a
> > sviluppare.
>
> Quoto, il try&fail è il modo più veloce per
> imparare.
ma il fail no
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-16 18:06:00.0 alle 2010-01-16 18:06:00.0
- Scritto da: The Lich
>
> - Scritto da: ChanServ
> >
> > - Scritto da: Giambo
> > >
> > > - Scritto da: The Lich
> > >
> > > > > > mi annoia perchè se non è capace di fare
> > > cose
> > > > > > così elementari dovrebbe studiare meglio
> > il
> > > > > > linguaggio,
> > > > > > prima
> > > > >
> > > > > Mah, io sono un sostenitore dell'"impara
> > > > > sperimentando". Per raffinarsi c'e' sempre
> > > tempo
> > > > > piu' tardi, non credi
> > > > > ?
> > > >
> > > > sì, la filosofia per diventare smanettoni
> del
> > > > cavolo
> > > >
> > > > prima occorre una solida base teorica POI
> > forse
> > > > si può iniziare a fare qualcosa con
> cognizione
> > > di
> > > > causa
> > >
> > > Se hai le basi della programmazione, mi pare
> > > alquanto inutile leggerti totalmente le
> > > specifiche del linguaggio e poi cominciare da
> > > zero a
> > > sviluppare.
> >
> > Quoto, il try&fail è il modo più veloce per
> > imparare.
>
> ma il fail no
>
Basta!
Tiri sempre in ballo le tue vicende personali! 



-
-
-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-16 18:07:00.0 alle 2010-01-16 18:07:00.0Trollate totali: 21351
- Scritto da: Giambo
>
> - Scritto da: The Lich
>
> > > > mi annoia perchè se non è capace di fare
> cose
> > > > così elementari dovrebbe studiare meglio il
> > > > linguaggio,
> > > > prima
> > >
> > > Mah, io sono un sostenitore dell'"impara
> > > sperimentando". Per raffinarsi c'e' sempre
> tempo
> > > piu' tardi, non credi
> > > ?
> >
> > sì, la filosofia per diventare smanettoni del
> > cavolo
> >
> > prima occorre una solida base teorica POI forse
> > si può iniziare a fare qualcosa con cognizione
> di
> > causa
>
> Se hai le basi della programmazione, mi pare
> alquanto inutile leggerti totalmente le
> specifiche del linguaggio e poi cominciare da
> zero a
> sviluppare.
se hai le basi della programmazione ma non sai come funziona il meccanismo di gestione degli eventi -come in questo caso- o il fatto che le funzioni matematiche siano metodi di Math, per esempio, che cavolo di prove fai?
Provi a romperti la testa contro la parete e ci riesci anche piuttosto bene, poi se uno inizia a programmare senza sapere che esiste il costrutto with(), è tutto un altro paio di maniche
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
-
-
-
Re: Javascript HELP!Scritto daNon Autenticatoil 2010-01-16 14:45:00.0 alle 2010-01-16 14:45:00.0
- Scritto da: The Lich
>
> - Scritto da: Giambo
> >
> > - Scritto da: The Lich
> >
> > > > Avevo capito che volevi l'angolo in alto a
> > > > sinistra del quadrato esattamente sotto il
> > > > puntatore, e non il suo centro
> > > > ...
> > >
> > > che noia
> >
> > Se non ne sei capace, astieniti per favore,
> > grazie
> > !
>
> mi annoia perchè se non è capace di fare cose
> così elementari dovrebbe studiare meglio il
> linguaggio,
> prima
>
Il mio scopo non è diventare diventare programmatore, mi serve per una cosa personale che richiede poche righe di codice. Calcolando che non ho mai scritto niente javascript in vita mia sono stato più che bravo.
Vedi Giambo che ne sa molto più di te mi ha aiutato, tu invece stai lì a fare lo snob annoiato non servi a un cazzo.-
Re: Javascript HELP!Scritto daThe LichÜbermenschil 2010-01-16 16:05:00.0 alle 2010-01-16 16:05:00.0Trollate totali: 21351
- Scritto da:
>
> - Scritto da: The Lich
> >
> > - Scritto da: Giambo
> > >
> > > - Scritto da: The Lich
> > >
> > > > > Avevo capito che volevi l'angolo in alto a
> > > > > sinistra del quadrato esattamente sotto il
> > > > > puntatore, e non il suo centro
> > > > > ...
> > > >
> > > > che noia
> > >
> > > Se non ne sei capace, astieniti per favore,
> > > grazie
> > > !
> >
> > mi annoia perchè se non è capace di fare cose
> > così elementari dovrebbe studiare meglio il
> > linguaggio,
> > prima
> >
>
> Il mio scopo non è diventare diventare
> programmatore, mi serve per una cosa personale
> che richiede poche righe di codice. Calcolando
> che non ho mai scritto niente javascript in vita
> mia sono stato più che bravo.
>
> Vedi Giambo che ne sa molto più di te mi ha
> aiutato, tu invece stai lì a fare lo snob
> annoiato non servi a un
> cazzo.
lo so, ma me lo posso permettere
The Lich™
« Non è morto ciò che in eterno può attendere,
e col passare di strani eoni, anche la morte può morire. »

-
-
-
-
-
-
-
-
-
-
-
-
-
-