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/