Skip to content
GitLab
Projects Groups Topics Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Register
  • Sign in
  • EauDyssee-CodesDeCalcul EauDyssee-CodesDeCalcul
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributor statistics
    • Graph
    • Compare revisions
  • Issues 0
    • Issues 0
    • List
    • Boards
    • Service Desk
    • Milestones
  • Deployments
    • Deployments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Terraform modules
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • Repository
  • Wiki
    • Wiki
  • Activity
  • Graph
  • Create a new issue
  • Commits
  • Issue Boards
Collapse sidebar

La forge institutionnelle d'INRAE étant en production depuis le 10 juin 2025, nous vous recommandons d'y créer tous vos nouveaux projets.

  • Poulard Christine
  • EauDyssee-CodesDeCalculEauDyssee-CodesDeCalcul
  • Wiki
  • Sac de billes version Javascript

Sac de billes version Javascript · Changes

Page history
Update Sac de billes version Javascript authored Feb 24, 2023 by Poulard Christine's avatar Poulard Christine
Show whitespace changes
Inline Side-by-side
Sac-de-billes-version-Javascript.md
View page @ d49bd113
Pour illustrer des explications en ligne, rien ne vaut un dessin cliquable...
Pour illustrer, rien ne vaut un dessin cliquable...
Le format html permet de concevoir des pages avec dessins, textes, boutons et des interactions entre tous les objets. Il a l'avantage de ne nécessiter aucune installation et d'être multiplateformes, puisque c'est le navigateur qui se charge de l'exécution des scripts.
Les versions ci-dessous sont techniquement correctes, mais pas forcément très abouties esthétiquement... Elles sont améliorées petit à petit : la première version reposait sur un dessin svg, dont on utilisait des éléments rectangulaires comme "bouton", et on peu à peu inclus autour des objets html, comme de "vrais boutons", des zones de texte et des formulaires de saisie par exemple. Les fonctions proposées ont également évolué, en particulier pour garder une trace des tirages passés sous forme de "jetons" (à ne pas confondre avec les billes, qui elles sont remises dans le sac).
La version la plus récente est en anglais, développée en parallèle dans un autre projet appelé "bag of floods". L'idée est de proposer une version multilingue quand le développement sera suffisamment avancé. En plus de tirage de "billes", cette version permet de tirer aussi des "pseudo-événements", c'est à dire des événements stylisés en quelques points avec quelques règles arbitraires permettant d'avoir des événements asymétriques, avec éventuellement un second pic.
Les versions ci-dessous sont techniquement correctes, mais pas forcément très abouties esthétiquement... Il sera possible de les améliorer petit à petit, on y travaille (ajouter de "vrais boutons" html et des formulaires de saisie par exemple) !
La version la plus récente est en anglais.
Malheureusement, on ne peut pas inclure de l'html ici (ou alors expliquez moi...), et donc les illustrations ci-dessous ne sont que des copies d'écran. pour tester,
copiez le script depuis le dépôt et il suffit de sélectionner le fichier et le **glisser-déposer dans la barre de navigation**.
......@@ -46,6 +49,20 @@ document.getElementById("texte_serie").addEventListener("click", function() {ran
```
![image](uploads/a4c09ad9052b843120ead203c623b629/image.png)
### Version en anglais, avec boutons et possibilité de régler le nombre de billes des tirages
### Version en anglais, avec boutons et possibilité de régler le nombre de billes des tirages et de créer des "pseudo-événements"
![image](uploads/6ed0f374aeec938bc02934945568dbfc/image.png)
![image](uploads/c04fd45156fab410b79b3e0ea52fbe51/image.png)
Les règles de construction des pseudo-événement sont arbitraires, et encore en évolution.
Actuellement:
- un événement comporte 5 points, avec deux pics séparés par un point central ;
- on tire une valeur de durée, qui permettra une variabilité des abscisses des 2 derniers points.
- on tire une probabilité entre 0 et 1 et on en déduit la valeur de débit du plus grand des deux pics
- on tire une probabilité, qui sera le multiplicateur de ce pic pour obtenir la valeur du pic secondaire ;
- on tire encore une probabilité, qui déterminera si le plus grand pic vient en premier ou en deuxième ;
- on tire encore une probabilité, pour obtenir la valeur du point central point en tant que fraction du premier pic ; ce point central peut donc être au-dessus du "deuxième pic" ; sa valeur est importante pour le volume total.
Tirer des formes d'événements permet de discuter de l'attribution d'une période de retour à une crue : une crue avec un débit de pointe moins important mais une durée plus longue ne peut-elle pas se révéler plus dommageable ?
![image](uploads/71d71dbefe0a386e07ebcec1ee66f7f4/image.png)
exemple d'un tirage de 200 "pseudo-événements" (code en développement)
Clone repository
Les crues la main dans le sac...

Accueil

Plan du site

Thèmes

Le sac de billes

Pages thématiques complémentaires

De l'aléa au risque

Distribution discrète, distribution continue

Description des codes

Sommaire des codes

Sac de billes en Scratch

Sac de billes en Python

Sac de billes en ligne, en javascript

Navigation

Barre latérale