Calculer et afficher la hauteur du plafond nuageux à partir de la température et du taux d’humidité dans une page web.

base d’un nuage

point de rosée

math-javascript

math-python

Commencez  par coder la méthode de calcul en python à l’aide d’une fonction.

Nous allons ensuite  documenter cette fonction .Un programme peu ou mal documenté est difficile à corriger, modifier et réutiliser. Il est donc important de documenter , commenter son code. Vous connaissez déjà les commentaires classiques (en utilisant le caractère dièse # ) .On peut aller plus loin avec :

  • l’affichage des types
  • la documentation docstring
  • On peut ajouter des assertions

Corrigé de la résolution en python

https://capytale2.ac-paris.fr/web/c/ecb8-2888969

import math

def plafondNuageux(tpre:float,tH:float)->tuple:
    
  """
  Calcul de la hauteur du plafond nuageux:
  La temperature doit être en °C et tH. 
  l'humidité relative est comprise entre 0 et 100
  la fonction renvoi un tuple contenant la temperature de rosée puis le plafond nuageux.

  Args:
    arg1 (float): température en °C
    arg2 (float): tau d'humidité en %

  Returns:
    tuple: Température de rosée,hauteur du plafond nuageux
  """

  assert tH>=0 and tH<=100, "tH n'est pas compris entre 0 et 100" 
    
  a=17.27
  b=237.7
    
  alpha=((a*tpre)/(b+tpre) +math.log(tH / 100))
  t_rosee = (b* alpha) / (a-alpha)
    
  plafondNuage = 125 * (tpre -t_rosee)
  
  return t_rosee,plafondNuage

Fichier html

<!DOCTYPE html>
<html lang="fr">
   <head>
      <title>Nuages</title>
      <meta charset="UTF-8" />
      <link rel=" stylesheet" href="nuages.css" />
      <script src="plafond.js"></script>
   </head>
   <body>
      <h2>Hauteur du plafond nuageux</h2>
      <br>
      <button class="button" onclick="affiche()">Calculateur</button><br><br>
      <h4 id="test"></h4>
   </body>
</html>

feuille de style

body {
  background-color:#ccc;
}

h2 {
  color: rgba(28,28,28,240);
  text-align: center;
}

h4 {
  color: black;
  font-family: verdana;
  font-size: 18px;
}
.button {
  align ="center";
  padding: 15px 25px;
  font-size: 24px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: rgba(35,35,35,0.9);
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

.button:hover {background-color: #9c3232}

.button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

script javascript

function affiche() {
    //saisie des données : température et taux d'humidité
    var temperature = parseFloat(prompt('température en°C?'));

    var humiditeR = parseFloat(prompt('humidité relative en %?'));

    //calcul de la température de rosée
    var a = 17.27;
    var b = 237.7;
    var meteo = ""
    var alpha = a * temperature / (b + temperature) + Math.log(humiditeR * 0.01);
    var pointRosee = b * alpha / (a - alpha);

    //calcul du plafond nuageux
    var plafondNuage = 125 * (temperature - pointRosee)
    var plafondNuageFt = 400 * (temperature - pointRosee)
    // phrase "meteo" à afficher
    if (isNaN(plafondNuage) || humiditeR > 100 || humiditeR < 0 || isNaN(humiditeR)) {
        meteo = "erreur"
    } else {
        meteo = "Le point de rosée est égal à " + pointRosee.toFixed(0) + "°C ";
        meteo = meteo + "et la base des nuages est à " + plafondNuage.toFixed(0) + "m .";
        meteo = meteo + "<br><b>Soit " + plafondNuageFt.toFixed(0) + " ft .</b>";
    }

    //insertion de la phrase "meteo" dans la page web
    document.getElementById("test").innerHTML = "<b>" + meteo + "</b>";
}

3-2) exécution du code html ci-dessus

test de la page web

http://yb-isn.fr/nuage1

Vous pouvez tester le calculateur et inspecter la page pour comprendre le code.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *