Autor Tema: Tutorial de gráficos dinámicos con Highcharts  (Leído 29492 veces)

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado kocher

  • Moderador Global
  • Hero Member
  • ******
  • Mensajes: 977
    • Ver Perfil
    • Meteo San Sebastian - Arriola
  • Estación: San Sebastian, Arriola ESEUS2000000020018A
Re:Tutorial de gráficos dinámicos con Highcharts
« Respuesta #15 en: 03 de Octubre del 2017, 18:43:47 pm »
Buenas, pues de 2 meses he conseguido poner gráficos Highcharts para CumulusMX con su base de datos.
Muchas gracias por toda la ayuda recibida a Kocher, foro, foro  y wiki de Cumulus y a San Google.

http://www.tiempoensevilla.es/wxgraphs.php
Saludos,
José Ramón

Saludos José Ramón

Te han quedado francamente chulos.

 ¡Enhorabuena!   apla3

Saludos desde San Sebastián



« Última modificación: 03 de Octubre del 2017, 18:47:44 pm por kocher »



“La mente es como un paracaídas… Solo funciona si la tenemos abierta”.

“La formulación de un problema, es más importante que su solución”.

“Si buscas resultados diferentes, no hagas siempre lo mismo" . -Albert Einstein-

Desconectado JoseBP

  • Newbie
  • *
  • Mensajes: 33
    • Ver Perfil
  • Estación: Sevilla - San Bernardo (ESAND4100000041004A)
Re:Tutorial de gráficos dinámicos con Highcharts
« Respuesta #16 en: 13 de Octubre del 2017, 12:57:56 pm »
Buenas, continúo con más gráficos:
Rosa de los Vientos http://www.tiempoensevilla.es/wxwindrose.php
Rosa con dos horas para la página de tendencias http://www.tiempoensevilla.es/wxtrends.php
Gráfico con 5 variables para las condiciones actuales http://www.tiempoensevilla.es/wxcunow.php
Seguiré informando.
Saludos,
José Ramón

Desconectado kocher

  • Moderador Global
  • Hero Member
  • ******
  • Mensajes: 977
    • Ver Perfil
    • Meteo San Sebastian - Arriola
  • Estación: San Sebastian, Arriola ESEUS2000000020018A
Re:Tutorial de gráficos dinámicos con Highcharts
« Respuesta #17 en: 05 de Mayo del 2018, 21:06:19 pm »
Vuelvo a publicar un post que encabezaba este hilo; el motivo es que he añadido una importante nota al final, que nos puede ayudar a resolver problemas de actualización de las dos tablas MiniMaxidata y data.
A continuación aparecerá el post original corregido y aumentado:

Aunque esta sección estaba un poco desatendida, os propongo una novedad muy fácil de llevar a cabo.
Se trata de conseguir un gráfico interactivo que compara los parámetros meteorológicos de nuestra estación del día y mes actual con todos los años anteriores  desde que comenzamos a registrar datos.
La información la podemos obtener en formato diario o mensual; es decir, nos presenta los valores de temperatura, humedad, viento, etc para el día de hoy y de todos los años anteriores. Lo mismo ocurre para los valores mensuales.

Para comprenderlo bien, nada mas fácil que verlo en acción:

http://kocher.es/cumulusMX/climato-test-mini/climato_gw_sand_mini_day.php

Esta es la versión compacta de los gráficos, pero, si a alguien le interesa, se puede conseguir la versión "doble", que presenta de forma simultánea los gráficos diarios y mensuales; tiene el inconveniente de ocupar bastante espacio en la pantalla:

http://kocher.es/cumulusMX/climato-gw/climato_gw_sand.php

¿ Como hacerlo ?

1) Necesitamos crear o tener una base de datos MySQL en nuestra web; el programa de Jean Turlier se encargará de crear dos tablas: MiniMaxidata y data (dentro de nuestra base de datos) y de alimentarlas periódicamente con los datos de nuestra estación. Aquí encontrareis todo lo necesario para llevarlo a cabo:

                Creación y alimentación de las tablas de nuestra base de datos (en Español)

 Hay dos pasos importantes en este magnífico tutorial:

       - Instalación del conector ODBC en nuestro Pc.
       - Instalación del programa de Jean Turlier. Actualmente tiene diferentes versiones para cada tipo de Software de adquisición de datos que estemos utilizando:
VP2SQL (Weatherlink y Vantage únicamente), Cumulus, Xnet , WS3600 , WS2300 , VWS

Una vez tengamos esto en funcionamiento, veremos que el programa de Jean Turlier se encarga, de forma automática, de tomar los datos de la estación y subirlos a la base de datos.

Hay que puntualizar que es muy importante seguir los pasos del tutorial, que está magníficamente explicado con imágenes muy representativas de lo que vamos a ver en nuestro Pc.

De todas formas me ofrezco a intentar ayudar a todo el que pudiera tener un problema.


2) Para todo aquel que ya tenga todo completado, les puedo ofrecer un importante arsenal de gráficos hechos por auténticos maestros.


Aquí va el primero:

                        http://kocher.es/cumulusMX/climato-test-mini/climato-mini.rar

Hay que descomprimir el archivo y subirlo a nuestra web; el resultado será:
                            http://kocher.es/cumulusMX/climato-test-mini/climato_gw_sand_mini_day.php

¡ NOTA IMPORTANTE !:
Debido al interés de algunos usuarios, tengo que aclarar lo siguiente:

En ocasiones, por diversos motivos (fallo de la estación, reinicio inesperado del Pc ..), el programa de Jean Turlier que se encarga de actualizar las dos tablas data y MiniMaxidata, puede cometer "errores".

Para solucionar esto, hay que hacer lo siguiente:

1) Cerrar el programa de actualización, en mi caso se trata de VP2SQL.

2) Las dos tablas deben quedar "emparejadas" con la última fecha del campo recdateTZ del último día sin errores.
Todos los demá registros en adelante, deben ser borrados.

Vamos a ver un ejemplo:
Supongamos que, a partir del el día 20/01/2018, se produjo un error y, desde entonces, las tablas no trabajan bien.
Es decir, el último día sin errores, fue el 20/01/2018; pues bien, el ultimo registro del campo recdateTZ correcto, será:

- Tabla data: 201801202355
- Tabla MiniMaxidata: 201801200000

A partir de esos registros, deben borrarse todos los posteriores; de esta manera, las dos tablas quedan correctamente emparejadas.


3) Arrancar el programa de actualización. La carga de los datos se hace de forma muy rápida.










« Última modificación: 05 de Mayo del 2018, 21:34:37 pm por kocher »



“La mente es como un paracaídas… Solo funciona si la tenemos abierta”.

“La formulación de un problema, es más importante que su solución”.

“Si buscas resultados diferentes, no hagas siempre lo mismo" . -Albert Einstein-

Desconectado kocher

  • Moderador Global
  • Hero Member
  • ******
  • Mensajes: 977
    • Ver Perfil
    • Meteo San Sebastian - Arriola
  • Estación: San Sebastian, Arriola ESEUS2000000020018A
Re:Tutorial de gráficos dinámicos con Highcharts
« Respuesta #18 en: 05 de Mayo del 2018, 21:15:20 pm »
Un pequeño truco para mejorar nuestros gráficos dinámicos con Highcharts:

Cuando generamos un gráfico de línea, solemos poner en el tipo de gráfico:

Código: [Seleccionar]
type: 'line',
Pues bien, dicha línea mejora mucho (se suaviza) si lo cambiamos por:

Código: [Seleccionar]
type: 'spline',

Saludos desde San Sebastian



“La mente es como un paracaídas… Solo funciona si la tenemos abierta”.

“La formulación de un problema, es más importante que su solución”.

“Si buscas resultados diferentes, no hagas siempre lo mismo" . -Albert Einstein-