Software > Tu Web meteorológica

Personalizar avisos de AEMET en nuestra web

<< < (3/10) > >>

kocher:
jmviper, has hecho una virguería jjjjjj

Ya lo he instalado en mi web.

Estuve  discurriendo el que hacer y como hacerlo porque, dado que no se conocen de antemano el número de avisos que van a ocurrir, es complicado reservar un espacio para ellos, ya que puede quedar vacío o, al revés, invadir todo el espacio; así que, gracias a jmviper, he optado por presentar el anuncio de los avisos (digamos que un resumen), con el color del tipo de riesgo asignado. El que desee conocer la información completa, debe pinchar en +INFO que le llevará a otra página con la información en forma de tabla.

Caso de no existir ningún tipo e avisos, se mostrará "Sin Avisos" sobre fondo verde.

Si a alguien se le ocurre otra forma más elegante de presentarlo, no tiene más que opinar.

Muchas gracias jmviper.

jmviper:
ummmm algo como una ventana emergente con los avisos con lo de más info…. ya miraré si hay alguna librería con jQuery para hacerlo

Queda bien en tu página  :)

kocher:
Gracias jmviper

Estás en todo; me lees el pensamiento jjjj


jmviper:
Bueno, he estado liado creando un json con todas las zonas de avisos de todos los pueblos de España y me he demorado un poco en verte esto del popup  *-* *-*

Para el "popup" de los avisos he encontrado una librería basada en jQuery (como casi todas) que tiene su propia referencia:

https://dev.vast.com/jquery-popup-overlay/

Se trata de referenciar jQuery si no se tiene y el jscript que se descarga del enlace que he puesto. Por ejemplo con estas tres líneas ya queda inicializado todo:


--- Código: ---<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="jscripts/jquery.popupoverlay.js"></script>
<script>
    $(document).ready(function() {

      // Initialize the plugin
      $('#tabla_avisos').popup({
horizontal: 'center'
  });

    });
</script>
--- Fin del código ---

Yo tengo mi propia ruta a jquery.popupoverlay.js que habrá que poner bien en el caso de cada uno. El resto es identificar los elementos:


--- Código: ---<a class="tabla_avisos_open" style="color:white; cursor: pointer; margin-left:15px; font-size: 12px;">+ INFO</a></div><table id="tabla_avisos">
--- Fin del código ---

Solo hay que poner esa clase class="tabla_avisos_open" en el enlace del php. De todas formas lo pongo modificado al final de este mensaje.

Por mi parte tras el curro de poner asociar más de 8000 localidades a sus zonas de aviso en el json he creado una página para testearlo con cualquier localidad:

https://www.meteoarchena.es/avisosaemet.php?poblacion=archena&provincia=murcia

En la parte del query o petición tras el signo ?de la URL se pone la población y la provincia de la cual queremos que nos salga el aviso. Ignorará mayúsculas o acentos y espacios en blanco (se puede poner villaviejadeyeltes todo junto  *+* *+*) pudiendo salir cualquier coincidencia, por ejemplo si en el query pongo poblacion=arch&provincia=mur me saldrá lo mismo y si hay coincidencia saldrá la primera solamente.

Creo que es el resultado esperado. Si lo pruebas a ver qué tal va  ;)

CarlosLSev:
Gran trabajo, ya lo tengo puesto en la web, gracias

Navegación

[0] Índice de Mensajes

[#] Página Siguiente

[*] Página Anterior

Ir a la versión completa