I have the following DOT code in Viz.js:
digraph G {
node [fontname = "font-awesome"];
17 [id=17, shape="hexagon", label=<<TABLE BORDER="0">
<TR><TD>undefined</TD></TR>
<TR><TD>[47-56]</TD></TR>
<TR><TD id = "abc"><FONT COLOR="#000000"></FONT></TD></TR>
</TABLE>>, style="filled"];
}
I assigned an ID to the last TD
(id="abc"
), but Viz.js does not insert this id
in the created raw output:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.40.1 (20161225.0304)
-->
<!-- Title: G Pages: 1 -->
<svg width="137pt" height="132pt"
viewBox="0.00 0.00 137.01 132.11" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 128.1075)">
<title>G</title>
<polygon fill="#ffffff" stroke="transparent" points="-4,4 -4,-128.1075 133.0065,-128.1075 133.0065,4 -4,4"/>
<!-- 17 -->
<g id="17" class="node">
<title>17</title>
<polygon fill="#d3d3d3" stroke="#000000" points="129.0097,-62.0537 96.7565,-124.1613 32.25,-124.1613 -.0032,-62.0537 32.25,.0538 96.7565,.0538 129.0097,-62.0537"/>
<text text-anchor="start" x="37.013" y="-79.4537" font-family="font-awesome" font-size="14.00" fill="#000000">undefined</text>
<text text-anchor="start" x="44.0123" y="-57.4537" font-family="font-awesome" font-size="14.00" fill="#000000">[47-56]</text>
<text text-anchor="start" x="59.1729" y="-35.4537" font-family="font-awesome" font-size="14.00" fill="#000000"></text>
</g>
</g>
</svg>
Assigning IDs to nodes does work in Viz.js, but in my node there are texts and icons which I have located in TDs. And I want to assign a delegate in my JQuery code to this TD
so when the user clicks on the TD
, a specific function in my javascript code is called. But right now I am not able to assign an ID or class to the TD
to be able to call it later. I need in my HTML code something like this:
<text id="Test1" class="ClickIcon" text-anchor="start" x="59.1729" y="-35.4537" font-family="font-awesome" font-size="14.00" fill="#000000"></text>
So that I can assign a delegate the it in my javascript code like this:
graphContainer.delegate('text.ClickIcon', 'click', function(
event) {
mainWindow.webContents.send('alert', 'Event done');
});
How could I do that?