IMA3/IMA4 2019/2021 P11+ : Différence entre versions

De Wiki de Projets IMA
(Semaine 2)
(Semaine 2)
Ligne 87 : Ligne 87 :
 
Afin d'utiliser Bootstrap pour l'interface Web, j'utilise les lignes de code que l'on peut retrouver [https://getbootstrap.com/docs/5.0/getting-started/download/#cdn-via-jsdelivr ici]. Ceci correspond à utiliser un CDN (Content Delivery Network) qui permet de faire le lien entre le framework sans avoir à télécharger les fichiers sources sur le serveur Apache2. Il faudra alors utiliser ces deux lignes dans les entêtes de chaque fichier html et php. On peut trouver un petit comparatif entre la version locale de Bootstrap et la version CDN : [https://www.studiogalaxie.fr/librairies-cdn-ou-local-que-choisir/]. Etant donné que l'ordinateur sur lequel j'implémente le serveur est connecté à Internet, l'utilisation du CDN ne devrait pas poser du soucis. Dans le pire des cas, il devrait être possible de passer de cette version à la version locale facilement.  
 
Afin d'utiliser Bootstrap pour l'interface Web, j'utilise les lignes de code que l'on peut retrouver [https://getbootstrap.com/docs/5.0/getting-started/download/#cdn-via-jsdelivr ici]. Ceci correspond à utiliser un CDN (Content Delivery Network) qui permet de faire le lien entre le framework sans avoir à télécharger les fichiers sources sur le serveur Apache2. Il faudra alors utiliser ces deux lignes dans les entêtes de chaque fichier html et php. On peut trouver un petit comparatif entre la version locale de Bootstrap et la version CDN : [https://www.studiogalaxie.fr/librairies-cdn-ou-local-que-choisir/]. Etant donné que l'ordinateur sur lequel j'implémente le serveur est connecté à Internet, l'utilisation du CDN ne devrait pas poser du soucis. Dans le pire des cas, il devrait être possible de passer de cette version à la version locale facilement.  
  
Avec ce framework, je peux maintenant commencer à réaliser des affichages plus esthétiques en utilisant la documentation de Bootstrap ([https://getbootstrap.com/docs/5.0/components/accordion/]).
+
Avec ce framework, je peux maintenant commencer à réaliser des affichages plus esthétiques en utilisant la documentation de Bootstrap ([https://getbootstrap.com/docs/5.0/components/]).
  
 
=Documents Rendus=
 
=Documents Rendus=

Version du 25 mai 2021 à 13:51


Présentation générale

Description

Concevoir et réaliser une interface de visualisation pour des appareils de mesure

Objectifs

L'objectif du projet global (découpé en trois sous-projets) est de réaliser une plateforme complète permettant de faire des travaux pratiques d'électronique à distance.

Ce sous projet consiste en la réalisation d'une interface de commande d'un appareil de mesure (oscilloscope, multimètre, ...) ou d'un générateur à distance au travers d'une interface LXI (LAN eXtensions for Instrumentation).

L'interface sera constituée de deux modules :

  • une interface paramétrable de commande à distance des appareils (panneau de commande) ;
  • une interface d'affichage des données.

Si possible, les développements se feront en HMTL5 au travers d'un framework à choisir.

Préparation du projet

Cahier des charges

Choix techniques : matériel et logiciel

Liste des tâches à effectuer

  • Prendre en main l'interface LXI avec des appareils de mesure électronique (oscilloscope, multimètre, ...) ;
  • Réaliser une interface web permettant de contrôler les appareils et afficher les résultats.

Calendrier prévisionnel

Réalisation du Projet

Prologue

Semaine 1

Prise d'information sur l'interface LXI : en entrant l'IP de l'appareil dans la barre de recherche d'un navigateur, il semblerait que l'on puisse accéder à l'interface et commander l'appareil.

Utilisation d'un oscilloscope SDS 1102CML+ pour tester l'interface LXI :

  •  on le branche sur une carte réseau du PC puis on lui assigne une adresse ip dans le réseau local (dans le menu Utility de l'oscilloscope) et on ping cette adresse pour s'assurer de la connexion : cela fonctionne ;
  •  j'essaie d'entrer l'adresse IP sur un navigateur pour vérifier s'il existe une interface LXI mais la connexion ne fonctionne pas ;
  •  installation du programme lxi-tools (et même installation plus simple avec la commande : apt-get install lxi-tools) qui permet d'utiliser LXI en ligne de commande et l'oscilloscope est bien retrouvé avec la bonne adresse IP.

Avec ce programme on peut obtenir des screenshots de l'oscilloscope, cela pourra être utile pour l'affichage.

Premier screenshot de l'oscilloscope

Liens qui peuvent être utiles pour la suite :

[1]

[2]

[3]

[4]

Résumé de l'utilisation de la commande lxi.

Voici une liste des commandes SCPI pour contrôler l'oscilloscope. Peut-être faudra-t-il trouver d'autres commandes pour d'autres appareils de mesures.

En testant quelques commandes en mode SCPI, on s'aperçoit qu'elles ont le comportement souhaité sur l'oscilloscope.

Pour réaliser l'interface web, j'utilise un serveur Apache2 et le langage PHP (sous Linux utilisation des commandes : "apt-get install apache2" et "apt-get install libapache2-mod-php"). Pour le moment, on peut lancer la recherche des appareils connectés au réseau (réalisé avec la commande 'lxi discover'); puis choisir l'appareil que l'on souhaite utiliser.

Appareils decouverts.png

J'ai à ma disposition un seul oscilloscope donc pour le moment cela ne lance que la page de contrôle et de visualisation de l'oscilloscope. A l'avenir, il faudra ajouter une base de donnée pour pouvoir sélectionner la bonne page à lancer selon l'appareil selectionné. Sur la page de contrôle et de visualisation, on affiche une capture d'écran de l'oscilloscope et quelques boutons pour tester la communication entre le serveur et l'oscilloscope.

Visu et cmd oscillo.png

J'utiliserai ensuite le framework Bootstrap pour l'interface web.

L'affichage du screenshot devrait être raffraichit le plus souvent possible pour obtenir une visualisation réactive. Pour ce faire, il faut regarder du côté du JavaScript.

Pour débuger le code HTML/PHP, on utilise la commande : tail -f /var/log/apache2/error.log .

Semaine 2

Afin d'utiliser Bootstrap pour l'interface Web, j'utilise les lignes de code que l'on peut retrouver ici. Ceci correspond à utiliser un CDN (Content Delivery Network) qui permet de faire le lien entre le framework sans avoir à télécharger les fichiers sources sur le serveur Apache2. Il faudra alors utiliser ces deux lignes dans les entêtes de chaque fichier html et php. On peut trouver un petit comparatif entre la version locale de Bootstrap et la version CDN : [5]. Etant donné que l'ordinateur sur lequel j'implémente le serveur est connecté à Internet, l'utilisation du CDN ne devrait pas poser du soucis. Dans le pire des cas, il devrait être possible de passer de cette version à la version locale facilement.

Avec ce framework, je peux maintenant commencer à réaliser des affichages plus esthétiques en utilisant la documentation de Bootstrap ([6]).

Documents Rendus