Attenzione! Javascript è disabilitato

Il Cielo Delle Baronie

Benvenuto in questo sito, dedicato alle bellezze del cielo della Sardegna.

ASTROJS - Esempi di codice: La Fase lunare sovrapposta ad una immagine.

Breve Tutorial per sovrapporre la fase lunare su qualsiasi immagine della luna piena.
Prima di iniziare, collegate la vostra pagina Html alla libreria Astrojs, incollando il seguente listato, sotto il tag <title>.

<script type="text/javascript" src="http://www.suchelu.it/astrojs/astrojs.js"></script>
<script type="text/javascript" src="http://www.suchelu.it/astrojs/astrojs_gp.js"></script>

Utilizzate il menu a tendina [ Apri Menu Scripts: ], per poter accedere velocemente, all'elenco di tutti gli scripts, finora realizzati...

(1) Preparare l'immagine
(2) Codice CSS
(3) Codice HTML e Javascript

Fase lunare attuale:

Selezionare un'immagine della Luna piena

Dopo aver realizzato una bella immagine della luna piena, scalatela; in modo tale da renderla completamente visibile nel monitor, senza bisogno di utilizzare le barre di scorrimento.
Successivamente, applicate un ritaglio quadrato all'immagine, il più vicino possibile al bordo lunare.

Ritagliate la vostra immagine, il più vicino possibile al bordo lunare.
Un ritaglio molto vicino al bordo, permetterà di avere una maggiore precisione nella sovrapposizione della fase.

Dopo aver completato il ritaglio, salvate l'immagine in formato jpg o png..................... Continua >>.

Codice CSS:

Inserite questo codice CSS nella vostra pagina web nella sezione <head></head>.
Nella riga (1) inserite il percorso e il nome del vostro file immagine.
Nelle righe (2) inserite le dimensioni in pixel dell'immagine. In questo caso, ho utilizzato una foto da 682x682pixel, ma voi potete utilizzare qualsiasi dimensione: naturalmente, senza esagerare.

<style type="text/css">

#div_luna{
    background-color: black;
  width: 682px;                                  /* 2 */
    border: 1px solid white;
    padding:10px;
    margin-right:auto;
    margin-left:auto; }

  #luna{
  background-image: url("astrojs/Luna686.png");  /* 1 */
    background-repeat: no-repeat;
  width: 682px;                                  /* 2 */
  height:682px;                                  /* 2 */
    float: left;
    margin-bottom:10px; }

  #luna img{position: absolute; }

  #testi_luna{border: 1px dashed gray;   clear: left;  margin-top: 20px; padding-top: 10px;}

  #testi_luna p{font-family: Arial; font-size:8pt; color:white; padding-left:2px; text-align: center;}

  #testi_luna h3{
    font-family: Verdana,Arial;
    font-size: 12pt;
    color:white;
    padding-left:2px;
    font-style: oblique;
    text-align: center;
    margin-top: 0px; padding-top: 0px;}

</style>

Potete modificare questo codice di stile, in modo tale da renderlo graficamente coerente col layout del vostro sito; ma senza modificate i nomi utilizzati. ..................... Continua >>.

Codice HTML e Javascript.

Dopo aver inserito il codice CSS, continuate con l'inserimento nel sezione <body></body> di questo listato.

<div id="div_luna">    <!--disegna la fase lunare (inizio)-->

<div id="luna">

<script language="JavaScript" type="text/javascript"> 

   var  emisfero="N";     //  settare l'emisfero "N"=nord , "S"=sud.   
   var      LG="ENG";     // lingua testi. "ITA" , "ENG"               
   var dim_image=682;     // dimensione immagine lunare in pixel.      

   var njd=calcola_jd();  // ** numero del giorno giuliani della data attuale.

   disegno_fase_lunare(njd,dim_image,emisfero); // disegna la fase lunare.

</script> 

 </div>

<script language="JavaScript" type="text/javascript"> testo_fase_luna(njd,LG); </script>

 </div>              <!--disegna la fase lunare (fine)-->

Nella variabile dim_image (che corrisponde a dimensione immagine), sostituite il valore numerico 682, con quello indicato nel listato CSS. Salvate la pagina e attivate la visualizzazione con il vostro browser preferito. Se non avete commesso errori, verrà visualizzata la vostra immagine della luna con sovrapposta la fase attuale.
ATTENZIONE ! se tenterete di implementare questa funzione, durante la luna piena, non vedrete alcun effetto sulla vostra foto. Per questo motivo dovete aggiungere una riga di codice che calcolerà la fase lunare per una data senza luna piena.
Aggiungete questa riga nel listato precedente, subito dopo quella contrassegnata con due asterischi (**).


var njd= calcola_jddata(15,2,2012,12,0,0); //** numero del giorno giuliani della data 15:02:2012.

Completato l'inserimento della funzione, e dopo averne verificato il corretto funzionamento, potete cancellare quest'ultima riga, oppure "congelarla" aggiungendo i due caratteri "//".
Riattivando questa riga e sostituendo i valori numerici presenti come parametri, potete calcolare la fase lunare per qualsiasi data.

Apri Menu Scripts: >>

Riferimenti bibliografici:
JEAN MEEUS - Astronomia con il computer. ( Hoepli-1990 ) - PETER DUFFETT-SMITH -Astronomia pratica. ( Sansoni Studio 1981 )
FRANCESCO ZAGAR -Astronomia sferica e teorica ( Zanichelli 1988 )

Questo sito è Online da dicembre 2009 || Ultima modifica: 10-Dicembre 2009 || Questa pagina web rispetta le direttive del W3C | CSS 2.1 | XHTML 1.0