Tags:
create new tag
, view all tags

Stage d'Arnaud Steinmetz - IUT Schuman Illkirch - [13/04/15 au 19/06/15]

Important : cette page est réservée au suivi du stage, merci de ne pas la modifier

Informations générales pour les stagiaires

Pour toute information concernant ce stage : contacter André

Sujet

Documents de travail

  • ...

Stage (avril - juin 2015)

Avril

13 :

  • Accueil et visite de différents bâtiments
  • Création d'une arborescence de travail en local
  • Téléchargement des principaux outils de développement et bibliothèques :
14:
  • Spécification des attentes d'André Schaaff
    • Modélisation WebGL : Ce premier projet fait suite à un stage effectué par un étudiant de l'ENSIIE l'année denière qui a réalisé une application de modélisation en OpenGL. André Schaaff m'a donc demander de réaliser un travail similaire en WebGL, du fait que cette dernière technologie de modélisation fonctionne sans plugin et est basé sur HTML5. Ce premier projet a donc été subdivisé selon les indications suivantes :
      • Reprendre le travail déjà effectué concernant la modélisation du système solaire (réalisé en three.js durant les cours) en utilisant babylon.js, pour se faire à cette deuxième bibliothèque.
      • Modéliser un ensemble de données dans l'espace à partir de données extraites d'un fichier (avec les deux bibliothèques).
      • Comparer les deux librairies selon plusieurs critères :
        • La performance (temps de chargement initial, taux de rafraichissement : Frame Per Second)
        • La facilité de développement (Syntaxe utilisée les deux bibliothèques, documentation présentes)
        • Les possibilités d'optimisation et les évolutions (maintien) de chaque librairies.
      • Adaptation de la modélisation de données dans l'espace pour une utilisation avec l'Oculus Rift.
  • Angular.js : Deuxième projet dont les spécifications restent à définir s'il reste du temps après la finalisation du premier projet.
  • Recherche et lecture de documentations concernant Babylon.js
  • Création de code simple, pour comprendre babylon.js.
  • Début de la création du système solaire sous babylon.js
15:
  • Continuation du système solaire, mais interruption pour éviter de perdre du temps à fait d'un bug provenant d'une origine autre que babylon.js.
  • Lecture du rapport de stage de Philippe Gaultier, étudiant à l'ENSIIE, ayant travaillé sur un projet similaire en OpenGL en 2014.
  • Tentative de lancer l'application de Philippe, pour voir à quoi devra ressembler le rendu final. Mais il semble que j'ai mal configuré certaines librairies, je retenterais donc une prochaine fois.
  • Prise de contact avec Philippe Gaultier, mail : filip.3@hotmail.fr
16: 17:
  • Participation à la conférence sur les lentilles gravitationnelles
  • Tentative de modélisation des données dans l'espace (avec babylon.js)
  • Mise en place de moyens de visualisation de la performance des deux bibliothèques :
    • Vitesse de chargement initiale de la page en ms.
    • Vitesse de raffraichissement et Frame Per Second.
  • J'ai notamment pu remarquer que three.js optimisait déjà les performances de modélisation des données, car lorsque le nombre de données affichées à l'écran (données présentes dans la scène quand même) diminue, on observe que le nombre de frame per second augmente.
  • Visualisation de différents exemples d'utilisation des bibliothèques fournies sur les sites officiels de three.js et babylon.js. Le site Potree a retenu particulièrement mon attention avec cet exemple de Pompeii, où l'on peut voir le nombre assez important de points affichés sans grand soucis de lag. Je vais regardeer le code de ces exemples plus en détail la semaine prochaine.
20: 21:
  • Modélisation sous BabylonJS (plus complexe qu'avec three.js du au manque de documentation)
  • Test des différentes caméra présentes dans three.js (la meilleure reste la PerspectiveCamera)
  • Discussion avec André pour définir la suite du déroulement du projet (pistes traitées le lendemain)
    • Les fichiers qu'il me fournit sont à chaque fois séparés en 8, donc pistes d'optimisation :
      • Lecture en parallèle des fichiers et puis ajout des points à la scène par blocs ?
    • Modification des contrôles pour se déplacer de manière plus fluide qu'avec la molette (Pas prioritaire)
22: 23: 24:
  • Matinée conférence sur le design patern singleton
  • Tentative de faire une barre de progression prenant en compte la progression des 8 fichiers (en suspens pour le moment)
  • André n'étant pas présent la semaine prochaine, grosse mise au point sur la suite :
    • Interface :
      • Voir comment mettre en place une interaction avec les éléments de la scène.
    • Déplacement des particules :
      • Voir s'il y a possibilités de modéliser des particules en mouvements (des exemples cités les jours précédent seront étudiés à nouveau)
      • Voir s'il y a possibilité d'appliquer une fonction gérant le mouvement aux points.
    • Octrees :
      • Voir ce que cela pourrait apporter (je pense surtout à l'utilisation dans le cas des particules en mouvement, sachant que three.js fait déjà une optimisation partiel en fonction de ce qui se trouve dans le champs de la caméra)
    • Chargement :
  • Prise de contact avec des personnes :
    • Ian Webster : ingénieur chez Google ayant réalisé Asterank
      • Contact :
      • Questions à poser :
        • Utilisation des Web Workers
        • Optimisations possibles dans mon cas
    • MrDoob : créateur de la librairies three.js
      • Contact :
      • Questions à poser :
        • Présentation de mon sujet
        • Questions générales sur l'optimisation liée à three.js
    • Babylon.js :
      • Contact :
        • David CATUHE (@deltakosh) : Développeur principal
        • David ROUSSET (@davrous) : Dévelopeur
        • Pierre LAGARDE (@pierlag) : Développeur
      • Questions à poser :
        • Présentation de mon sujet
        • Questions générales sur l'optimisation liée à babylon
27 : 28 :
  • Retouche du code threeJS :
    • Modification de la suppression des éléments après rechargement de nouveaux fichiers
    • Tests fichiers output60 -> est-ce normal que tous les points sont alignés et décalés
    • Amélioration de la visibilité du code et commentaire
29 : 30 : Toutes les idées et recherches sont à exploiter la semaine à venir

Mai

4 :

5 :
  • Les objets vertices ont une propriété transformDirection
  • Modification et test de la lecture des fichiers
    • FileReader, la lecture des fichiers se fait de façon asynchrone soit
      • par alternance
      • vraiment asynchrone
    • Le main reprend lorsque le code arrive à onload/onloadend
  • Test de performance avec nouveau output
    • 30 secondes de chargement initial pour 14 133 149 / 15 à 24 fps
    • 32 secondes de chargement initial pour 17 318 587 / 15 à 22 fps
  • Il va falloir découper les fichiers trop volumineux en sous partie s'il y a nécessité d'en lire.
6 : 7 :
  • Compréhension de Potree
    • Chargement des données par "chunk" de fichiers binaires ou compressé en LAZ/LAS
    • Utilisation de webworkers (encore à voir ce qu'ils font réellement)
    • Utilisation de wmlHTTPRequest pour faire les requêtes au serveur qui envoie les données (format /?\)
    • Présence d'outils de mesure (longueur, angles, coupes, volume ?) --> il faudrait tenter d'en ajouter d'autre
    • Possibilité de changer le déplacement de la caméra.
    • Découpage de Potree pas à pas pour comprendre (en cours)
      • path of pointcloud : ../resources/poinclouds/lion_takanawa/cloud.js
      • cloud.js contient donnée des chunks binaires.
      • initialisation des paramètres dat-gui (interface utilisateur)
      • creation de 3 scènes (sûrement pour les différentes caméra)
      • scene/scenePointCloud/sceneBG
      • déclaration object3D referenceFrame ajouter à scene poinCloud
      • Déclaration du renderer
        • /?\ Pourquoi autoclear à false, intérêt ?
        • /?\ A quoi sert l'extension frag_depth
      • Chargement du pointcloud en utilisant POCLoader
      • Déclaration PointCloudOctree
11 : Absent pour cause d'entretien et examen CNAM

12 :

UI : Initialisation (scène, caméra, sélection fichier, interface - désactivée avant chargement de fichier) Worker | Requête chargement du fichier totalement en mémoire -> Chargement et envoie au thread principal ou garde côté worker ? UI : Ajout des éléments à la scène en fonction des octrees (ou autre découpage), ou ajout en chunk avec workers (potree) Worker | Modification de la position des vertices grâce à des fonctions de mouvement -> Mettre à jour la présence des vertices dans la structure utilisée

13 :

Gain de 12 secondes de chargement en utilisant les buffers geometry "Nombre d'élément dans la scène : 25980565" "Temps écoulé 32367"

14 :

18 :
  • Modification de la couleur en fonction de l'âge
    • Envoie de mail du fait de la formule qui semble étrange (screenshot)
    • problème car couleur doit être entre 0 et 1 (résolu)
    • /!\ question boucle pour récupérer l'étoile la plus ancienne
    • /!\ que faire avec les valeurs nul

  • Mise en place de dat gui
    • Modification de la taille des points
    • correctif lorsqu'on clickait sur dat la scène se déplaçait
19 :
  • Questionnement pour modication de la représe
  • Modification des contrôles pour adapter au clavier de type azerty
    • ZQSD pour OrbitControls
    • Correction d'un problème de rotation pour FPSControls qui lorsqu'on se déplaçait sur l'axe horizontal, la caméra effectuait une rotation en diagonale.
    • Changement du reset pour FPSControls
  • Tentative de mise en place de EarthControls (nécessite du raycasting)
20 : 21 : 22 : 25 : 26 :
  • Etoffage des commentaires du code
  • Mise en place d'affichage d'information lors d'un clic sur un élément
  • modification dat-gui
  • Recherche de comment représenter les points très proches, pour éviter qu'ils se confondent.
27 :
  • Correction d'un problèmes lors de la sélection des éléments en cliquant, du fait de computeBoundingBox (remplacé par computeBoundingSphere)
  • Recherche sur l'utilisation de WebWorkers pour la lecture des fichiers
  • Mise en place d'un zoom lors d'un double clic sur un élément. Lorsqu'on zoom il y a :
    • Changement de la taille de tous les éléments (pour pouvoir les distinguer plus précisément)
    • Déplacement de la caméra à l'emplacement cliqué + un offset de la taille des éléments (pour ne pas se retrouver dans l'élément
    • Focus de la caméra sur l'emplacement du clic.
28 :
  • Passage de Pierre G. pour la visite et débriefing
  • Discution avec Nicolas Gillet pour les points
  • Début de mise en place d'une multivues

Juin

1:

  • Discution avec Nicolas Gillet :
    • Il faudrait modifier la représentation des points (utilisation de shaders)
  • Développement de l'aspect multivues
    • Exemple même scène avec vues différentes (ViewPort)
    • Questionnement, y a-t-il possibilité d'utilisé une même caméra pour deux scènes et renderer différents, pour ne pas avoir à appliquer les transformations similaires à deux caméras (clarté du code et optimisation à l'exécution)
  • Mise en place de la modification de la taille des éléments de la scène grâce à l'interface
2: 3: 4:
  • Réalisation vue Oculus de la simulation
  • Recherche d'un moyen d'animer les éléments dans l'espace tout en restant fluide. Plusieurs option
    • Utilisation d'un shader, envoie des données à la GPU et calcul en GLSL
    • Calcul et mise à jour des position directement dans le CPU principale (testé et non efficace, environ 7 FPS)
    • Calcul des nouvelles positions en utilisant des WebWorkers (n'ayant pas assez d'expérience dans le domaine, je n'ai pas testé cette option)
5:
  • Edition des shaders
    • Mise en place du déplacement des particules de matières noires grâce aux shaders (fonctionne correctement à 60 FPS)
    • Question posée sur StackOverFlow
    • Idée de faire la même chose pour la modélisation skybot3D avec la formule et les données adaptées.
6:
  • Mise en place de moyen de contrôle du défilement du temps dans la simulation animée de Nicolas Deparis.
  • Test Oculus avec MozVR (mieux que les anciens exemples testés, il faudra voir ce que ça donne demain avec les contrôles et le câble micro-usb).
Remarques personnelles pour la continuation du projet :

Définir un format de données pour une utilisation plus générale. Vérification du format de donnée (Si non respecté, demander à l'utisateur de modifier la fonction de lecture) Utilisation de WebWorkers (pour le chargement des données, à voir ce qui est le mieux) Utilisation d'Octrees

De plus dans la version de Mozilla Nightly, qui a deux versions d'avance sur l'officiel, ils sont en train d'établir des API intéressante :

Proposition : Ce qui serait intéressant serait de mettre en place la structure d'octree pour la modélisation, et lorsque la caméra se trouve trop loin d'un amas d'étoiles, il serait intéressant de charger une texture 2D de la galaxie correspondante. Puis lorsqu'on s'approche, il suffirait de charger les sous-cubes pour affiner la précision et donc charger directement les textures des étoiles/astéroïdes concernés.

=======================================================================================

=======================================================================================

CDD PARTIE OCULUS :

Mise en place de l'utilisation de l'oculus (headtracking et vue)

La configuration utilisée :

runtime22.jpg

> Clic droit sur le bureau > Résolution d'écran

rsolution.jpgrsolution2.jpg

> Sur la page avec l'affichage du DK2 sélectionner > Paramètres avancés > Ecran

fps.jpg

  • Source disponible sur de mon projet : cloud 3 en interne dans le dossier "www>versionFinale>dev>B_Deparis>V4_Oculus"
  • Documentation sur l'utilisation de l'Oculus en web :
Piste intéressante : Addon Oculus bridge : addon utilisé pour la communication, dans l'état actuel, la première méthode est préférable puisque fonctionnelle directement. Mais il serait intéressant de comparer les performances entre les deux méthodes.

Sauvegardes

  • à définir au cas par cas suivant le sujet du stage

Liens

  • ...

Versions testables

Testé sur ...

Documentation

Informations/travaux divers

  • ...

Travail post stage éventuel

Liste des améliorations à envisager

Bugs connus

*

Attachments Attachments
Topic attachments
I Attachment Action Size Date Who Comment
Unknown file formatpptx ArnaudSteinmetz_pre769sentation.pptx manage 3899.6 K 2016-02-19 - 16:04 AndreSchaaff  
PDFpdf ArnaudSteinmetz_pre769sentationPresentateur.pdf manage 2812.4 K 2015-11-13 - 14:40 AndreSchaaff  
Unknown file formatdocx arnaudSteinmetz_RapportDeStage_CDS20151.docx manage 8366.1 K 2016-02-19 - 16:07 AndreSchaaff  
PDFpdf arnaudSteinmetz_RapportDeStage_CDS2015_4.pdf manage 4714.4 K 2015-06-25 - 01:43 UnknownUser Rapport de stage
JPEGjpg fps.jpg manage 50.6 K 2015-08-27 - 14:47 UnknownUser  
JPEGjpg rsolution.jpg manage 68.9 K 2015-08-27 - 14:47 UnknownUser  
JPEGjpg rsolution2.jpg manage 72.9 K 2015-08-27 - 14:47 UnknownUser  
JPEGjpg runtime22.jpg manage 68.6 K 2015-08-27 - 13:53 UnknownUser  
Edit | Attach | Print version | History: r18 < r17 < r16 < r15 < r14 | Backlinks | Raw View | Raw edit | More topic actions
Topic revision: r18 - 2016-02-19 - AndreSchaaff
 
This site is powered by the TWiki collaboration platform Powered by PerlCopyright © 2008-2024 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback