The following code displays a hierarchy of rectangles that can expand/collapse.
You can click on a rectangle with children to hide/show the children,
expanding and contracting the tree as required. The groups provide the
hierarchies. I've only run it in ASVG3.
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg"; width='100%' height='100%'
onload="init(evt)">
<g id="tasks" onmousedown="mouseClick(evt)">
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
</g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<rect x="5" y="5" width="200" height="20" style="fill:yellow"/>
<g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
</g>
</g>
</g>
<rect x="5" y="5" width="200" height="20" style="fill:blue"/>
<rect x="5" y="5" width="200" height="20" style="fill:red"/>
</g>
<script>
<![CDATA[
var offsetY = 0;
function init(evt)
{
refresh(svgDocument.getElementById("tasks") ,0);
}
function mouseClick(evt)
{
var obj=evt.target.getNextSibling();
if ((obj != null) && (obj.nodeName=="#text")) {
obj=obj.getNextSibling();
if ((obj != null) && (obj.nodeName=="g")) {
var attr = obj.getAttribute("visibility");
if (attr == "hidden"){
obj.setAttribute("visibility", "");
}
else{
obj.setAttribute("visibility", "hidden");
}
offsetY = 0;
refresh(svgDocument.getElementById("tasks") ,0)
}
}
}
function refresh(objGroup, level)
{
var layer=objGroup.childNodes;
var num=layer.length;
for (var ix=0; ix < num; ix++)
{
var obj=layer.item(ix);
if (obj.nodeName == "rect") {
offsetX = level * 40;
var transform = "translate(" + offsetX + " " + offsetY + ")";
obj.setAttribute("transform", transform);
offsetY = offsetY + 30;
}
else if (obj.nodeName == "g") {
if (obj.getAttribute("visibility") != "hidden"){
refresh(obj, level+1);
}
}
}
}
// ]]>
</script>
</svg>
---------------------------------
Do you Yahoo!?
Read only the mail you want - Yahoo! Mail SpamGuard.
[Non-text portions of this message have been removed]
------------------------ Yahoo! Groups Sponsor --------------------~-->
$4.98 domain names from Yahoo!. Register anything.
http://us.click.yahoo.com/Q7_YsB/neXJAA/yQLSAA/1U_rlB/TM
--------------------------------------------------------------------~->
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----
Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
