Experience results from numerical simulations by the CEREMA in 2 locations in France. Build on OpenStreetMap, IGN data and AFrame for WebXR support.
https://bric-vr.com/cerema/portail/
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
168 lines
4.4 KiB
168 lines
4.4 KiB
|
|
<!doctype html>
|
|
<html class="no-js" lang="en" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>APP VR BRIC</title>
|
|
<link rel="stylesheet" href="css/foundation.css">
|
|
<link rel="stylesheet" href="css/app.css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
<!--<div class="grid-x grid-padding-x">
|
|
<div class="large-12 medium-12 cell">-->
|
|
|
|
<section id="heading">
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
|
|
<div class="large-4 medium-4 cell">
|
|
|
|
<div class="grid-x grid-padding-x">
|
|
<div class="large-12 medium-12 cell">
|
|
<div id="cerema">
|
|
<img src="img/Logo-Cerema_a.jpg" class="cerema">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="large-8 medium-8 cell">
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
<!-- <div class="large-4 medium-4 small-4 cell">
|
|
<div class="divLogo">
|
|
<img src="img/BRIC_logo_b.png" class="logo2">
|
|
</div>
|
|
</div>
|
|
<div class="large-4 medium-4 small-4 cell">
|
|
<div class="divLogo">
|
|
<img src="img/BRIC-Logo-Colour-b.png" class="logo2">
|
|
</div>
|
|
</div>
|
|
<div class="large-4 medium-4 small-4 cell">
|
|
<div class="divLogo">
|
|
<img src="img/EU_b.png" class="logo2">
|
|
</div>
|
|
</div> -->
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section id="principal">
|
|
<div class="grid-x grid-padding-x">
|
|
<div class="large-12 medium-12 small-12 cell ">
|
|
|
|
<p class="titre">LES EFFETS D'UNE CRUE DE LA SEINE A PONT-AUDEMER</p>
|
|
<p class="sousTitre">Une simulation en réalité virtuelle</p>
|
|
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<a href="../">
|
|
<div class="divLieu1">
|
|
<img src="img/quai-ruelle.png">
|
|
<p class="titreImg">QUAI DE LA RUELLE</p>
|
|
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<a href="../?position=1">
|
|
<div class="divLieu2">
|
|
<img src="img/les_baquets.png">
|
|
<p class="titreImg">LES BAQUETS</p>
|
|
|
|
</div>
|
|
</a>
|
|
|
|
<br>
|
|
<a href="../?position=1&simscale=0.017"> crue de mars 2001 </a>
|
|
<br>
|
|
<a href="../?position=1"> crue cinq-centennale </a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section id="logos">
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
<div class="large-6 medium-6 cell">
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<div class="divLogo">
|
|
<img src="img/BRIC-Logo-Colour-f.png" class="logo2">
|
|
</div>
|
|
</div>
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<div class="divLogo">
|
|
<img src="img/EU_f.png" class="logo2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="large-6 medium-6 cell">
|
|
<div class="grid-x grid-padding-x">
|
|
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<div class="divLogo">
|
|
<img src="img/BRIC_logo_f.png" class="logo2">
|
|
</div>
|
|
</div>
|
|
<div class="large-6 medium-6 small-6 cell">
|
|
<div id="marelle">
|
|
<p class="conception">CONCEPTION</p>
|
|
<img class="marelle" src="img/logo_marelle.png">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- </div>
|
|
</div> -->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script src="js/vendor/jquery.js"></script>
|
|
<script src="js/vendor/what-input.js"></script>
|
|
<script src="js/vendor/foundation.js"></script>
|
|
<script src="js/app.js"></script>
|
|
</body>
|
|
</html>
|
|
|