Radial Tree Semantic Zoom

user enabled/disabled Zoom/Pan - to be used for ICD-10 Visual Search

HTML

<script src="http://www.fernoftheandes.com/js/d3.grid.js"></script>
<link rel="stylesheet" href="http://www.fernoftheandes.com/css/d3.grid.css">
<form>
    <input type="checkbox" name="mycheck" id="mycheck" value="mycheck">Zoom Enabled<br/>
    <!--
    <input type="radio" name="gRadio" id="one" value="one" /> Zoom/Pan Enabled<br/>
    <input type="radio" name="gRadio" id="two" value="two" checked/>Zoom/Pan Disabled
    -->
</form>
<div id="root"></div>

CSS

.node circle {
  fill: #fff;
  stroke: steelblue;
  stroke-width: 1.5px;
}

.node {
  font: 10px sans-serif;
}

.link {
  fill: none;
  stroke: #ccc;
  stroke-width: 1.5px;
}

.gr-bg {
    fill: linen;
}

JavaScript

var items = {
 "name": "0",
 "children": [

      {"name": "1", "size": 1, children: [
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1}
        ]
      },
      {"name": "2", "size": 1, children: [
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1}
        ]
      },
      {"name": "3", "size": 1, children: [
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size: 1},
        {"name": "a", size:...