Question : Organization Chart Renderer HTML/Jquery/Canvas/HTML5

I am looking for a renderer that can render dynamic data, either an xml file or json file into an organization structure on screen. Tables would be fine but im sure with SVG support or some of the new Canvas capabilities it would not be neccesary. Normally this would be a good flash piece, which i have done before but im looking to do it in DHTML now.

would be great if could be created client side, in other words javascript/jquery would do the parsing and rendering but other things i would consider would be PHP or JAVA.

Maybe you dont know of any thing out there but have done something similar before or are willing to take a stab at it, i will post in code examples of the xml or json, maybe you have a solution to how to go about dynamically parsing the xml or json into a visual organization tree using tables or canvas elements

         
           
             1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:

           
           
          <node id="123456">
	<node id="222222">
		<node id="444444">
			<node id="1"></node>
			<node id="2"></node>	
		</node>
		<node id="555555">
			<node id="3"></node>
			<node id="4"></node>	
		</node>
	</node>

	<node id="333333">
		<node id="666666">
			<node id="5"></node>
			<node id="6"></node>	
		</node>
		<node id="777777">
			<node id="7"></node>
			<node id="8"></node>	
		</node>
	</node>
</node>


{
    "node": [
        {
            "id": 123456,
            "node": {
                "id": 222222,
                "node": {
                    "id": 444444,
                    "node": {
                        "id": 1 
                    } 
                } 
            } 
        },
        {
            "id": 2 
        },
        {
            "id": 555555,
            "node": {
                "id": 3 
            } 
        },
        {
            "id": 4 
        },
        {
            "id": 333333,
            "node": {
                "id": 666666,
                "node": {
                    "id": 5 
                } 
            } 
        },
        {
            "id": 6 
        },
        {
            "id": 777777,
            "node": {
                "id": 7 
            } 
        },
        {
            "id": 8 
        } 
    ]
}

           
         

Question : Organization Chart Renderer HTML/Jquery/Canvas/HTML5

Answer : Organization Chart Renderer HTML/Jquery/Canvas/HTML5

Check this page : http://code.google.com/intl/fr-FR/apis/visualization/documentation/gallery/orgchart.html#Example