grades layout tree

Attempting to use d3 library to present my uni grades

by chrisloughnane

HTML

<script src="http://grades.chrisloughnane.net/d3/d3.js"></script>
<script src="http://grades.chrisloughnane.net/d3/d3.layout.js"></script>
<link rel="stylesheet" href="http://grades.chrisloughnane.net/stylesheets/style.css">
<div id="body">
    <div id="footer">
        <div class="hint"></div>
    </div>
</div>

<div class='clicktoexpandALL'></div>
<div class='clicktoexpand'></div>
<div id="button-back"></div>

JavaScript

var m = [20, 120, 20, 120],
    w = 1280 - m[1] - m[3],
    h = 800 - m[0] - m[2],
    i = 0;

var root = {
    "name": "NUIG",
    "children": [
        {
            "name": "year one",
            "children": [
                {
                    "name": "GU001 group I",
                    "children": [
                        {
                            "name": "CT101 Computing Systems",
                            "size": 93
                        },
                        {
                            "name": "CT102 Algorithms & Information Systems",
                            "size": 74
                        },
                        {
                            "name": "EE130 Fundamentals of Electrical & Electronic Engineering I",
                            "size": 96
                        },
                        {
                            "name": "TOTAL 87.17",
                            "size": 87.17
                        }
                    ]
                },
                {
                    "name": "GU002 group II",
                    "children": [
                        {
                            "name": "CT103 Programming",
                            "size": 93
                        },
                        {
                            "name": "TOTAL 93",
                            "size": 93
                        }
                    ]
                },
                {
                    "name": "GU002 group III",
                    "children": [
                        {
                            "name": "MA190 Mathematics (Honours)",
                            "size": 68
                        },
                        {
                            "name": "PH108 Physics",
                            "size": 75
                        },
                        {
                            "name": "TOTAL 70.33",
                            "size": 70.33
                        }
         ...