Créer une interface synchronisant des modalités de visualisation multiples

retour

Objectif

L’objectif est de vous conduire à développer une interface WEB synchronisant des modalités de représentation différentes d’un même objet physique. Nous proposons la représentation d’une partie d’une installation industrielle représenté sous la forme d’un modèle 3D, d’un schéma mécanique et d’une représentation conceptuelle topologique.

Données nécéssaires

Les données nécessaires à la réalisation sont disponibles et téléchargeable ici :

Texte de la légende

Réalisation

La réalisation est découpée en différentes parties. Les 4 premières peuvent être traitées en parallèle.

RENDRE LA PAGE PLUS ESTHETIQUE

Cette partie, optionnelle, peut être abordée suite à chacune des parties précédentes pour rendre le résultat plus esthétique.

SYNCHRONISER LA VUE 3D, 2D, 1D ET NETWORK

Cette étape vous oriente afin de synchroniser initialement les vues 2D et 3D. Vous pouvez ensuite généraliser l’approche.

Pour aller plus loin

Vous pouvez faire preuve de créativité :

• Faire apparaître des notifications en fonction des interactions. Utiliser la librairie Toastify-js par exemple.
• Des boites de dialogue ou des infobulles pourraient apparaitre. La librairie jspanel est puissante.
• Le SVG peut être rendu navigable (zoom+pan). Librairie svg-zoom-pan.