Comunidad de diseño web y desarrollo en internet online

ángulo

Citar            
MensajeEscrito el 08 Nov 2005 08:54 pm
¿Cómo incrementar la longitud de una linea creada mediante actionscript, y que a la vez mantenga el ángulo en que esta? Osea, una diagonal creada con actionscript que aumente de longitud y siga siendo una diagonal con la misma inclinacion.
(Que pesaita soy)

Por jota

48 de clabLevel



 

opera
Citar            
MensajeEscrito el 08 Nov 2005 11:22 pm
pues con el lineTo...!

básicamente

var iniX:Number = 100;
var iniY:Number = 100;
var long:Number = 300;
var ang:Number = 45;
var angRad = ang*Math.PI()/180;
var dx:Number = long*Math.cos(angRad);
var dy:Number = long*Math.sin(angRad);

_root.createEmptyMovieClip("linea",666);
linea.lineStyle(10,10,100);
linea.moveTo(iniX,iniY);
linea.lineTo(dx,dy);

esta hecho de cabeza, asi que puede haber cosas que fallen.

long es la longitud deseada (si lo metes en un enterFrame puedes poner long++)
ang es el angulo
angRad es el angulo en radianes (con lo que se trabaja, pero ang te será mas comodo)
iniX e iniY son las x e y iniciales, de donde se empezara a dibujar

dx y dy son las finales

si quieres hacer que vaya creciendo poco a pococ acuerda de ir borrando antes de redibujar

Por _CONEJO

BOFH

7639 de clabLevel

17 tutoriales
21 articulos

 

firefox
Citar            
MensajeEscrito el 08 Nov 2005 11:27 pm
De cabeza dices, eso no lo habría pensado yo ni aunque tuviera un año entero con el manual de actionscript delante, es muy complejo, admirable. Gracias!!

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 09:07 am
Ok, esto es lo que he hecho:
onEnterFrame = function(){
clear();
var iniX:Number = 255;
var iniY:Number = 0;
var long:Number = largo;

var ang:Number = 45;
var angRad = ang*Math.PI/180;
var dx:Number = long*Math.cos(angRad);
var dy:Number = long*Math.sin(angRad);


_root.createEmptyMovieClip("linea",500);
linea.lineStyle(10,10,100);
linea.moveTo(iniX,iniY);
linea.lineTo(dx,dy);
}
Le he puesto un onEnterFrame, y he intentado que la línea empieze en un punto distinto, pero entonces varía el ángulo. ¿Cómo hago para que el punto en el que empieza la línea, y el punto en el que acaba, los pueda determinar una entrada de texto, manteniendo el mismo ángulo?

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 12:39 pm
¿alguien?

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 02:33 pm

jota escribió:

. ¿Cómo hago para que el punto en el que empieza la línea, y el punto en el que acaba, los pueda determinar una entrada de texto, manteniendo el mismo ángulo?


Err... si varias el punto inicial y el final varias el angulo... explicate mejor por favor

Y no seas impaciente, aqui respondemos en nuestro tiempo libre

Por _CONEJO

BOFH

7639 de clabLevel

17 tutoriales
21 articulos

 

firefox
Citar            
MensajeEscrito el 10 Nov 2005 03:16 pm
Perdón... procuraré ser más paciente.
A lo que me refiero es a si es posible hacer un código, basado en el que hay más arriba, en el que en lugar de determinar las zonas xy donde empieza y termina la línea (la linea que genera el código) dentro el código, se puedan determinar mediante un cuadro de entrada de texto en el que escribas (en el fla publicado me refiero), y a la vez, que la línea generada mantenga siempre el mismo ángulo. He estado viendo un video tutorial sobre cosenos, senos y tangentes, pero a pesar de que se explica bastante bien está en ingles y no lo comprendo todo, también he probado ya variantes en el código por mi cuenta, pero siempre acabo cargándomelo :S Ojalá tuviera una forma de compensar a la gente que atiende mis dudas.

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 04:15 pm
Ok, acabo de darme cuenta de que lo que he dicho es una tonteria, si cambio los puntos xy de inicio y final, el ángulo tiene que cambiar :S Uff... que lio. Lo que pretendo es manejar estos tres valores dinámicamente, xy del punto de inicio y fin de la línea, y el ángulo.

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 04:29 pm
Estoo... se puede ser mas tonta? otra vez, lo que he dicho de los 3 valores es imposible (mas bien incompatible). Controlar xy del inicio de la línea, la longitud de ésta y su ángulo, dinámicamente (mediante cuadro de texto dinámico), y obtener x e y del fin de la línea. Ok, este es el ultimo mensaje que pongo, si he dicho otra tonteria ignoradla simplemente :)

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 06:45 pm
pues tendrias que tener algo como

var iniX:Number = Number(tuCampodeTexto1.text);
var iniY:Number = Number(tuOtroCampo.text);

en donde estan las lineas

var iniX:Number = 255;
var iniY:Number = 0;

Por _CONEJO

BOFH

7639 de clabLevel

17 tutoriales
21 articulos

 

firefox
Citar            
MensajeEscrito el 10 Nov 2005 08:42 pm
Ok, tengo este código:

onEnterFrame = function(){

var iniX:Number = Number(iniciox.text);
var iniY:Number = Number(inicioy.text);

var long:Number = largo;//largo es otro campo de texto dinámico

var ang:Number = 45;
var angRad = ang*Math.PI/180;
var dx:Number = long*Math.cos(angRad);
var dy:Number = long*Math.sin(angRad);


_root.createEmptyMovieClip("linea",500);
linea.lineStyle(10,10,100);
linea.moveTo(iniX,iniY);
linea.lineTo(dx,dy);
}
...pero ahora al aumentar el largo, el ángulo resultante no es de 45º sino de 135 cuando pongo un largo positivo, y de 255 (creo) cuando el largo es -, osea, el opuesto. Supongo que es complejillo, hallar una fórmula que siendo iniX e iniY aleatorios, pueda escoger el ángulo y el largo, y me de la coordenada xy del punto final de la línea generada en otro campo de texto dinámico. U otra variante, escoger inix e iniy, escoger luego xy del fin de la línea, y luego poder aumentar el largo de la línea con una variable manteniendo el ángulo que los primeros datos han generado. Creo que con ésto resuelto podría hacer un zoom 3d.
Pero esto es demasiado, si alguien sabe algún libro de trigonometría que sea claro, o alguno de actionscript para éste tipo de efectos agradecería que me lo apuntarais, asi lo pensaría yo y os ahorraría solicitudes de código que a veces ni yo tengo claro que quiero que haga. Llevo un montón de mensajes en muy poco tiempo, no sé si estoy abusando.

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 10 Nov 2005 10:51 pm
estas lineas estaban mal, sustituyelas...

var dx:Number = iniX+long*Math.cos(angRad);
var dy:Number = iniY+long*Math.sin(angRad);

errr... un zoom 3D? y no tienes ni idea de trigonometria/geometria? Te queda mucho camino que recorrer aún...

Por _CONEJO

BOFH

7639 de clabLevel

17 tutoriales
21 articulos

 

firefox
Citar            
MensajeEscrito el 11 Nov 2005 01:22 am
Ok, ahora funciona todo, muchas gracias.
Si que me queda mucho por recorrer, pero aunque ya lo he puesto en otro tema, te voya contar mi zuper teoria sobre el zoom 3d a ver que te parece :)

Creo que si tengo varios mcs en distintos puntos, si trazo dos líneas, una a cada esquina inferior del mc, y estas las uno en su punto inicial a y= 0, x = centro del documento, tengo la base para una perspectiva. Si resto x del fin de la linea de la izquierda a x de la de la derecha, tengo el ancho del mc, segun las lineas suben el ancho disminuiria, y vicecersa si bajan, creo que daria una sensacion de movimiento adelante y atrás, y ya tengo una formulita para que el alto varie proporcionalmente a width. Si ahora cojo el punto que une todas las lineas en y = 0, y lo desplazo al x centro de cualqueir mc, tengo la base para que la perspectiva ahora sea hacia ese mc. Creo... si esto funciona solo me falta controlar la velocidad :) Y hacer las líneas con alfa 0%.
Esto de la programación se me escapa, nunca he sido buena en matemáticas ni en lógica, lo mio es dibujar y tampoco es que sea un crack. Pero intentaré no tirar la toalla, porque quien sabe si con esfuerzo dentro de unos años puedo ser una diseñadora web en condiciones :) no pido ser un genio, solo poder ganarme la vida. Porque sinceramente, aunque entrara en bellas artes, no conozco a casi nadie que tras la carrera trabaje en lo que ha estudiado. El sistema educativo... Intentaré no tirar la toalla, agenciarme un libro de trigonometria, y un par de litros de algo con cafeina. Gracias de nuevo, si consigo hacer el zoom te lo debere a tí :)

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 11 Nov 2005 03:29 am
Hola!! Ya que dices que no eres muy buena programando, ahi va una ayudita ( conste que debería estar :zzz: hace un buen rato, pero es q me gusto la idea... ), este es mi código:

Código :

// Creamos una pelotita
this.attachMovie( "Circulo", "pelota", 1000 );
Key.addListener( pelota );

// Coordenadas x e y del punto de fuga
var xInicial = 400,
      yInicial = 0;   

// Coordenadas iniciales de la pelotita de muestra
pelota._x = 400;
pelota._y = 200;

// Con los cursores controlamos la pelota
pelota.onKeyDown = function() {
   // Numero de puntos a mover en una pulsacion de tecla
   var inc:Number = 5;
   // Incremento de x e y
   var dx:Number, dy:Number;

   // Vemos que tecla se ha pulsado   
   switch( Key.getCode() ) {
      case Key.LEFT:   this._x -= inc;   break;
      case Key.RIGHT: this._x += inc;  break;
      case Key.DOWN:
        // Calculamos incremento de x e y
        dx = this._x - xInicial;
        dy = this._y - yInicial;

        // Calculamos la nueva posición         
        this._x -= inc * ( dx / dy );
        this._y -= inc;

        // Calculamos el nuevo tamaño
        this._width *= ( this._x - xInicial ) / dx;
        this._height = this._width;
        break;
      case Key.UP:
        // Calculamos incremento de x e y
        dx = this._x - xInicial;
        dy = this._y - yInicial;

        // Calculamos la nueva posición            
        this._x += inc * ( dx / dy );
        this._y += inc;

        // Calculamos el nuevo tamaño
        this._width *= ( this._x - xInicial ) / dx;
        this._height = this._width;
        break;
     }

   // Esto dibuja la línea a través de la cual se mueve la pelota
   // No es necesario, pero la he puesto para q se vea mejor
   _root.clear();
   _root.lineStyle( 1, 0, 100 );
   _root.moveTo( _root.xInicial, _root.yInicial );
   _root.lineTo( this._x, this._y );
}
stop();


Para poder probar este ejemplo debes crear un MC y en las opciones de vinculación marcar la casilla exportar para AS, y en nombre le pones "Circulo". Lo he hecho suponiendo que el MC tiene igual anchura que altura, pero no es muy dificil adaptarlo a cualquier caso.

Espero q te sirva.


^^ ruuuuuuuuuuuuu

Por Gengis

27 de clabLevel



 

Córdoba(España)

firefox
Citar            
MensajeEscrito el 11 Nov 2005 01:56 pm
Jeje, :D funcionaaaaa! Y seguro que no habrás tardado ni cinco minutos en idear el código, además de haberlo simplificado eliminando lo de los ángulos (hmm, me preciaba por haber conseguido una panorámica muy sencilla, y sin embargo me había complicado la vida planteando ésto con lo de los ángulos), y funciona con las teclas como si fuera un videojuego, eso es muy interesante.... :) Arigato

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 11 Nov 2005 03:45 pm
Bueno, en realidad, fueron más de 5 minutos, pero no se lo cuentes a nadie :wink: . Bueno, sobre lo que dije ayer de las dimensiones, basta con modificar levemente el código para variar las propiedades _xscale e _yscale, en lugar de _width y _height:

Código :

this._yscale *= ( this._y - yInicial ) / dy;
this._xscale = this._yscale;


Y de paso he cambiado ( this._x - xInicial ) / dx por ( this._y - yInicial) / dy ( El valor es el mismo, lo que pasa es que, en la primera expresión , cuando ( this._x == xInicial ) el resultado es indeterminado ( 0 / 0 ), por lo que en la vertical no funcionaba ).

Además habría que corregir algunos pequeños detalles, pero creo que te puede servir para empezar. Si tienes alguna duda no dudes( valga la redundancia ) en preguntar.

^^ rrrrruuuuuuuuuuuuuuuuuuuu

Por Gengis

27 de clabLevel



 

Córdoba(España)

firefox
Citar            
MensajeEscrito el 11 Nov 2005 06:50 pm
Ok, tengo 3 botones, los tres con el código que me has dado, en uno var xInicial es 100, en otro 400, y en el último 700. Esto funciona, pero cuando le doy a otro botón el círculo vuelve a pelota._x = 400;
pelota._y = 200;
¿cómo puedo hacer que la pelota cambie de punto de fuga, pero desde la última posición en que estaba? He probado con variables, haciendo que al final del código de cada botón, dichas variables recogieran la última posición xy de la pelota, pero no lo he conseguido.
Por cierto, ¿sabes algún libro sobre matemáticas o trigonometria para actionscript? o para programación en general? He estado buscando en internet y por ahora ni siquiera los he encontrado en inglés.

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 12 Nov 2005 12:41 pm
Por si a alguien le interesa he encontrado este libro en amazon:

Flash Math Creativity


Esto... alguien sabe como solucionar lo del punto de fuga y los botones?

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 13 Nov 2005 01:32 pm
He probado éste código:

Código :

on(press){
   
// Creamos una pelotita 
this.attachMovie( "Circulo", "pelota", 1000 ); 
Key.addListener( pelota ); 
this.attachMovie( "Circulo", "pelota2", 2000); 
Key.addListener( pelota2 );
this.attachMovie( "Circulo", "pelota3", 3000); 
Key.addListener( pelota3 );

// Coordenadas x e y del punto de fuga 
var xInicial = 700, 
      yInicial = 0;    

// Coordenadas iniciales de la pelotita de muestra 
pelota._x = 400; 
pelota._y = 200; 
pelota2._x = 200; 
pelota2._y = 400; 
pelota3._x = 600; 
pelota3._y = 100; 

// Con los cursores controlamos la pelota 
pelota.onKeyDown = function() { 
   // Numero de puntos a mover en una pulsacion de tecla 
   var inc:Number = 5; 
   // Incremento de x e y 
   var dx:Number, dy:Number; 

   // Vemos que tecla se ha pulsado    
   switch( Key.getCode() ) { 
      case Key.LEFT:   this._x -= inc;   break; 
      case Key.RIGHT: this._x += inc;  break; 
      case Key.DOWN: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 
       // Calculamos la nueva posición          
        this._x -= inc * ( dx / dy ); 
        this._y -= inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
      case Key.UP: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 

        // Calculamos la nueva posición             
        this._x += inc * ( dx / dy ); 
        this._y += inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
     } 

   // Esto dibuja la línea a través de la cual se mueve la pelota 
   // No es necesario, pero la he puesto para q se vea mejor 
   _root.clear(); 
   _root.lineStyle( 1, 0, 100 ); 
   _root.moveTo( _root.xInicial, _root.yInicial ); 
   _root.lineTo( this._x, this._y ); 
} 
pelota2.onKeyDown = function() { 
   // Numero de puntos a mover en una pulsacion de tecla 
   var inc:Number = 5; 
   // Incremento de x e y 
   var dx:Number, dy:Number; 

   // Vemos que tecla se ha pulsado    
   switch( Key.getCode() ) { 
      case Key.LEFT:   this._x -= inc;   break; 
      case Key.RIGHT: this._x += inc;  break; 
      case Key.DOWN: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 
       // Calculamos la nueva posición          
        this._x -= inc * ( dx / dy ); 
        this._y -= inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
      case Key.UP: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 

        // Calculamos la nueva posición             
        this._x += inc * ( dx / dy ); 
        this._y += inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
     } 

   // Esto dibuja la línea a través de la cual se mueve la pelota 
   // No es necesario, pero la he puesto para q se vea mejor 
   _root.clear(); 
   _root.lineStyle( 1, 0, 100 ); 
   _root.moveTo( _root.xInicial, _root.yInicial ); 
   _root.lineTo( this._x, this._y ); 
} 
pelota3.onKeyDown = function() { 
   // Numero de puntos a mover en una pulsacion de tecla 
   var inc:Number = 5; 
   // Incremento de x e y 
   var dx:Number, dy:Number; 

   // Vemos que tecla se ha pulsado    
   switch( Key.getCode() ) { 
      case Key.LEFT:   this._x -= inc;   break; 
      case Key.RIGHT: this._x += inc;  break; 
      case Key.DOWN: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 
       // Calculamos la nueva posición          
        this._x -= inc * ( dx / dy ); 
        this._y -= inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
      case Key.UP: 
        // Calculamos incremento de x e y 
        dx = this._x - xInicial; 
        dy = this._y - yInicial; 

        // Calculamos la nueva posición             
        this._x += inc * ( dx / dy ); 
        this._y += inc; 

        // Calculamos el nuevo tamaño 
        this._width *= ( this._x - xInicial ) / dx; 
        this._height = this._width; 
        break; 
     } 

   // Esto dibuja la línea a través de la cual se mueve la pelota 
   // No es necesario, pero la he puesto para q se vea mejor 
   _root.clear(); 
   _root.lineStyle( 1, 0, 100 ); 
   _root.moveTo( _root.xInicial, _root.yInicial ); 
   _root.lineTo( this._x, this._y ); 
} 
stop();
}



...en un botón. El incremento de las pelotas va al reves :S la pelota que está más a la derecha se incrementa el doble que la del centro, y la del centro el doble que la de la izquierda. He probado a invertir un factor, a ver si el resultado daba al revés, pero hace cosas más raras aún. ¿?¿?¿? Y lo de los botones tampoco sé resolverlo.

SWAT: Agregadas etiquetas code

Por jota

48 de clabLevel



 

msie
Citar            
MensajeEscrito el 13 Nov 2005 04:34 pm
He probado tb con:

pelota._x = 400;
pelota._y = 200;
pelota2._x = 600;
pelota2._y = 200;
pelota3._x = 400;
pelota3._y = 100;

en resumen, la perspectiva funciona, pero las pelotas no varian su tamaño (cuando hay mas de una) de acuerdo con la perspectiva en armonia con las otras pelotas, y siempre hay una que varia de posición mucho mas rapido que las otras. Mas o menos :S
En fin, seguiré probando.

Por jota

48 de clabLevel



 

msie

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.