Afficher un arbre

Pascal

08/07/2008 à 11:42

Pascal wrote:

Bonjour,

J'ai bien envie de refaire un petit lifting à cette page de mon site :
http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Pour le moment l'arbre est tracé avec un tableau ce qui est assez
horrible :)

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

Ca motive pas grand monde...
Le svg me tente bien, le probleme, c'est OE, comme d'habitude.

Pascal

Olivier Miakinen

08/07/2008 à 11:55

Le 08/07/2008 11:42, Pascal a écrit :

http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Ca motive pas grand monde...

Je dois dire que je ne vois pas trop comment faire mieux qu'un tableau,
surtout si le nombre de cases est variable.

Juste un petit conseil : éviter lors d'un survol de changer la taille,
la forme ou la graisse de la police, sans parler du contenu... bref,
ne rien changer qui change la disposition de la page, fût-ce d'un seul
pixel, car ça donne vite le mal de mer. Tu peux jouer sur les couleurs
par exemple, ou alors t'assurer que la case est toujours assez grande
pour supporter un changement de graisse du texte (mais c'est difficile
à faire avec un design élastique).

Le svg me tente bien, le probleme, c'est OE, comme d'habitude.

C'est vrai qu'Outlook Express tarde à supporter le SVG. ;-)

Olivier Miakinen

08/07/2008 à 12:02

Le 08/07/2008 11:55, Olivier Miakinen a écrit :

http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Juste un petit conseil : éviter lors d'un survol de changer la taille,
la forme ou la graisse de la police, sans parler du contenu... [...]

Pour voir à quel point c'est désagréable, choisis une case où le nom et
le prénom sont sur la même ligne mais prennent toute la largeur de la
case, par exemple PAROIS Jeanne dans la 2e colonne, ou pire PAROIS
Vincent dans la première. Approche alors la souris de la dernière lettre
du prénom (le t de Vincent) et admire...

unbewusst.sein

08/07/2008 à 12:09

Pascal wrote:

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

avec graphviz (format .dot) le fichier *.dot est facile à générer en php
par ex :
digraph G {
Hello -> World
}

ensuite, avec system, donc tjs php, faire un "export"(*) du .dot en
svg...

1 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
3 <!ATTLIST svg xmlns:xlink CDATA #FIXED
"http://www.w3.org/1999/xlink">
4 ]>
5 
7 
8 <svg width="600" height="400"
9 viewBox="0 0 600 400"
10 xmlns="http://www.w3.org/2000/svg"
11 xmlns:xlink="http://www.w3.org/1999/xlink">
12 <g id="graph0"
13 class="graph"
14 style="font-family: Times-Roman;"
15 transform="translate(264, 141) scale(2)">
16 <title>G</title>
17 
18 <g id="node1"
19 class="node">
20 <title>Hello</title>
21 <ellipse style="fill: none; stroke: black;"
22 cx="36" cy="23" rx="29" ry="18"/>
23 <text text-anchor="middle" x="36" y="28">Hello</text>
24 </g>
25 
26 <g id="node3"
27 class="node">
28 <title>World</title>
29 <ellipse style="fill: none; stroke: black;"
30 cx="36" cy="95" rx="31" ry="18"/>
31 <text text-anchor="middle" x="36" y="100">World</text>
32 </g>
33 
34 <g id="edge2"
35 class="edge">
36 <title>Hello->World</title>
37 <path style="fill: none; stroke: black;"
38 d="M36,41 C36,49 36,58 36,67"/>
39 <polygon style="fill: black; stroke: black;"
40 points="40,67 36,77 33,67 40,67"/>
41 </g>
42 </g>
43 </svg>

* je ne me souviens plus du nom exact de la commande.

cf <http://thoraval.yvon.free.fr/Dot/external_links.xhtml> pour qq liens
et voir, dans le menu (à droite), sous "Dot" qq exemples et les sources.

notes que je n'ai pas utilisé php, c'est réalisé "à la main" (ligne de
commande), mais c'est fastoche à faire en php, à condition d'avoir
graphviz sur le serveur, ce qui est le k chez moi.
--
Une Bévue

Pascal <pascal22p@parois.net> wrote:

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

avec graphviz (format .dot) le fichier *.dot est facile à générer en php
par ex :
digraph G {
Hello -> World
}

ensuite, avec system, donc tjs php, faire un "export"(*) du .dot en
svg...

1 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
3 <!ATTLIST svg xmlns:xlink CDATA #FIXED
"http://www.w3.org/1999/xlink">
4 ]>
5 
7 
8 <svg width="600" height="400"
9 viewBox="0 0 600 400"
10 xmlns="http://www.w3.org/2000/svg"
11 xmlns:xlink="http://www.w3.org/1999/xlink">
12 <g id="graph0"
13 class="graph"
14 style="font-family: Times-Roman;"
15 transform="translate(264, 141) scale(2)">
16 <title>G</title>
17 
18 <g id="node1"
19 class="node">
20 <title>Hello</title>
21 <ellipse style="fill: none; stroke: black;"
22 cx="36" cy="23" rx="29" ry="18"/>
23 <text text-anchor="middle" x="36" y="28">Hello</text>
24 </g>
25 
26 <g id="node3"
27 class="node">
28 <title>World</title>
29 <ellipse style="fill: none; stroke: black;"
30 cx="36" cy="95" rx="31" ry="18"/>
31 <text text-anchor="middle" x="36" y="100">World</text>
32 </g>
33 
34 <g id="edge2"
35 class="edge">
36 <title>Hello->World</title>
37 <path style="fill: none; stroke: black;"
38 d="M36,41 C36,49 36,58 36,67"/>
39 <polygon style="fill: black; stroke: black;"
40 points="40,67 36,77 33,67 40,67"/>
41 </g>
42 </g>
43 </svg>

* je ne me souviens plus du nom exact de la commande.

cf <http://thoraval.yvon.free.fr/Dot/external_links.xhtml> pour qq liens
et voir, dans le menu (à droite), sous "Dot" qq exemples et les sources.

notes que je n'ai pas utilisé php, c'est réalisé "à la main" (ligne de
commande), mais c'est fastoche à faire en php, à condition d'avoir
graphviz sur le serveur, ce qui est le k chez moi.
--
Une Bévue

Vous avez filtré cet utilisateur ! Consultez son message

Pascal wrote:

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

avec graphviz (format .dot) le fichier *.dot est facile à générer en php
par ex :
digraph G {
Hello -> World
}

ensuite, avec system, donc tjs php, faire un "export"(*) du .dot en
svg...

1 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
3 <!ATTLIST svg xmlns:xlink CDATA #FIXED
"http://www.w3.org/1999/xlink">
4 ]>
5 
7 
8 <svg width="600" height="400"
9 viewBox="0 0 600 400"
10 xmlns="http://www.w3.org/2000/svg"
11 xmlns:xlink="http://www.w3.org/1999/xlink">
12 <g id="graph0"
13 class="graph"
14 style="font-family: Times-Roman;"
15 transform="translate(264, 141) scale(2)">
16 <title>G</title>
17 
18 <g id="node1"
19 class="node">
20 <title>Hello</title>
21 <ellipse style="fill: none; stroke: black;"
22 cx="36" cy="23" rx="29" ry="18"/>
23 <text text-anchor="middle" x="36" y="28">Hello</text>
24 </g>
25 
26 <g id="node3"
27 class="node">
28 <title>World</title>
29 <ellipse style="fill: none; stroke: black;"
30 cx="36" cy="95" rx="31" ry="18"/>
31 <text text-anchor="middle" x="36" y="100">World</text>
32 </g>
33 
34 <g id="edge2"
35 class="edge">
36 <title>Hello->World</title>
37 <path style="fill: none; stroke: black;"
38 d="M36,41 C36,49 36,58 36,67"/>
39 <polygon style="fill: black; stroke: black;"
40 points="40,67 36,77 33,67 40,67"/>
41 </g>
42 </g>
43 </svg>

* je ne me souviens plus du nom exact de la commande.

cf <http://thoraval.yvon.free.fr/Dot/external_links.xhtml> pour qq liens
et voir, dans le menu (à droite), sous "Dot" qq exemples et les sources.

notes que je n'ai pas utilisé php, c'est réalisé "à la main" (ligne de
commande), mais c'est fastoche à faire en php, à condition d'avoir
graphviz sur le serveur, ce qui est le k chez moi.
--
Une Bévue

Patrick Texier

08/07/2008 à 12:10

Le Tue, 08 Jul 2008 10:42:32 +0100, Pascal a écrit :

> J'ai bien envie de refaire un petit lifting à cette page de mon site :
> http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357
>
> Pour le moment l'arbre est tracé avec un tableau ce qui est assez
> horrible :)

Ca motive pas grand monde...
Le svg me tente bien, le probleme, c'est OE, comme d'habitude.

Il semble y avoir quelques problèmes dans la base :

Notice: Undefined index: mon_indi in
/home/pascalp/parois.net/genealogie/arbre_ascendant.php on line 106

Notice: Trying to get property of non-object in
/home/pascalp/parois.net/genealogie/arbre_ascendant.php on line 106

Personnellement je trouve cette présentation fractale un peu difficile à
suivre effectivement. Un arbre généalogique ascendant cela doit se
suivre toujours dans le même sens de lecture.
--
Patrick Texier

vim:syntax=mail:ai:ts=4:et:twr

unbewusst.sein

08/07/2008 à 12:14

Une Bévue wrote:

voir, dans le menu (à droite), sous "Dot" qq exemples et les sources.

par exemple : <http://thoraval.yvon.free.fr/Dot/log4j12_4.xhtml>
qui est la représentation svg du build.xml de la classe Java "log4j12_4"
;-)

+ proche de ce que tu me sembles souhaiter...
--
Une Bévue

SAM

08/07/2008 à 12:54

Pascal a écrit :

Pascal wrote:
Bonjour,

J'ai bien envie de refaire un petit lifting à cette page de mon site :
http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Pour le moment l'arbre est tracé avec un tableau ce qui est assez
horrible :)

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

Ca motive pas grand monde...

ben ... il faut déjà :
- être intéressé par la question (complexe) de la généalogie
- y comprendre en généalogie
- à tt le moins avoir des exemples de représentations
- là c'est sûr que c'est pas top ...
je vois pas trop qui est responsable de quel rejeton

faute d'au moins le point 3 ... on n'a pas d'idée
(arbre descendant? ascendant?)

pour la fiche :

<dl>
<dt>patronyme<span>date</span><dt>
<dd>info 1</dd>
<dd>info 2</dd>
<dd>info 3</dd>
</dl>

ou :

<dl>
<dt>patronyme<span>date</span><dt>
<dd>
<ul>
<li>info 1</li>
<li>info 2</li>
<li>info 3</li>
</ul>
</dd>
</dl>

pour l'organisisation (ascendant?) :

<ul>
<li class="moi">
<ul>
<li class="pere">
<dl ... la fiche ...>
<ul>
<li class="grd-pere">
<dl>fiche
<ul>
<li>pere
<dl>fiche
<ul>
<li>pere
...
<li>mere
...
</ul>
<li>mere
<dl>fiche
<ul>
<li>pere
...
<li>mere
...
</ul>
</li>
</ul>
<li class="grd-mere">
<dl>fiche
<ul>
<li>pere
<ul>
<li>pere
...
</ul>
</li>
<li class="mere">
<dl ... la fiche ...>
<ul>
<li class="grd-pere-mat">
<dl>fiche
<ul>
<li>pere
<dl>fiche
<ul>
<li>pere
...
<li>mere
<dl>fiche
<ul>
<li>pere
...

<li class="grd-mere-mat">
<li class="grd-mere">
<dl>fiche
<ul>
<li>pere
<dl>fiche
<ul>
<li>pere
...

</ul>
</li>
</ul>

Le svg me tente bien, le probleme, c'est OE, comme d'habitude.

<http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm>
- faire les rectangles
- faire les lignes de branchements
- trouver un truc pour que ces lignes restent attachées aux bonne boites

--
sm

Pascal

08/07/2008 à 13:39

Patrick Texier wrote:

Le Tue, 08 Jul 2008 10:42:32 +0100, Pascal a écrit :

J'ai bien envie de refaire un petit lifting à cette page de mon site :
http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Pour le moment l'arbre est tracé avec un tableau ce qui est assez
horrible :)

Ca motive pas grand monde...
Le svg me tente bien, le probleme, c'est OE, comme d'habitude.

Il semble y avoir quelques problèmes dans la base :

C'est bien pour ca que je fait un lifting :)
Et c'est pas le seul probleme.

Personnellement je trouve cette présentation fractale un peu difficile à
suivre effectivement. Un arbre généalogique ascendant cela doit se
suivre toujours dans le même sens de lecture.

Elle a sont avantage la compacite.

Un truc plus dans ce genre la :
<http://genealogie.parois.net/famille_proche.php?g4p_id48> ?

Cette page aussi a besoin d'un lifting... Ce coup-ci pas de notice, mais
il y en a :)

Pascal

Pascal

08/07/2008 à 13:54

SAM wrote:

Pascal a écrit :
Pascal wrote:
Bonjour,

J'ai bien envie de refaire un petit lifting à cette page de mon site :
http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Pour le moment l'arbre est tracé avec un tableau ce qui est assez
horrible :)

Je serais curieux de savoir de quelle manière vous présenteriez ce
genre de truc.

Ca motive pas grand monde...

ben ... il faut déjà :
- être intéressé par la question (complexe) de la généalogie
- y comprendre en généalogie
- à tt le moins avoir des exemples de représentations
- là c'est sûr que c'est pas top ...
je vois pas trop qui est responsable de quel rejeton

C'est base sur une structure fractale, c'est vrai que pas ce qu'il y a
de plus lisible mais c'est tres compacte :)

C'est une ascendance.

Et c'etait surtout sur la facon dont peut dessiner ce graph. Mais c'est
pas perdu, je sais que cette represntation n'est pas claire du tout
maintenant :)

faute d'au moins le point 3 ... on n'a pas d'idée
(arbre descendant? ascendant?)

pour la fiche :

<dl>
<dt>patronyme<span>date</span><dt>
<dd>info 1</dd>
<dd>info 2</dd>
<dd>info 3</dd>
</dl>

Deja fait, C'etait la partie facile :)
Mais pas encore en ligne.

pour l'organisisation (ascendant?) :

[snip]

Je suis pas fan.

Le svg me tente bien, le probleme, c'est IE, comme d'habitude.

<http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm>
- faire les rectangles
- faire les lignes de branchements
- trouver un truc pour que ces lignes restent attachées aux bonne boites

Ca peut etre une solution. Plus propore que mon tableau, je sais pas,
mais c'est une solution :)

Pascal

Pascal

08/07/2008 à 14:03

Olivier Miakinen wrote:

Le 08/07/2008 11:42, Pascal a écrit :
http://genealogie.parois.net/arbre_ascendant-2-PAROIS-Auguste_Jean_Baptiste-357

Ca motive pas grand monde...

Je dois dire que je ne vois pas trop comment faire mieux qu'un tableau,
surtout si le nombre de cases est variable.

Moi non plus. Le nombre de case est fixe, trop complique sinon.

Juste un petit conseil : éviter lors d'un survol de changer la taille,
la forme ou la graisse de la police, sans parler du contenu... bref,
ne rien changer qui change la disposition de la page, fût-ce d'un seul
pixel, car ça donne vite le mal de mer. Tu peux jouer sur les couleurs
par exemple, ou alors t'assurer que la case est toujours assez grande
pour supporter un changement de graisse du texte (mais c'est difficile
à faire avec un design élastique).

C'est la premiere chose que j'ai vire sur le nouveau design (design est
bien grand mot...). Je pourrais editer la css actuelle pour supprimer
cette horreur, c'est pas long.

Le svg me tente bien, le probleme, c'est IE, comme d'habitude.

C'est vrai qu'Outlook Express tarde à supporter le SVG. ;-)

Si a la rigueur IE (internet explorer) 8 supporte le svg, je peux faire
l'impasse sur IE 6-7. Mais c'est meme pas sur. Je peux sortir un
vulgaire png pour IE et du svg pour le reste. Faire svg + vml ca me
tente moyen...

Pascal

Afficher un arbre

10 réponses

Veuillez sélectionner un problème