Support for links in HTML-like labels

[GoogleCodeExporter]

Dear Ryan,
as you can see at http://hfopi.org/topicgraph , i am currrently trying to 
put your brilliant piece of code to good use. Up to now everything has 
worked out well - until i know discovered support of 'HTML-like labels' 
(http://www.graphviz.org/doc/info/shapes.html#html) is completely missing. 
While i think the whole wattle graphviz is should be replaced by something 
more modern anyways, but it is beyond my ability to code so we got to use 
what is available.
So i would be willing to implement it myself, but if it'd be great if you 
could coach me through the process...
regards ;)

Original issue reported on code.google.com by empee584 on 29 Jan 2010 at 6:06

[GoogleCodeExporter]

gosh it's not a defect of course, but here's no way to change that. DoH ;)

Original comment by empee584 on 29 Jan 2010 at 6:06

[GoogleCodeExporter]

I do consider it a defect, since I want Canviz to support everything Graphviz 
does. Unfortunately, I cannot 
support links in HTML-like labels unless the developers of Graphviz make 
changes to the xdot output. See issue 
#11 and the mailing list post I linked from there for all the details.

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 1:00

[GoogleCodeExporter]

On second thought, implementing the method in issue #56 would fix links in 
HTML-like labels without needing 
changes in xdot.

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 1:06

[GoogleCodeExporter]

Well link region is one thing, at least for my use case allowing images (f.e. 
status
icons) to be embedded is more important.
Because this conglomerate (graphviz + prototype + canviz) is such an ugly mess 
(no
offense intended), i was already considering using a commercial graph pkg (i 
wasn't
satisfied with any of the offers though either) or even recoding something 
flexible
and modern from scratch, but of course lack of time and skill as well as the 
simple
yet important fact that canviz as good as works made me drop the other choices 
for
the time being ;)

Original comment by empee584 on 28 Feb 2010 at 3:12

[GoogleCodeExporter]

If you mean allowing images to be displayed within labels, Canviz has already 
supported that for a long time. If 
you mean allowing such images to have links independent of the rest of the 
node, then from Canviz's 
perspective, it doesn't matter the reason why a separate part of the node has a 
different link, whether it came 
from an image or text; since Graphviz doesn't tell us what those regions' 
boundaries are in the xdot format, I 
cannot make them clickable in Canviz, unless I have Graphviz also generate and 
send Canviz an imagemap; that's what issue #56 is about.

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 9:56

[GoogleCodeExporter]

If you have a complaint about the architecture of Canviz (e.g. that it uses 
Prototype), let's discuss that on the 
discussion group. I'm not opposed, for example, to removing Prototype as a 
requirement; it was merely the JS 
library I was familiar with when I started developing Canviz and with it I was 
able to develop Canviz much 
quicker than if I had not used a library.

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 9:59

[GoogleCodeExporter]

@5: yes i mean that, and if i have overlooked something, please provide me a 
clue..
@6: no that was not a complaint! however, graphviz is somewhat of age, which is
showing. Creating a new graph visualization software without all that antique C 
cruft
focusing on things like animated realtime state changes or simply more beautiful
graphical output (see http://nodebox.net/code/index.php/Gallery) might be a good
idea- alas, unfortunately i am not capable of doing that and noone else seems 
do be
doing it.
About prototype, i initially wanted to convert canviz from prototype to jquery 
but
when i saw prototype is actually more performant on some areas so for unknown 
benefit
it wasn't worth the effort..

Original comment by empee584 on 28 Feb 2010 at 10:12

[GoogleCodeExporter]

Canviz supports most if not all parts of Graphviz that involve *displaying* 
graphs, including HTML-like labels 
and embedded images; attached is an example showing both. (Though per issue #56 
and issue #11, it does not 
yet support all aspects of *clicking on* all possible types of links in 
graphs). Place graph.gv and the PNG files in 
the same directory and create an xdot rendering of it using "dot -Txdot 
graph.gv > graph.gv.txt" (or use 
graph.gv.txt already attached here). Make a "graphs" directory in the main 
Canviz directory (where index.html is). 
Make an "images" directory inside that and place the PNG files in there. Also 
make a "dot" directory inside the 
"graphs" directory and place graph.gv.txt in there. Place the JavaScript files 
directly in the "graphs" directory. You 
should now have a working example and can visit index.html in a browser.

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 11:54

• Changed title: Support for links in HTML-like labels

Attachments:

• graph.gv
• red.png
• blue.png
• graph.gv.txt
• graphlist.js
• layoutlist.js

[GoogleCodeExporter]

Fixed JavaScript files that IE doesn't complain about (removed comma after last 
array element)

Original comment by ryandesi...@gmail.com on 28 Feb 2010 at 12:01

Attachments:

• graphlist.js
• layoutlist.js

[GoogleCodeExporter]

mhh well yes, your example works in firefox, slightly works in webkit and 
doesn't
work in khtml. And my diagnose that canviz does not support html like labels was
based on the experience that adding a
$nodestyle['label'] = '<<table><tr><td>foo</td></tr></table>>';
makes http://hfopi.org/topicgraph stop rendering anything, with a JS deadlock in
canviz.js on line 526. Maybe it's in the combination of 21 JS files on that 
site, but
without that line, as you may have seen, everything works as supposed to.

Original comment by empee584 on 28 Feb 2010 at 12:36

[GoogleCodeExporter]

The example should work completely in WebKit; Safari is my default browser and 
the one I test in most often. 
What problems did you see in WebKit? in what browser?

I have never tested Canviz in a KHTML-based browser. Feedback and especially 
fixes are welcome.

I cannot comment on what happens when you set $nodestyle['label'] because I 
don't know what that variable is, 
and I have not observed a deadlock in canviz.js before. The Canviz workflow is 
that you create a Graphviz graph 
description text file on the server, run it through a Graphviz layout program 
on the server to create xdot output, 
and feed the xdot output to the web browser for Canviz to render. If you can 
supply a Graphviz graph 
description text file that, when rendered into xdot and fed to Canviz, produces 
such a deadlock, I'll be happy to 
look into it.

Original comment by ryandesi...@gmail.com on 1 Mar 2010 at 11:11

[GoogleCodeExporter]

ok further investigated these issues.
- The stalling in firefox appears when it's initialized with a non-existant xdot
file, in that case canviz.js hangs on line 526. Doesn't appear in webkit/khtml.
i am slowly making progress getting the html-like label to work, seems there are
quirks in graphviz aswell as in the php pear module.. but you're right, seems 
to work
with canviz. Will report back when i got this sorted ^^

Original comment by empee584 on 16 Mar 2010 at 2:17

[GoogleCodeExporter]

ok now that i have sorted the mess regarding the image paths, it does work 
indeed:
http://hfopi.org/topicgraph
However, compared to the png rendering, the icons are distorted a bit and the 
width
of serif fonts is not calculated correctly..
No more problem with khtml and webkit though!

Original comment by empee584 on 16 Mar 2010 at 4:03

Attachments:

• 6366606d1c971109ad6af07cd5d9faab.png

[GoogleCodeExporter]

...at least chrome's webkit works.. current qt webkit doesn't render the images
properly ^^

Original comment by empee584 on 16 Mar 2010 at 4:06

[GoogleCodeExporter]

!!...IE8 overdraws the complete graph area if a graph label is set - omg ^^

Original comment by empee584 on 17 Mar 2010 at 7:56

[GoogleCodeExporter]

Feel free to file additional tickets for the additional issues you've uncovered 
(IE8 problems, distorted images, 
stalling when trying to access a nonexistent graph, etc.). Please keep it to 
one issue per ticket; this ticket here is 
getting extremely unwieldy and is reading more like a discussion, which would 
be more appropriate to have on 
the discussion group.

Original comment by ryandesi...@gmail.com on 18 Mar 2010 at 12:53