Skip to content

Instantly share code, notes, and snippets.

@saraquigley
Last active December 27, 2016 03:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save saraquigley/6065b932814103eb070a to your computer and use it in GitHub Desktop.
Save saraquigley/6065b932814103eb070a to your computer and use it in GitHub Desktop.
Strategic Management Project Pilots 2013-2014
/*!
* Bootstrap v3.1.1 (http://getbootstrap.com)
* Copyright 2011-2014 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
html {
font-family: 'Lato', sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background: transparent;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 1em 40px;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
font-family: 'Lato',"Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333333;
background-color: #ffffff;
}
input,
button,
select,
textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
a {
color: #428bca;
text-decoration: none;
}
a:hover,
a:focus {
color: #2a6496;
text-decoration: underline;
}
a:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
figure {
margin: 0;
}
img {
vertical-align: middle;
}
.img-responsive {
display: block;
max-width: 100%;
height: auto;
}
.img-rounded {
border-radius: 6px;
}
.img-thumbnail {
padding: 4px;
line-height: 1.42857143;
background-color: #ffffff;
border: 1px solid #dddddd;
border-radius: 4px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
display: inline-block;
max-width: 100%;
height: auto;
}
.img-circle {
border-radius: 50%;
}
hr {
margin-top: 20px;
margin-bottom: 20px;
border: 0;
border-top: 1px solid #eeeeee;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.btn {
display: inline-block;
margin-bottom: 0;
font-weight: normal;
text-align: center;
vertical-align: middle;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
white-space: nowrap;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
.btn:hover,
.btn:focus {
color: #333333;
text-decoration: none;
}
.btn:active,
.btn.active {
outline: 0;
background-image: none;
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
cursor: not-allowed;
pointer-events: none;
opacity: 0.65;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-default {
color: #333333;
background-color: #ffffff;
border-color: #cccccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
color: #ffffff;
background-color: #4682B4;
border-color: #285e8e;
}
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
background-image: none;
}
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
background-color: #ffffff;
border-color: #cccccc;
}
.btn-default .badge {
color: #ffffff;
background-color: #333333;
}
.btn-primary {
color: #ffffff;
background-color: #428bca;
border-color: #357ebd;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
color: #ffffff;
background-color: #3276b1;
border-color: #285e8e;
}
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
background-color: #428bca;
border-color: #357ebd;
}
.btn-primary .badge {
color: #428bca;
background-color: #ffffff;
}
.btn-success {
color: #ffffff;
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
color: #ffffff;
background-color: #47a447;
border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success {
background-image: none;
}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
background-color: #5cb85c;
border-color: #4cae4c;
}
.btn-success .badge {
color: #5cb85c;
background-color: #ffffff;
}
.btn-info {
color: #ffffff;
background-color: #5bc0de;
border-color: #46b8da;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
color: #ffffff;
background-color: #39b3d7;
border-color: #269abc;
}
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
background-image: none;
}
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
background-color: #5bc0de;
border-color: #46b8da;
}
.btn-info .badge {
color: #5bc0de;
background-color: #ffffff;
}
.btn-warning {
color: #ffffff;
background-color: #f0ad4e;
border-color: #eea236;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
color: #ffffff;
background-color: #ed9c28;
border-color: #d58512;
}
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
background-image: none;
}
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
background-color: #f0ad4e;
border-color: #eea236;
}
.btn-warning .badge {
color: #f0ad4e;
background-color: #ffffff;
}
.btn-danger {
color: #ffffff;
background-color: #d9534f;
border-color: #d43f3a;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
color: #ffffff;
background-color: #d2322d;
border-color: #ac2925;
}
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
background-image: none;
}
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
background-color: #d9534f;
border-color: #d43f3a;
}
.btn-danger .badge {
color: #d9534f;
background-color: #ffffff;
}
.btn-link {
color: #428bca;
font-weight: normal;
cursor: pointer;
border-radius: 0;
}
.btn-link,
.btn-link:active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
background-color: transparent;
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
border-color: transparent;
}
.btn-link:hover,
.btn-link:focus {
color: #2a6496;
text-decoration: underline;
background-color: transparent;
}
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
color: #999999;
text-decoration: none;
}
.btn-lg,
.btn-group-lg > .btn {
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 6px;
}
.btn-sm,
.btn-group-sm > .btn {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}
.btn-xs,
.btn-group-xs > .btn {
padding: 1px 5px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}
.btn-block {
display: block;
width: 100%;
padding-left: 0;
padding-right: 0;
}
.btn-block + .btn-block {
margin-top: 5px;
}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
width: 100%;
}
.btn-group,
.btn-group-vertical {
position: relative;
display: inline-block;
vertical-align: middle;
}
.btn-group > .btn,
.btn-group-vertical > .btn {
position: relative;
float: left;
}
.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn.active {
z-index: 2;
}
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus {
outline: none;
}
.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
margin-left: -1px;
}
.btn-toolbar {
margin-left: -5px;
}
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
float: left;
}
.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
margin-left: 5px;
}
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
border-radius: 0;
}
.btn-group > .btn:first-child {
margin-left: 0;
}
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.btn-group > .btn-group {
float: left;
}
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
.btn-group > .btn-group:first-child > .btn:last-child,
.btn-group > .btn-group:first-child > .dropdown-toggle {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.btn-group > .btn-group:last-child > .btn:first-child {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
outline: 0;
}
.btn-group > .btn + .dropdown-toggle {
padding-left: 8px;
padding-right: 8px;
}
.btn-group > .btn-lg + .dropdown-toggle {
padding-left: 12px;
padding-right: 12px;
}
.btn-group.open .dropdown-toggle {
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-group.open .dropdown-toggle.btn-link {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn .caret {
margin-left: 0;
}
.btn-lg .caret {
border-width: 5px 5px 0;
border-bottom-width: 0;
}
.dropup .btn-lg .caret {
border-width: 0 5px 5px;
}
.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
display: block;
float: none;
width: 100%;
max-width: 100%;
}
.btn-group-vertical > .btn-group > .btn {
float: none;
}
.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
margin-top: -1px;
margin-left: 0;
}
.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
border-radius: 0;
}
.btn-group-vertical > .btn:first-child:not(:last-child) {
border-top-right-radius: 4px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn:last-child:not(:first-child) {
border-bottom-left-radius: 4px;
border-top-right-radius: 0;
border-top-left-radius: 0;
}
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
border-top-right-radius: 0;
border-top-left-radius: 0;
}
.btn-group-justified {
display: table;
width: 100%;
table-layout: fixed;
border-collapse: separate;
}
.btn-group-justified > .btn,
.btn-group-justified > .btn-group {
float: none;
display: table-cell;
width: 1%;
}
.btn-group-justified > .btn-group .btn {
width: 100%;
}
[data-toggle="buttons"] > .btn > input[type="radio"],
[data-toggle="buttons"] > .btn > input[type="checkbox"] {
display: none;
}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<link type="text/css" rel="stylesheet" href="style.css"/>
<script src="http://d3js.org/d3.v3.js"></script>
<link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
<!-- Bootstrap -->
<link href="bootstrap.css" rel="stylesheet">
<title>SPM Pilots</title>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<style type="text/css">
.node circle {
cursor: pointer;
fill: #fff;
stroke: steelblue;
stroke-width: 1.5px;
}
.node text {
font-size: 12px;
fill: #525252;
}
text.pilot {
fill: steelblue;
font-weight: 400;
font-size: 16px;
}
.pilot {
color: steelblue;
}
path.link {
fill: none;
stroke: #ccc;
stroke-width: 1.5px;
}
</style>
</head>
<body>
<div id="body">
<div id="footer">
<div class="title">Strategic Management + Metrics Project</div>
<span class="pilot">Pilots FY13-14</span>
<div class="hint">click or option-click to expand or collapse</div>
</div>
<div class="btn-toolbar" role="toolbar" id="pilotButtons">
<div class="btn-group"><button type="button" class="btn btn-default" id="goldman">School of Public Policy</button></div>
<div class="btn-group"><button type="button" class="btn btn-default" id="haas">School of Business</button></div>
<div class="btn-group"><button type="button" class="btn btn-default" id="gradDiv">Graduate Division</button></div>
<div class="btn-group"><button type="button" class="btn btn-default" id="studentAffairs">Student Affairs</button></div>
<div class="btn-group"><button type="button" class="btn btn-default" id="adminFinance">Admin & Finance</button></div>
<!-- <div class="btn-group"><button type="button" class="btn btn-default" id="reset">start</button></div> -->
</div>
</div>
<script type="text/javascript">
var m = [20, 180, 20, 90],
w = 1200 - m[1] - m[3],
h = 700 - m[0] - m[2],
i = 0,
root;
var tree = d3.layout.tree()
.size([h, w]);
var diagonal = d3.svg.diagonal()
.projection(function(d) { return [d.y, d.x]; });
var vis = d3.select("#body").append("svg:svg")
.attr("width", w + m[1] + m[3])
.attr("height", h + m[0] + m[2])
.append("svg:g")
.attr("transform", "translate(" + m[3] + "," + m[0] + ")");
d3.json("orgTreePilots.json", function(json) {
root = json;
root.x0 = h / 2;
root.y0 = 0;
function toggleAll(d) {
if (d.children) {
d.children.forEach(toggleAll);
toggle(d);
}
}
// Initialize the display to show a few nodes.
root.children.forEach(toggleAll);
toggle(root.children[0]);
d3.select("#adminFinance").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[5]);
toggle(root.children[5].children[0]);
toggle(root.children[5].children[0].children[4]);
update(root.children[5]);
});
d3.select("#studentAffairs").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[5]);
toggle(root.children[5].children[1]);
toggle(root.children[5].children[1].children[1]);
toggle(root.children[5].children[1].children[7]);
update(root.children[5]);
});
d3.select("#gradDiv").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[3]);
update(root.children[3]);
});
d3.select("#goldman").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[2]);
update(root.children[2]);
});
d3.select("#haas").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[2]);
update(root.children[2]);
});
d3.select("#reset").on("click", function() {
root.children.forEach(toggleAll);
toggle(root.children[0]);
update(root.children[0]);
});
//toggle(root.children[4].children[2]); //Admin & Finance
//toggle(root.children[4].children[4]); //Student Affairs
// toggle(root.children[9]);
// toggle(root.children[9].children[0]);
update(root);
});
function update(source) {
var duration = d3.event && d3.event.altKey ? 5000 : 1000;
// Compute the new tree layout.
var nodes = tree.nodes(root).reverse();
// Normalize for fixed-depth.
nodes.forEach(function(d) { d.y = d.depth * 220; });
// Update the nodes…
var node = vis.selectAll("g.node")
.data(nodes, function(d) { return d.id || (d.id = ++i); });
// Enter any new nodes at the parent's previous position.
var nodeEnter = node.enter().append("svg:g")
.attr("class", "node")
.attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
.on("click", function(d) { toggle(d); update(d); });
nodeEnter.append("svg:circle")
.attr("r", 1e-6)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeEnter.append("svg:text")
.attr("x", function(d) { return d.children || d._children ? -10 : -10; })
.attr("dy", ".35em")
.attr("text-anchor", function(d) { return d.children || d._children ? "end" : "end"; })
.attr("class", function(d) { return d.class.indexOf("pilot") > 0 ? "pilot" : ""})
.text(function(d) { return d.name; })
.style("fill-opacity", 1e-6);
// Transition nodes to their new position.
var nodeUpdate = node.transition()
.duration(duration)
.attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });
nodeUpdate.select("circle")
.attr("r", 4.5)
.style("fill", function(d) { return d._children ? "lightsteelblue" : "#fff"; });
nodeUpdate.select("text")
.style("fill-opacity", 1);
// Transition exiting nodes to the parent's new position.
var nodeExit = node.exit().transition()
.duration(duration)
.attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })
.remove();
nodeExit.select("circle")
.attr("r", 1e-6);
nodeExit.select("text")
.style("fill-opacity", 1e-6);
// Update the links…
var link = vis.selectAll("path.link")
.data(tree.links(nodes), function(d) { return d.target.id; });
// Enter any new links at the parent's previous position.
link.enter().insert("svg:path", "g")
.attr("class", "link")
.attr("d", function(d) {
var o = {x: source.x0, y: source.y0};
return diagonal({source: o, target: o});
})
.transition()
.duration(duration)
.attr("d", diagonal);
// Transition links to their new position.
link.transition()
.duration(duration)
.attr("d", diagonal);
// Transition exiting nodes to the parent's new position.
link.exit().transition()
.duration(duration)
.attr("d", function(d) {
var o = {x: source.x, y: source.y};
return diagonal({source: o, target: o});
})
.remove();
// Stash the old positions for transition.
nodes.forEach(function(d) {
d.x0 = d.x;
d.y0 = d.y;
});
}
// Toggle children.
function toggle(d) {
if (d.children) {
d._children = d.children;
d.children = null;
} else {
d.children = d._children;
d._children = null;
}
}
</script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
{
"name": "UC Berkeley",
"class": "source",
"children": [
{
"name": "College of Letters & Sciences",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Colleges",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "College of Environmental Design",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "College of Chemistry",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "College of Engineering",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "College of Natural Resources",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Schools",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Boalt School of Law",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Goldman School of Public Policy",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Haas School of Business",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Haas Centers and Institutes",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Teachng Research Outreach",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Haas Core Programs",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Administration",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Degree Programs",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Instruction Support",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "External Engagement",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Research",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
}
]
},
{
"name": "School of Optometry",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "School of Public Health",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Graduate School of Education",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "School of Information",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Other Academic",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "UC Library",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Cal Performances",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Office for the Faculty",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Art Mus & Pacific Film Archive",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Academic Senate",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Summer Sessn - Study Abrd - OLLI",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "University Extension",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Tch Lrn Acad Plan & Fac",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Graduate Division",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Academic Core",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Research Policy Planng & Adm",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Campus Support",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Administration & Finance",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Info Services & Technology",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Architectr Platform Integratn",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Social Science Computing Lab",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Info Svcs & Tech Imm Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Office of the Deputy CIO",
"class": "target",
"size": 2,
"color": null,
"label": null
},
{
"name": "Research Information",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "TelComm",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Enterprise Data Services",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Enterprise Application Service",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Shared Services",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "CSS Research Support Org",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "SharedServices Human Resource",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "SharedServices Research Admin",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "SharedSvcs Admin-Immed Ofc",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "SharedServices Finance-BusSrv",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "SharedServices Info Technol",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Intercollegiate Athletics",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Women's Basketball",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Other Women's Sports",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Men's Basketball",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Athletics Non-Program Specific",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Other Men's Sports",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Football",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Human Resources Admnistration",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Human Resources",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "COrWE",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "HR Center- Administration",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Business & Adminitrative Svcs",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "FEPRO Procurement Services",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Student Health Insurance Plan",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "University Police",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Parking & Transportation",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Recreational Sports",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Property Mngt & Library Bindery",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Business Contracts & Brand Protection",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Environment Health & Safety",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "University Health Services",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "BAS Immediate Office",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Finance",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Space and Capital Resources",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Planning & Analysis Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Controllers Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Finance Immediate Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Budget Office",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Admin & Finance Office",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Admin & Finance Immediate Off",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Online Ed Initiative",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Sustainability Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Op Excellence- Project Office",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "International House",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "International House-L5",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
}
]
},
{
"name": "Student Affairs",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Housing & Dining Services",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "UKHDS CR Cal Athletics",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Budget & Financial Plan",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Vending Operations",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "H&DS Central Admin",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "H&DS Child Care Services-L5",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Cal Housing",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Res & Family Living",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Marketing",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Housing & Dining Svcs Imm Off",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Human Resources",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "HOMe Central",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Housing & Dining",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "H&DS Single Facilities",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "H & DS Apartment Facilities",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "HOMe Grounds Central",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Conferences",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Dining Service Restaurants",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "UKHDS Catering",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "H&DS Dining Service Units",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Information Systems",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "SA Admissions & Enrollment",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Cal Student Central",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Admissions & Rel with Schs",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "FASO Student Financial Aid",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Admiss & Enroll Immed Ofc",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Financial Aid Office",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Office of the Registrar",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Student Affairs- Developmt Off",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "StudentAffairs-Develpmt Off-L5",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Student Affairs Immed Off",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Student Affairs Discretionary",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Student Affairs Immed Off",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "SAIT Information Tech",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "SAIT Information Tech-L5",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Lawrence Hall of Science",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "LHS Public Progs",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "LHS School Progs",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "LHS Other",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "LHS Curriculum Dev",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "LHS Admin",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "LBNL Guest House",
"class": "target",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "LBNL Guest House-L5",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Dean of Students",
"class": "target pilot",
"size": 1,
"color": null,
"label": null,
"children": [
{
"name": "Dean of Student Centers",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "ASUC Business Auxiliary",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "New Student Services",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
},
{
"name": "Career Center",
"class": "target pilot",
"size": 1,
"color": null,
"label": null
}
]
}
]
},
{
"name": "Campus Support Core",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "University Relations",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Equity & Inclusion Div",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Facilities Services",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
},
{
"name": "Non UCB Operations",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "UCB Foundation",
"class": "target",
"size": 1,
"color": null,
"label": null
},
{
"name": "Central Ledger",
"class": "target",
"size": 1,
"color": null,
"label": null
}
]
}
body {
overflow: hidden;
margin: 0;
font-size: 14px;
font-family: 'Lato',"Helvetica Neue", Helvetica;
}
#chart, #header, #footer {
position: absolute;
top: 0;
}
#header, #footer {
z-index: 1;
display: block;
font-size: 36px;
font-weight: 300;
text-shadow: 0 1px 0 #fff;
}
#header.inverted, #footer.inverted {
color: #fff;
text-shadow: 0 1px 4px #000;
}
#header {
top: 80px;
left: 140px;
width: 1000px;
}
#footer {
top: 660px;
left: 660px;
text-align: right;
}
.title {
z-index: 1;
display: block;
font-size: 20px;
font-weight: 300;
text-shadow: 0 1px 0 #fff;
}
#pilotButtons {
position: absolute;
top: 700px;
left: 10px;
}
rect {
fill: none;
pointer-events: all;
}
pre {
font-size: 18px;
}
line {
stroke: #000;
stroke-width: 1.5px;
}
.string, .regexp {
color: #f39;
}
.keyword {
color: #00c;
}
.comment {
color: #777;
font-style: oblique;
}
.number {
color: #369;
}
.class, .special {
color: #1181B8;
}
a:link, a:visited {
color: #000;
text-decoration: none;
}
a:hover {
color: #666;
}
.hint {
position: absolute;
right: 0;
width: 1280px;
font-size: 12px;
color: #999;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment