Comunidad de diseño web y desarrollo en internet online

Anemómetro controlado por variables

Citar            
MensajeEscrito el 17 Sep 2009 08:55 pm
Hola amigos,

Sé que puedo estar abusando un poco, pero os planteo la siguiente cuestión porque no tengo ni idea de por dónde empezar...

Tengo una estación meteorológica que me genera un archivo .TXT con las variables de los datos climatológicos, tales como velocidad de viento, dirección, temperatura, etc.

El caso es que me gustaría crear una animación Flash, representando un anemómetro analógico (como una rosa de los vientos), que obedeciese a las órdenes de las variables que genera el .TXT de la estación, y cuya aguja marcase en tiempo real la dirección del viento.



Las variables que genera la estación dentro del .TXT son las que siguen:
*TMP=21.2
*WND=4.3
*AZI=258
...

La primera es la temperatura expresada en ºC, la segunda es la velocidad del viento en nudos y la tercera indica la dirección del viento sobre una esfera de 360º, como se ve en la imagen superior.

Lo que me interesa en principio, es la variable de la dirección del viento, la cual me permitiría controlar el anemómetro. Por un lado, debo conseguir la animación del anemómetro que responda a los cambios de una variable, y por otro, debo conseguir de alguna forma, que el AS interprete variables del tipo (*AZI=258) o de alguna manera se traduzcan.

¿Alguna sugerencia? Se agradece de ante mano cualquier ayuda, mil gracias...

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 07 Oct 2009 07:35 am
Hola de nuevo amigos,

Dando un paso más sobre la experiencia del anemómetro, he creado una animación, la cual hace girar la aguja según pasemos el ratón por encima del anemómetro, pero no soy capaz de pasar más allá de esto.



Mi propósito es hacer que la aguja gire y responda según las variables que le de un archivo .TXT. Este archivo es el que me envía la estación meteorológica al servidor mediante FTP cada 30 segundos.

Las variables que genera la estación dentro del .TXT son las que siguen:
*TMP=21.2
*WND=4.3
*AZI=258

La primera es la temperatura expresada en ºC, la segunda es la velocidad del viento en nudos y la tercera indica la dirección del viento sobre una esfera de 360º, como se ve en la imagen superior. Por otro, debo conseguir de alguna forma, que el AS interprete variables del tipo (*AZI=258) o de alguna manera se traduzcan.

Gracias por la ayuda que podáis prestar.

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 07 Oct 2009 12:32 pm
Hola,
para mover la aguja sólo tienes que igualar su propiedad _rotation al valor obtenido del txt, y para leerlo puedes usar LoadVars. Ejemplo:

Código ActionScript :

var text_lv:LoadVars = new LoadVars();
text_lv.onData = function(srcText:String) {
   var data_str:String = (srcText == undefined) ? "ERROR AL CARGAR LOS DATOS" : srcText;
   var data_array:Array = data_str.split("*AZI=");
   var rotation:Number = Number(data_array[1]);
   aguja._rotation = rotation;
}
text_lv.load("data.txt");

En este ejemplo se supone que *AZI=258 es la última línea del txt, si estuviese en otro lugar haría que cambiar la forma de obtener el dato. Después tendrías que usar un interval para ir leyendo el txt cada cierto tiempo.

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 07 Oct 2009 09:20 pm
Hola Isidoro,

Gracias por tu ayuda. He adaptado el código que me indicabas, pero creo que algo me falla.
Os pongo el link al FLA por si le podéis echar un vistazo.

anemometro.fla

Mil gracias...

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 08 Oct 2009 12:17 am
El código tienes que ponerlo en la línea de tiempo principal (borra la línea que has puesto: aguja._rotation="*AZI"; y lo pones en su lugar). Además, si tienes más variables debajo de *AZI=258, tendrías que cambiar el código por algo como esto:

Código ActionScript :

var textLv:LoadVars = new LoadVars();
textLv.onData = function(srcText:String)
{
   if (srcText == undefined) return;
   var data:Array = srcText.split("*AZI=");
   data = data[1].split("\r");
   var rotation:Number = Number(data[0]);
   aguja._rotation = rotation;
}
textLv.load("data.txt");

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 08 Oct 2009 06:53 am
Hola Isidoro,

He quitado la línea aguja._rotation="*AZI"; y en su lugar he puesto el código, pero sigue sin funcionar.
Alguna sugerencia...

Gracias !!

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 08 Oct 2009 08:00 am
Revisa el nombre y la ruta del txt. En el código que he puesto el fichero se llama "data.txt", y está en la misma ruta que el .fla. Si eso está bien, prueba a poner trace(srcText); dentro de la función onData para ver si se cargan o no los datos.

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 09 Oct 2009 01:01 am
Hola Isidoro,

Estupendo, tenía un pequeño fallo en el AS y ahora parece que funcioma. Ahora estoy intentando meterle el interval para que me lea de nuevo el TXT cada 5 segundos, pero no me funciona el código que he implementado en otra capa del primer frame...

Código ActionScript :

var tempo:Number = setInterval( ejecutar, 5000); 
function ejecutar(){ 
 var text_lv:LoadVars = new LoadVars(); 
 datos.onLoad = function(ok){  
    if(ok){   
      function ejecutar(){ 
}  
    }    
  }  
 text_lv.load ("datos.txt", 0); 
}


Gracias por la ayuda.

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 09:16 am
No hace falta que pongas código en ninguna otra capa (de hecho es más que recomendable que todo esté en el mismo sitio). Prueba con esto:

Código ActionScript :

var textLv:LoadVars = new LoadVars();
textLv.onData = function(srcText:String)
{
   if (srcText == undefined) return;
   var data:Array = srcText.split("*AZI=");
   data = data[1].split("\r");
   var rotation:Number = Number(data[0]);
   aguja._rotation = rotation;
}

onTime();
var intervalId:Number;
intervalId = setInterval(this, "onTime", 5000);

function onTime():Void
{
   textLv.load("data.txt");
}

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 09 Oct 2009 12:26 pm
Fenómeno Isidoro,

Ahora funciona perfectamente actualizando la dirección del viento según cambia el .TXT. He animado la aguja para darle sensación de actividad, pero no queda bien cuando realiza un cambio, por ejemplo, de 80º a 240º. Desaparece la aguja y aparece en el lado opuesto. No se me ocurre cómo hacer para que, cuando cambie de valor, la aguja circule alrededor de la esfera hasta llegar al nuevo valor ¿Sabrías cómo podría hacerlo?

Mil gracias !

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 12:28 pm
Se me olvidaba poner el link para que lo veais...
anemómetro

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 12:30 pm

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 12:49 pm
Siento ser pesado y cargar con tanta pregunta... He observado que el valor de la aguja está invertido. Cuando el .TXT indica *AZI=0 debiera marcar el Norte, pero marca el Sur ¿Cómo puedo cambiar esta situación de la aguja?

Gracias de nuevo...

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 12:54 pm
Solucionado lo de la inversión de la aguja... una tontería. Sólo poner el estado de la aguja en el Clip en el Norte y listo.

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 03:34 pm
Para que la aguja se mueva gradualmente, lo más sencillo es usar un Tween, comprobando antes si ha cambiado la dirección del viento. Eso sí, para que la animación sea un poco más suave, yo haría la animación a 24 FPS, en lugar de a 12:

Código ActionScript :

import mx.transitions.Tween;
import mx.transitions.easing.*;

var oldRotation:Number;

var textLv:LoadVars = new LoadVars();
textLv.onData = function(srcText:String)
{
   if (srcText == undefined) return;
   var data:Array = srcText.split("*AZI=");
   data = data[1].split("\r");
   var rotation:Number = Number(data[0]);
   if (rotation != oldRotation)
   {
      oldRotation = rotation;
      var rotationTween:Tween = new Tween(aguja, "_rotation", Elastic.easeOut, aguja._rotation, rotation, 1, true);
   }
}

onTime();
var intervalId:Number;
intervalId = setInterval(this, "onTime", 5000);

function onTime():Void
{
   textLv.load("data.txt");
}

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 09 Oct 2009 04:37 pm
Isidoro, fantástico... funciona a la perfección. Cierto es que a 24 fps va mejor. Ahora me toca afinar todo esto y ponerlo en marcha. Sin tu colaboración hubiera seguido aún perdido.

Os tendré presente a ti y a Cristalab en los agradecimientos de este proyecto.

Un saludo y mil gracias !

P.D. Disculpa si no tardo en saltar con otra cuestión sobre este tema, aunque antes, prometo investigar primero más.

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 09 Oct 2009 06:42 pm
De nada, me alegro de que al final funcione tu anemómetro :)

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 10 Oct 2009 10:41 am
Hola de nuevo Isidoro,
Sabía que algo se me había quedado en el tintero.

He observado que mientras la variable del viento sea la última, funciona correctamente, pero en la realidad y como crea este archivo la estación, es tal como ves abajo.

Código :

*VER=DATA2
*COD=ESAND4100000041010A
*UPD=10/10/2009 12:12
*TMP=25.7
*WND=11.5
*AZI=4
*BAR=1019.0
*HUM=43
*SUN=
*DHTM=25.9
*DLTM=19.0
*DHHM=70
*DLHM=43
*DHBR=1020.0
*DLBR=1018.0
*DGST=14.0
*DPCP=0.0
*MHTM=33.8
*MLTM=16.4
*MHHM=98
*MLHM=20
*MHBR=1022.0
*MLBR=1014.0
*MGST=30.2
*MPCP=0.0
*YHTM=42.7
*YLTM=-0.2
*YHHM=98
*YLHM=12
*YHBR=1030.0
*YLBR=987.0
*YGST=70.9
*YPCP=234.3
*EOT*


Teniendo la variable *AZI=4 en medio de todas no funciona ahora mismo ¿Cómo podís soucionar este problema?

Gracias !!

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 10 Oct 2009 11:44 am
?? Pues debería funcionar, porque el último código que te puse divide el texto teniendo en cuenta el salto de línea. Por si acaso es una nueva línea en lugar de un retorno de carro, prueba a cambiar "\r" por "\n", en la línea:

Código ActionScript :

data = data[1].split("\r");

Si no te funciona eso pásame el txt que te genera, para echarle un vistazo

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 10 Oct 2009 12:31 pm
Isidoro,
Lo he cambiado pero sigue sin funcionar. El .TXT lo puedes ver aquí...
Gracias

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 10 Oct 2009 01:07 pm
Pues a mí sí que me funciona cambiando \r por \n (fíjate bien en que la barra es esta: \, no esta: /). Si sigue sin funcionar pon:

Código ActionScript :

trace(rotation);

debajo de la línea:

Código ActionScript :

var rotation:Number = Number(data[0]);

a ver qué te muestra la salida.

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 10 Oct 2009 02:16 pm
Ole ole y ole... juas... estaba subiendo los archivos a otro dominio y comprobando en éste, así no me funcionaba, claro.
Gracias Isidoro, ahora voy a ver si pongo en pie yo sólo el resto de variables.

No descarto nuevas consultas. Gracias Isidoro!!

Por Hucles

26 de clabLevel



 

firefox
Citar            
MensajeEscrito el 07 Jun 2010 07:40 am
Hola Isidoro,
Después de un tiempo apartado de los medios por motivos familiares (paternidad), retomo este tema del anemómetro. Verás, he podido comprobar que la aguja sólo reacciona de forma inmediata a los cambios del archivo de datos, cuando se ve desde un Mac; desde un PC no funciona, hay que refrescar el archivo .TXT para que funcione ¿Alguna idea? Gracias !!!

Por Hucles

26 de clabLevel



 

firefox

 

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