Un pluviomètre avec la balise "lineargauge"

Comme pour nos premiers graphiques, on commence par créer une image et un cadre qui contiendra notre image de base.
toujours entre les balises <stylesheet>, nous ajoutons la balise "stretch" pour adapter la grandeur de l'image à la grandeur du cadre. On ajoute aussi un titre avec la balise "title"

<?xml version="1.0" encoding="iso-8859-1" ?>
<stylesheet>
  <image width="950" height="300" />
  <!-- ================= Rainfall ================= -->
    <frame width="350" height="300" position-x="0" position-y="0">
      <title text="\nPrécipitations" alignement="top|hcenter" >
        <font color="FF0000CC" facename="Arial" size="20" weight="600" italic="1" />
      </title>
      <background texture="precipitations.png" stretch="1" />
    </frame>
</stylesheet>

On ajoute notre première jauge avec "lineargauge" et on la positionne avec "position-x et y", on met aussi un titre "title" avec l'indication de la pluviométrie annuelle $Stats[Year,TotalRainfall] cette valeur est reprise des statistiques, puis on la positionne avec "position-x et y"

<lineargauge width="25" height="250" shadow="0" orientation="1" position-x="20" position-y="30" >
  <title text="$Stats[Year,TotalRainfall] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
     <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
  </title>
</lineargauge>

On rajoute l'axe X "axis" avec le min et le max, ici j'ai mis le max à 1000 mais suivant les régions il faudra augmenter cette valeur.
On rajoute aussi les graduations pricipale "majorticks" et secondaires "minorticks". On place les étiquettes "labels" à gauche.

<axis color="66000000" min="0" max="1000" side="left" titlemargin="30" titleside="left">
    <labels labelinterval="1" side="right" hide="0">
       <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
    </labels>
   <ticks majorticks="6" minorticks="3" side="right" minorticksize="18" majorticksize="25"/>
 </axis>

On rajoute un cadre "frame" avec l'image de fond et on la positionne exactement sur la jauge avec position x et y

<frame width="80" height="250" position-x="28" position-y="30">
        <background texture="pluvio_fond.png" stretch="1" />
</frame>

Pour terminer la première jauge, on rajoute un titre sur la gauche avec "title" placé dans un cadre "frame"

<frame width="130" height="50" position-x="-25" position-y="125">
     <title text="Sur l'année en cours" alignement="relative" angle="90">
        <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
     </title>
</frame>

La prmière jauge est terminée, voici le code complet

<?xml version="1.0" encoding="iso-8859-1" ?>
<stylesheet>
  <image width="950" height="300" />
  <!-- ================= Rainfall ================= -->
    <frame width="350" height="300" position-x="0" position-y="0">
      <title text="\nPrécipitations" alignement="top|hcenter" >
        <font color="FF0000CC" facename="Arial" size="20" weight="600" italic="1" />
      </title>
      <background texture="precipitations.png" stretch="1" />
    </frame>
    <!-- ================= Pluie totale ================= -->
      <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="20" position-y="30" >
        <title text="$Stats[Year,TotalRainfall] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
          <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
        </title>
        <axis color="66000000" min="0" max="1000" side="left" titlemargin="30" titleside="left">
          <labels labelinterval="1" side="right" hide="0">
            <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
          </labels>
          <ticks majorticks="6" minorticks="3" side="right" minorticksize="18" majorticksize="25"/>
        </axis>
        <index>
          <stats_year_totalrainfall color1="500000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
        </index>
      </lineargauge>
      <frame width="80" height="250" position-x="28" position-y="30">
        <background texture="pluvio_fond.png" stretch="1" />
      </frame>
      <frame width="130" height="50" position-x="-25" position-y="125">
        <title text="Sur l'année en cours" alignement="relative" angle="90">
          <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
        </title>
      </frame>
    </stylesheet>

De la même façon on rajoute la deuxième jauge (pluie du mois), "copier-coller la jauge pluie annuelle" puis on la déplace l'axe x de 75 pixels sur la droite idem pour l'image de fond.
On remplace les stats annuelles par les stats mensuelles $Stats[Month,TotalRainfall]

<!-- ================= Pluie mois ================= -->
        <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="95" position-y="30" >
          <title text="$Stats[Month,TotalRainfall] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
            <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
          </title>
          <axis color="66000000" min="0" max="250" side="left" titlemargin="30" titleside="left">
            <labels labelinterval="1" side="right" hide="0">
              <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
            </labels>
            <ticks majorticks="6" minorticks="4" side="right" minorticksize="18" majorticksize="25"/>
          </axis>
          <index>
            <stats_month_totalrainfall color1="500000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
          </index>
        </lineargauge>
        <frame width="80" height="250" position-x="103" position-y="30">
          <background texture="pluvio_fond.png" stretch="1" />
        </frame>
        <frame width="130" height="50" position-x="50" position-y="125">
          <title text="Sur le Mois en cours" alignement="relative" angle="90" >
            <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
          </title>
        </frame>

De la même façon on rajoute la troisième jauge (pluie sur 24h), "copier-coller la jauge pluie mensuelle" puis on la déplace l'axe x de 75 pixels sur la droite idem pour l'image de fond.
On remplace les stats mensuelles par current_rainfall_24h, maintenant la valeur n'est plus issue des statistiques.

<!-- ================= pluie  24h ================= -->
          <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="170" position-y="30" >
            <title text="$Current[rainfall_24h] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
              <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
            </title>
            <axis color="66000000" min="0" max="50" side="left" titlemargin="30" titleside="left">
              <labels labelinterval="1" side="right" hide="0">
                <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
              </labels>
              <ticks majorticks="6" minorticks="4" side="right" minorticksize="18" majorticksize="25"/>
            </axis>
            <index>
              <current_rainfall_24h color1="550000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
            </index>
          </lineargauge>
          <frame width="80" height="250" position-x="178" position-y="30">
            <background texture="pluvio_fond.png" stretch="1" />
          </frame>
          <frame width="130" height="50" position-x="125" position-y="125">
            <title text="Sur les dernières 24 h" alignement="relative" angle="90" >
              <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
            </title>
          </frame>

De la même façon on rajoute la dernère jauge (pluie sur 1h), "copier-coller la jauge pluie 24h" puis on la déplace l'axe x de 75 pixels sur la droite idem pour l'image de fond.
On remplace les stats mensuelles par current_rainfall_1h, maintenant la valeur n'est plus issue des statistiques.

 <!-- ================= pluie 1h ================= -->
 <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="245" position-y="30" >
        <title text="$Current[rainfall_1h] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
                <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
         </title>
           <axis color="66000000" min="0" max="25" side="left" titlemargin="30" titleside="left">
                <labels labelinterval="1" side="right" hide="0">
                  <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
                </labels>
                <ticks majorticks="6" minorticks="4" side="right"  minorticksize="18" majorticksize="25"/>
           </axis>
              <index>
                <current_rainfall_1h color1="550000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
              </index>
  </lineargauge>
        <frame width="80" height="250" position-x="253" position-y="30">
              <background texture="pluvio_fond.png" stretch="1" />
        </frame>
        <frame width="130" height="50" position-x="200" position-y="125">
              <title text="Sur la dernière heure" alignement="relative" angle="90">
                <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
              </title>
         </frame>

C'est terminé, voici encore le code complet.

<?xml version="1.0" encoding="iso-8859-1" ?>
<stylesheet>
  <image width="950" height="300" />
  <!-- ================= Rainfall ================= -->
    <frame width="350" height="300" position-x="0" position-y="0">
      <title text="\nPrécipitations" alignement="top|hcenter" >
        <font color="FF0000CC" facename="Arial" size="20" weight="600" italic="1" />
      </title>
      <background texture="precipitations.png" stretch="1" />
    </frame>
    <!-- ================= Pluie totale ================= -->
      <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="20" position-y="30" >
        <title text="$Stats[Year,TotalRainfall] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
          <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
        </title>
        <axis color="66000000" min="0" max="1000" side="left" titlemargin="30" titleside="left">
          <labels labelinterval="1" side="right" hide="0">
            <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
          </labels>
          <ticks majorticks="6" minorticks="3" side="right" minorticksize="18" majorticksize="25"/>
        </axis>
        <index>
          <stats_year_totalrainfall color1="500000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
        </index>
      </lineargauge>
      <frame width="80" height="250" position-x="28" position-y="30">
        <background texture="pluvio_fond.png" stretch="1" />
      </frame>
      <frame width="130" height="50" position-x="-25" position-y="125">
        <title text="Sur l'année en cours" alignement="relative" angle="90">
          <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
        </title>
      </frame>
      <!-- ================= Pluie mois ================= -->
        <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="95" position-y="30" >
          <title text="$Stats[Month,TotalRainfall] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
            <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
          </title>
          <axis color="66000000" min="0" max="250" side="left" titlemargin="30" titleside="left">
            <labels labelinterval="1" side="right" hide="0">
              <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
            </labels>
            <ticks majorticks="6" minorticks="4" side="right" minorticksize="18" majorticksize="25"/>
          </axis>
          <index>
            <stats_month_totalrainfall color1="500000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
          </index>
        </lineargauge>
        <frame width="80" height="250" position-x="103" position-y="30">
          <background texture="pluvio_fond.png" stretch="1" />
        </frame>
        <frame width="130" height="50" position-x="50" position-y="125">
          <title text="Sur le Mois en cours" alignement="relative" angle="90" >
            <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
          </title>
        </frame>
        <!-- ================= pluie 24h ================= -->
          <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="170" position-y="30" >
            <title text="$Current[rainfall_24h] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
              <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
            </title>
            <axis color="66000000" min="0" max="50" side="left" titlemargin="30" titleside="left">
              <labels labelinterval="1" side="right" hide="0">
                <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
              </labels>
              <ticks majorticks="6" minorticks="4" side="right" minorticksize="18" majorticksize="25"/>
            </axis>
            <index>
              <current_rainfall_24h color1="550000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
            </index>
          </lineargauge>
          <frame width="80" height="250" position-x="178" position-y="30">
            <background texture="pluvio_fond.png" stretch="1" />
          </frame>
          <frame width="130" height="50" position-x="125" position-y="125">
            <title text="Sur les dernières 24 h" alignement="relative" angle="90" >
              <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
            </title>
          </frame>
          <!-- ================= pluie 1h ================= -->
            <lineargauge width="25" height="250" shadow="0" orientation="1" position-x="245" position-y="30" >
              <title text="$Current[rainfall_1h] $Unit[Rainfall]" alignement="relative" position-x="1.80" position-y="0.93">
                <font color="FF0000FF" facename="Arial" size="16" weight="400" italic="1" />
              </title>
              <axis color="66000000" min="0" max="25" side="left" titlemargin="30" titleside="left">
                <labels labelinterval="1" side="right" hide="0">
                  <font color="FF000000" facename="Arial" size="14" weight="400" italic="0" />
                </labels>
                <ticks majorticks="6" minorticks="4" side="right" minorticksize="18" majorticksize="25"/>
              </axis>
              <index>
                <current_rainfall_1h color1="550000FF" color2="FF00CCFF" filled="1" side="right" thick="25" />
              </index>
            </lineargauge>
            <frame width="80" height="250" position-x="253" position-y="30">
              <background texture="pluvio_fond.png" stretch="1" />
            </frame>
            <frame width="130" height="50" position-x="200" position-y="125">
              <title text="Sur la dernière heure" alignement="relative" angle="90">
                <font color="FF000000" facename="Arial" size="15" weight="450" italic="1" />
              </title>
            </frame>
          </stylesheet>