M

mycelia-front-app

Mycelia server-less visualization UI and engine. Heart of Mycelia. Static build available to easily run Mycelia offline.

Name Last Update
.config Loading commit data...
.gitlab/issue_templates Loading commit data...
allData Loading commit data...
doc Loading commit data...
no-ie Loading commit data...
srv Loading commit data...
staticApp Loading commit data...
.editorconfig Loading commit data...
.gitignore Loading commit data...
.gitlab-ci.yml Loading commit data...
.travis.yml Loading commit data...
LICENSE Loading commit data...
README.md Loading commit data...
index.html Loading commit data...
package.json Loading commit data...

build status coverage report maintainability License: AGPL v3

Mycelia

Visualisation de graph sociaux

Démo en ligne

Usage basique (sans authentification ni édition des données)

  • Télécharger le projet
  • Remplacer le contenu du dossier allData par vos données et configuration
  • Héberger le résultat ou vous voulez

Usage hors ligne (sans authentification ni édition des données)

Remplacez la dernière étape de l'usage basique par ce qui suit :

  • Télécharger d3js et placer le dans le dossier du projet.
  • Télécharger caddyserver et placer le dans le dossier du projet (ou utiliser xampp ou autre serveur web).
  • Lancez le serveur caddy et consultez le site à l'adresse indiqué avec un navigateur moderne.

Installation complète

prérequis : node.js, git

npm install
npm start

Hébergement avec docker

docker-compose up

Structure des données :

Chaque noeud doit avoir un libellé et un type. Il peut contenir d'autres champs optionnels.

{"nodes":[
    {"label":"John Smith","type":"agent"},
    {"label":"M. Dupont","type":"avocat","dateBirth":"1970-01-01","comment":"# M. Dupont\n ## Sa vie\n ## Son oeuvre\ ..."}
]
}

Dans la configuration, chaque type devra être associé à un calque ou sous calque pour renseigner la légende et son style d'affichage.

{"nodeLayers":[
    {"id":"human","label":"Personne physique","color":"#AA3388","picto":"staticApp/appImg/people.svg",
    "subLayers":[
        {"id":"agent","label":"Agent","picto":"staticApp/appImg/people.svg"},
        {"id":"juridique","label":"Professionnel de la loi","picto":"staticApp/appImg/people.svg",
        "subLayres":[
            {"id":"avocat","label":"Avocat","picto":"staticApp/appImg/people.svg"}
        ]}
    ]}
]
}