205 lines
4.8 KiB
HTML
205 lines
4.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Bulles - Kinetic Graphs</title>
|
|
<link href="css/kg.0.2.1.css" rel="stylesheet" type="text/css" />
|
|
<script src="js/kg.0.2.1.js"></script>
|
|
<style>
|
|
.kg-container {
|
|
|
|
margin: auto;
|
|
}
|
|
|
|
#repartitions {
|
|
|
|
width: 100%;
|
|
}
|
|
|
|
#repartitions .axis {
|
|
|
|
display: none;
|
|
}
|
|
|
|
.kg-container ul {
|
|
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.kg-container div {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav><a href=".">< Accueil</a></nav>
|
|
|
|
<h1>Évolution des répartitions de la monnaie possédée par 4 individus</h1>
|
|
|
|
|
|
<div class="kg-container" id="repartitions">
|
|
|
|
params:
|
|
|
|
- {name: annee_reelle_depart, value: 2057}
|
|
- {name: annee, value: 1, min: 1, max: 40}
|
|
|
|
- {name: afficherNoms, value: true}
|
|
- {name: afficherParts, value: true}
|
|
- {name: afficherMontants, value: false}
|
|
- {name: afficherM, value: false}
|
|
|
|
- {name: M0_j1, value: 246869}
|
|
- {name: M0_j2, value: 154293}
|
|
- {name: M0_j3, value: 123434}
|
|
- {name: M0_j4, value: 92575}
|
|
|
|
- {name: nb_joueurs, value: 4}
|
|
- {name: scale, value: 7}
|
|
|
|
calcs:
|
|
|
|
annee_reelle: (params.annee_reelle_depart) + (params.annee) - 1
|
|
|
|
M_0: (params.M0_j1) + (params.M0_j2) + (params.M0_j3) + (params.M0_j4)
|
|
|
|
M: (calcs.M_0) * (1.10)^(params.annee - 1)
|
|
|
|
DU_total: ((calcs.M) - (calcs.M_0)) / (params.nb_joueurs)
|
|
|
|
DU_courant: (calcs.M)/(params.nb_joueurs) * 1.10
|
|
|
|
M_en_relatif: (calcs.M) / (calcs.DU_courant)
|
|
|
|
M_j1: (params.M0_j1) + (calcs.DU_total)
|
|
M_j2: (params.M0_j2) + (calcs.DU_total)
|
|
M_j3: (params.M0_j3) + (calcs.DU_total)
|
|
M_j4: (params.M0_j4) + (calcs.DU_total)
|
|
|
|
part_j1: (calcs.M_j1) / (calcs.M)
|
|
part_j2: (calcs.M_j2) / (calcs.M)
|
|
part_j3: (calcs.M_j3) / (calcs.M)
|
|
part_j4: (calcs.M_j4) / (calcs.M)
|
|
|
|
pct_j1: (calcs.part_j1) * 100
|
|
pct_j2: (calcs.part_j2) * 100
|
|
pct_j3: (calcs.part_j3) * 100
|
|
pct_j4: (calcs.part_j4) * 100
|
|
|
|
display_j1: (calcs.part_j1) * (params.scale)
|
|
display_j2: (calcs.part_j2) * (params.scale)
|
|
display_j3: (calcs.part_j3) * (params.scale)
|
|
display_j4: (calcs.part_j4) * (params.scale)
|
|
|
|
layout:
|
|
|
|
OneGraphPlusSidebar:
|
|
|
|
graph:
|
|
|
|
xAxis:
|
|
max: 12
|
|
ticks: 0
|
|
yAxis:
|
|
max: 12
|
|
ticks: 0
|
|
|
|
|
|
objects:
|
|
|
|
- Circle:
|
|
label:
|
|
text: Gabriel
|
|
show: (params.afficherNoms)
|
|
center: [4,8]
|
|
radius: (calcs.display_j1)
|
|
fill: red
|
|
color: red
|
|
stroke: red
|
|
|
|
- Circle:
|
|
label:
|
|
text: Emma
|
|
show: (params.afficherNoms)
|
|
center: [10,8]
|
|
radius: (calcs.display_j2)
|
|
fill: blue
|
|
color: blue
|
|
stroke: blue
|
|
|
|
- Circle:
|
|
label:
|
|
text: Jade
|
|
show: (params.afficherNoms)
|
|
center: [10,3]
|
|
radius: (calcs.display_j3)
|
|
fill: yellow
|
|
color: orange
|
|
stroke: yellow
|
|
|
|
- Circle:
|
|
label:
|
|
text: Leo
|
|
show: (params.afficherNoms)
|
|
center: [4,3]
|
|
radius: (calcs.display_j4)
|
|
fill: green
|
|
color: green
|
|
stroke: green
|
|
|
|
sidebar:
|
|
|
|
controls:
|
|
|
|
- title: Voir l'evolution dans le temps
|
|
description: "Faites défiler les années pour voir comment évolue la part relative de chacun dans le temps."
|
|
sliders:
|
|
|
|
- {param: annee, label: "annee"}
|
|
checkboxes:
|
|
|
|
#- param: afficherNoms
|
|
# label: "\\text{Afficher les noms de chaque humain}"
|
|
|
|
- param: afficherMontants
|
|
label: "\\text{Afficher les montants absolus}"
|
|
|
|
- param: afficherM
|
|
label: "\\text{Afficher la masse monétaire totale}"
|
|
|
|
divs:
|
|
|
|
- html: "`En ${calcs.annee_reelle}, si aucun échange n'a lieu d'ici là, la monnaie sera répartie ainsi :`"
|
|
show: (params.afficherParts | params.afficherMontants)
|
|
|
|
- html: "`<ul>
|
|
<li>${(calcs.pct_j1).toFixed(1)}% pour Gabriel</li>
|
|
<li>${(calcs.pct_j2).toFixed(1)}% pour Emma</li>
|
|
<li>${(calcs.pct_j3).toFixed(1)}% pour Jade</li>
|
|
<li>${(calcs.pct_j4).toFixed(1)}% pour Leo</li>
|
|
</ul>`"
|
|
show: not(params.afficherMontants)
|
|
|
|
- html: "`<ul>
|
|
<li>${(calcs.M_j1).toFixed(0)} Ğ1 pour Gabriel</li>
|
|
<li>${(calcs.M_j2).toFixed(0)} Ğ1 pour Emma</li>
|
|
<li>${(calcs.M_j3).toFixed(0)} Ğ1 pour Jade</li>
|
|
<li>${(calcs.M_j4).toFixed(0)} Ğ1 pour Leo</li>
|
|
</ul>`"
|
|
show: params.afficherMontants
|
|
|
|
- html: "`La maisse monétaire totale sera de ${(calcs.M_en_relatif).toFixed(0)} DU`"
|
|
show: (params.afficherM & not(params.afficherMontants))
|
|
|
|
- html: "`Le montant du DU annuel sera de ${(calcs.DU_courant).toFixed(0)} Ğ1`"
|
|
|
|
- html: "`La maisse monétaire totale sera de ${(calcs.M).toFixed(0)} Ğ1`"
|
|
show: (params.afficherM & params.afficherMontants)
|
|
|
|
</div>
|
|
</body>
|
|
</html>
|