mycelia-front-app
Version:
Visualisation de graph sociaux
172 lines (168 loc) • 7.82 kB
HTML
<html lang="fr">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="staticApp/default/theme/style.css"/>
<link rel="stylesheet" href="allData/customStyle.css"/>
<link rel="icon" type="image/svg+xml" sizes="any" href="staticApp/default/theme/img/favicon.svg" />
<link rel="icon" type="image/png" sizes="16x16" href="staticApp/default/theme/img/favicon16.png" />
</head>
<body>
<nav id="logoArea"><h1><a href="http://blog.agatas.org/"><img src="allData/img/logo.png"/></a></h1>
<!--
<a>Versions imprimables</a>
<a>Contact</a>
-->
</nav>
<nav id="tools-panel" class="small">
<section id="advanced-tools">
<!--
<label>Force de répulsion anti collision <input type="number"></label>
<label>Force de répulsion de proximité <input type="number"></label>
<label>Distance de répulsion de porximité <input type="number"></label>
<label>Force de répulsion globale <input type="number"></label>
<label>Température idéale du graph (0 stable,100 agité) <input type="number"></label>
<label>Friction de stabilisation <input type="number" name="friction"></label>
<label>Ratio taille min noeud <input type="number"></label>
<label>Ratio taille max noeud <input type="number"></label>
<label>Ratio taille min lien <input type="number"></label>
<label>Ratio taille min lien <input type="number"></label>
<label>Coéficient de force des liens (vitesse d'agencement) <input type="number"></label>
<label>Force d'attraction de zone <input type="number"></label>
-->
<!-- TODO: zones :
gooey method : http://www.visualcinnamon.com/2015/05/gooey-effect.html
convex hull method : http://bl.ocks.org/mbostock/4341699 & https://github.com/d3/d3-polygon/blob/master/README.md#polygonHull
+ attracteur invisible
-->
<!-- TODO: Voronoi
Activer la sélection par maillage Voronoi
Afficher le maillage Voronoi
Distance maximum Voronoi
http://stackoverflow.com/questions/17341030/generating-vertices-for-voronoi-diagram-in-d3js
-->
<!-- TODO: style de liens :
directe/droit,
courbe cf http://bl.ocks.org/d3noob/5155181 et http://bl.ocks.org/mbostock/4600693 et http://www.nytimes.com/interactive/2013/02/20/movies/among-the-oscar-contenders-a-host-of-connections.html,
à angle droit cf
-->
<!--
Options filtres et réglages ||
survol d'un lien -> affiche son type et sa pondération le cas échéant
survol d'un noeud ou d'un lien -> atténue les éléments de légende d'autre type
clic sur un noeud ou un lien -> le sélectionne et ouvre sa description
double-clic sur un noeud -> centre et fige le noeud
Ctrl+Glisser déplacer sur un noeud -> figer un noeud à sa position de laché
Ctrl+Glisser déplacer sur un lien -> créer un mini noeud intermédiaire invisible figé à la position de laché + fusionner les liens croisé durant le glissé déplacé s'ils ont un noeud en commun (dans ce cas, le mini noeud créé n'est pas invisible)
double-clic ou Ctrl+clic sur noeud figé -> libère le noeud.
-->
<!--<button id="editionMode" title="Passer en mode édition">Editer</button>-->
<button id="editTrad" title="Formulaire de traduction">Traduction</button>
<label>FPS : avg:<span id="fpsCurVal"></span> min:<span id="fpsMinVal"></span> max:<span id="fpsMaxVal"></span></label>
<div id="langPicker"></div>
</section>
<section id="main-tools">
<!--
<a>Afficher les réglages avancés</a>
<a title="flux RSS des mise à jour de données">
<img src="staticApp/appImg/unknow.svg" class="picto">
</a>
<a title="sauvegarder en pdf pour l'impression">
<img src="staticApp/appImg/unknow.svg" class="picto">
</a>
<a title="exporter (svg, json des données affiché, json total des données publiques">
<img src="staticApp/appImg/unknow.svg" class="picto">
</a>
-->
<!--
<a title="partager la carte (FB,twitter,embed...)">
<img src="staticApp/appImg/unknow.svg" class="picto">
</a>
<label>Zoom <input type="number">%</label>
<label title="Garder tous les éléments à l'écran">
<input type="checkbox"/> Confiner
</label>
<label title="Distance maximum aux neuds sélectionnés">
<img src="staticApp/appImg/unknow.svg" class="picto">
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>∞</option>
</select>
</label>
<label title="Estomper les liens selon">
<img src="staticApp/appImg/unknow.svg" class="picto">
<select>
<option>leur date de fin</option>
<option>leur fugacité</option>
<option>...</option>
</select>
</label>
<label title="Epaisseur des liens selon">
<img src="staticApp/appImg/unknow.svg" class="picto">
<select>
<option>rien (epaisseur constante)</option>
<option>leur durée dans le temps</option>
<option>leur ampleur/importance</option>
<option>...</option>
</select>
</label>
<label title="Taille des acteur selon">
<img src="staticApp/appImg/unknow.svg" class="picto">
<select>
<option>rien (taille constante)</option>
<option>leur capital</option>
<option>leur nombre de liens</option>
<option>le nombre de leur subordonnés</option>
<option>...</option>
</select>
</label>
▴▾▲▼ ◀▶◂▸
-->
</section>
<button class="reduce bottom">▴</button>
<button class="expand bottom">▾</button>
</nav>
<figure>
<figcaption id="legend" class="small">
</figcaption>
<noscript>
Cette application à besoin de javascript pour fonctionner.
<br/>Des exports imprimables devraient être disponible plus tard.
</noscript>
<svg id="viz" class="loading" role="application"><image xlink:href="staticApp/default/theme/img/loading.svg" width="100%" height="100%"/></svg>
</figure>
<article id="details" class="small">
<section>
</section>
<button class="reduce left">▸</button>
<button class="expand left">◂</button>
</article>
<footer>
<a id="legals" href="#{%22userMode%22:%22page%22,%22selected%22:%22legals%22,%22panels%22:{%22details%22:%22big%22}}">Mentions légales</a>
<a href="https://framagit.org/mycelia/mycelia-front-app/blob/master/LICENSE.md" title="Application Libre de droit, remonter au sources" target="_blank">EUPL</a>
</footer>
<script id="no-ie" type="application/javascript">
if (navigator.userAgent.indexOf('MSIE') != -1
|| (navigator.userAgent.indexOf('Trident') != -1 && navigator.userAgent.indexOf('rv:11'))
|| (navigator.userAgent.indexOf('Firefox') != -1 && 50 > parseFloat(navigator.userAgent.split('rv:')[1]))
) {
var lang = navigator.userLanguage || navigator.language || navigator.browserLanguage;
if (lang.substr(0, 2) === 'fr' || lang.substr(0, 2) === 'es') lang = lang.substr(0, 2) + '.html';
else lang = '';
window.location.href = 'no-ie/' + lang;
}
</script>
<script>
if ('serviceWorker' in navigator) navigator.serviceWorker.register('./cacheServiceWorker.js')
.then(reg => console.log('Cache service worker registred. Scope : ', reg.scope))
.catch(error => console.log('Cache service worker registration failed : ', error));
else console.log('Service workers are not supported.');
</script>
<script src="staticApp/mycelia-front-app.full.static.min.js"></script>
</body>
</html>