Skip to content
GitLab
Commit 35eb2369 authored by Poulard Christine's avatar Poulard Christine :snake:
Browse files

Upload New File : pour petits calculs hydraulique (master H2O)

parent efbeec1f
main
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 201 additions and 0 deletions
+201 -0
demo_calculs_TD_alea.html 0 → 100644
+ 201
− 0
View file @ 35eb2369
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TD Aléa Inondation - INRAE</title>
</head>
<body>
<h2>Démo pour le TD Aléa Inondation - INRAE </h2>
<h3>Calculs simplifiés (trop ?) en section composée ! </h3>
<p id ="consigne" >calculs indépendants par sous-sections, puis cumul</p>
<p>(et on se pose des questions : comment font les codes de calcul ?)</p>
<svg id="schema_section" width="400" height="150" viewBox="0,0,300,100"
inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<path id="section totale" stroke="brown" stroke-width="4" fill="none"
d="M 0 0 v 45 h 100 v 45 h 40 v -40 h 50 v -15 h 100 v -40"/>
<path id="Z eau" stroke="blue" stroke-width="4" fill="none"
d="M 0 10 h 290">
<title> ligne d'eau </title>
</path>
<text id="texte Z eau" stroke="blue" fill="none"
x = "50" y = "5">
ligne d'eau z = 109 m
</text>
<g id="canaux" >
<rect id="vignoble"
x = "0" y = "10"
width = "100" height = "35"
style="fill:purple;fill-opacity:0.5;stroke:none;stroke-width:0.9;stop-color:#000000">
<title>Vignoble</title>
</rect>
<rect id="lit mineur"
x = "100" y = "10"
width = "40" height = "80"
style="fill:blue;fill-opacity:0.5;stroke:none;stroke-width:0.9;stop-color:#000000">
<title>Lit mineur</title>
</rect>
<rect id="champ"
x = "140" y = "10"
width = "50" height = "40"
style="fill:gold;fill-opacity:0.5;stroke:none;stroke-width:0.9;stop-color:#000000">
<title>Champs</title>
</rect>
<rect id="village"
x = "190" y = "10"
width = "100" height = "25"
style="fill:red;fill-opacity:0.5;stroke:none;stroke-width:0.9;stop-color:#000000">
<title>Vieux Village</title>
</rect>
</g>
</svg>
<p id ="demo" >démonstrateur... version sympa de la feuille de calcul</p>
<button id="boutonPlus" onclick="clicPlus()"> [ + ] Monter la ligne d'eau </button>
<button id="boutonMoins" onclick="clicMoins()">[ - ] Descendre la ligne d'eau </button>
<button id="boutonCalcul" onclick="calculMS()">[Calculer !]</button>
<p id="journal"></p>
<p id="nombre de chenaux inondés">108 m</p>
<p id ="calcul" >démonstrateur...</p>
<script>
// Déclarations
const zhautberge = 110 ;
const zvignoble = 105.5 ;
const zmineur = 101 ;
const zchamp = 105 ;
const zvillage = 106.5 ;
const wvignoble = 100 ;
const wmineur = 40 ;
const wchamp = 50 ;
const wvillage = 100 ;
const Kvignoble = 15 ;
const Kmineur = 30 ;
const Kchamp = 20 ;
const Kvillage = 15 ;
const pente = 0.001 ;
const deltaZ = 0.25 ;
var zeau = 109 ;
majZeau();
calculMS();
document.getElementById("calcul").innerHTML = " Position initiale Zeau = " + zeau + " m NGF";
// fonctions boutons
function majZeau() {
document.getElementById("journal").innerHTML = " Zeau tracé = " + zeau + " m NGF";
document.getElementById("texte Z eau").setAttribute("textContent", "tracé : " + zeau+" m") ;
delta_y = (zhautberge - zeau) * 10 ;
let chemin = "M 0 " + delta_y + "h 290";
document.getElementById("Z eau").setAttribute("d", chemin) ;
}
function clicPlus() { zeau = zeau + deltaZ ;
majZeau();
}
function clicMoins() { zeau = zeau - deltaZ ;
majZeau();
}
function calculChenauxIndep(K, i, largeur, hauteur) {
let Sm = largeur * hauteur ;
let Pm = largeur + 2 * hauteur ;
let Rh = Sm / Pm ;
let Q = K * Math.pow(i , 0.5) * Sm * Math.pow( Rh, (2/3)) ;
return Q ;
}
function calculMS() {
document.getElementById("journal").innerHTML = " Calcul pour Zeau = " + zeau;
document.getElementById("texte Z eau").textContent = zeau+"m" ;
let y = (zhautberge - zeau) * 10 ;
let message = "" ;
let message_chenaux = "";
let pas_deau = "pas d'inondation " ;
let h_vig = zeau - zvignoble ;
message += "Qvignoble : " ;
if (h_vig > 0) {
message_chenaux+= "Profondeurs : h(vignoble)= "+h_vig.toFixed(2);
let Q_vig = calculChenauxIndep(Kvignoble, pente, wvignoble, h_vig) ;
message += Q_vig.toFixed(2) ;
document.getElementById("vignoble").setAttribute("y", y) ;
document.getElementById("vignoble").setAttribute("height", h_vig * 10) ;
document.getElementById("vignoble").setAttribute("opacity", "1");
}
else {document.getElementById("vignoble").setAttribute("opacity", "0.0");
message += pas_deau ; }
let h_min = zeau - zmineur ;
message += " ; Qlit mineur : " ;
if (h_min > 0) {
let Q_min = calculChenauxIndep(Kmineur, pente, wmineur, h_min) ;
message_chenaux += " ; dans le mineur h =" + h_min.toFixed(2) ;
message += Q_min.toFixed(2) ;
document.getElementById("lit mineur").setAttribute("y", y) ;
document.getElementById("lit mineur").setAttribute("height", h_min * 10) ;
document.getElementById("lit mineur").setAttribute("opacity", "1");
}
else {document.getElementById("lit mineur").setAttribute("opacity", "0.0");
message += pas_deau;}
let h_champ = zeau - zchamp ;
message += " ; Qchamp : " ;
if (h_champ > 0) {
let Q_champ = calculChenauxIndep(Kchamp, pente, wchamp, h_champ) ;
message_chenaux += " ; dans les champs, h =" + h_champ.toFixed(2) ;
message += Q_champ.toFixed(2) ;
document.getElementById("champ").setAttribute("y", y) ;
document.getElementById("champ").setAttribute("height", h_champ * 10) ;
document.getElementById("champ").setAttribute("opacity", "1");
}
else {document.getElementById("champ").setAttribute("opacity", "0.0");
message += pas_deau;}
let h_village = zeau - zvillage ;
message += " ; Qvillage : " ;
if (h_village > 0) {
let Q_village = calculChenauxIndep(Kvillage, pente, wvillage, h_village) ;
message_chenaux += " ; dans le village, h =" + h_village.toFixed(2) ;
message += Q_village.toFixed(2) ;
document.getElementById("village").setAttribute("y", y) ;
document.getElementById("village").setAttribute("height", h_village * 10) ;
document.getElementById("village").setAttribute("opacity", "1");
}
else {document.getElementById("village").setAttribute("opacity", "0.0");
message += pas_deau;}
document.getElementById("nombre de chenaux inondés").innerHTML = message_chenaux + " (m)" ;
document.getElementById("calcul").innerHTML = "Formule de Manning-Strickler : " + message + " (m3/s)";
}
//Add event listeners
</script>
</body>
</html>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment