Comment faire un schéma heuristique sur le web

Schéma heuristique sur le web

Je cherche toujours le moyen de prendre de notes avec un ordinateur.. j’ai encore rien de très pratique. (mais ça commence avec ce système de wiki) Souvent je prends des notes à la main sous forme de schéma heuristique.

Le but est donc de pouvoir refaire quelque chose de semblable avec un ordinateur. Et mieux encore dans une page web!

J’ai la possibilité de faire des bloc pour représenter un diagramme, mais je n’ai encore rien trouvé pour faire un trait de liaison entre les différents bloc. L’HTML n’est pas fait pour ça.

Le mieux est de s’orienter du côté du SVG, c’est un format ouvert. Compris par les navigateurs web (les vrais navigateurs), et vectoriel. Tout ce que l’on demande.

Le but est de pouvoir insérer des schémas heuristiques directement dans la page, dans un document wiki. En attendant de pouvoir vraiment réaliser ceci. Voici déjà quelques pistes à propos des applications de bureau dans le domaine des schémas heuristiques et aussi de la prise de note.

Le meilleur choix que j’ai trouvé est un projet open source et multi-plateforme c’est freemind. Comme il est possible de le voir directement en exemple dans sa documentation, il existe même une applet java qui permet d’afficher les schémas dans une page web.

Le logiciel est également capable d’exporter ses créations dans divers formats, dont l’html, le pdf et surtout le svg. La création du svg est fait avec la bibliothèque Batik de dessin de graph 2d.

aussi http://www.deepamehta.de/docs/download.html permet de faire des graphes.

Il est donc intéressant d’étudier ce fonctionnement pour générer aussi à ma façon un contenu svg pour en mode wiki. Pour ça il faudrait une syntaxe wiki de création de diagramme?

Dans le même genre de réflexion il existe également des logiciels de prise de note. Par exemple, Voodoopad permet de prendre des note et d’ajouter directement un petit dessin fait directement dans une pop up à la main. C’est une bonne idée !

plein d’infos sur des outils pour prendre des notes et gérer de l’info… sur ce blog http://www.opossum.ca/guitef/archives/001347.html

Graphe

J’ai découvert ce magnifique programme qu’est graphviz. C’est un programme qui permet d’afficher les graphes fait dans le format de graphe dot fait par at&t. Graphviz peut également exporter ces document dans de multiple format bitmap ou non. Dans les plus utiles pour moi, png, pdf et svg !

Omnigraffle est capable de lire les documents dot !

C’est une syntaxe assez facile a écrire.. et il semble qu’il existe de multiples programmes qui permettent de convertir ce format dans un autre. Et dans le tas notamment des programme qui peuvent exporter du contenu web! Là on approche du but !

Pour l’instant voici un exemple avec DokuWiki

Il existe aussi une bibliothèque qui est sensée convertir le graphe au format .dot en png ou svg ou pdf pour l’afficher dans une page web. http://www.graphviz.org/webdot/

Omnigraffle -> dot

L’édition graphique d’un schéma c’est quand même plus simple et plus intuitif, cependant, je n’ai trouvé aucun outils de dessin qui soit capable de faire de l’exportation en .dot . Les outils qui font ce genre d’exportation sont souvent des outils qui traitent des donnés et qui les présentent en graphe, mais rarement des outils de dessin de graphe !!

Donc je cherche a utiliser l’excellent omni graffle pour faire des schéma simple au format dot.

Omnigraffle est un logiciel de dessin vectoriel, donc il stock beaucoup d’information sur l’apparence du dessin. Moi j’aimerai juste obtenir des informations de liaison entre objet et les chaîne de caractère qui sont associées.

En décortiquant le format de fichier .graffle on trouve quelques infos. Tout d’abord. Nous avons la chance que le format de fichier est un document xml ! au format .plist d’apple ! Ce qui facilite grandement la compréhension !

Observons le schéma d’un cercle qui est relié par une flèche à un rectangle. Tout d’abord, nous avons:

<key>GraphicsList</key>

qui a pour contenu un tableau des objets qui sont dans le dessin.

Chaque objet est dans une balise <dict> qui elle même contient les infos de l’objet et son id:

<key>ID</key>
<integer>2</integer>

Puis, une flèche, qui est un objet de liaison comporte une tête et une queue.

<key>Head</key>
<dict>
  <key>ID</key>
  <integer>1</integer>
</dict>
<key>Tail</key>
<dict>
  <key>ID</key>
  <integer>2</integer>
</dict>

Cette flèche comporte en elle les informations qui permettent de savoir à quels objets elle est reliée. Ainsi que le sens. Donc, nous avons théoriquement toutes les informations nécessaires pour créer un fichier .dot.

Il faut encore récupérer les chaînes de caractère qui sont en l’occurrence en rtf.

<key>Text</key>
<dict>
   <key>Text</key>
   <string>
      {rtf1macansicpg10000cocoartf824cocoasubrtf410
      {fonttblf0fswissfcharset77 Helvetica;}
      {colortbl;red255green255blue255;}
      pardtx560tx1120tx1680tx2240tx2800tx3360tx3920tx4480tx5040tx5600tx6160tx6720qcpardirnaturalf0fs24 cf0 salade bleue}
   </string>
</dict>

Il faudra voir le comportement du rtf, pour l’instant, ce n’est pas très concluant.. un fichier entièrement fait en texte n’est pas bien interprété par omnigraffle… et dans l’autre sens.. le codage rtf n’est pas terrible comme chaîne de caractère pour le format dot… donc là il va probablement falloir faire une petite conversion de format pour le texte.

Dans sa globalité ce projet n’as pas l’air complètement irréaliste. Donc à suivre…

13 Dec 2006 : 15:21

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Scroll to top
%d blogueurs aiment cette page :