D3OG

All examples By author By category About

maggie-lee

Full window Github gist

ga gov map

<!DOCTYPE html>
<meta charset="utf-8">
<style>

.node circle {
  stroke: #3f2809;
  stroke-width: 1.5px;
  opacity: 0.8;
}

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

body {
   font-family: Helvetica, Arial, "Lucida Grande", sans-serif; 
   font-weight: 300;
}

.link {
  fill: none;
  stroke: black;
  stroke-width: 3px;
  opacity: 0.2;
}

.note{
  font-size: 30px;
  fill: red;
}

/* branches of gov*/
.legislative {
  font-size: 22px;
}
.judicial {
  font-size: 22px;
}
.executive {
  font-size: 22px;
}
/*************/
.gga {
  font-size: 20px;
}
.leg{
  font-size: 18px;
}

.department {
  font-size: 20px;
}
.officeof {
  font-size: 18px;
}
.division {
  font-size: 12px;
}
.default {
  font-size: 12px;
}

/*close bureaucraies
open boards */

.gboard 
{
  font-size: 14px;

} /* most important boards; gov only appoints */
.cboard
{
  font-size: 12px;

} /* 2nd most important boards; gov appoints, senate confirms */

.aboard
{
  font-size: 12px;

} /* least important boards; everybody & anybody appoints */

.advisory
{
  font-size: 10px;
}

.boss {
  font-size: 14px;
}
.eboss {
  font-size: 14px;
}
.default {
  font-size: 10px;
}
.commission {
  font-size: 10px;
}
.bcommission
{
  font-size: 18px;
} /* set like, PSC to "bcommission" big commission */
.court {
  font-size: 14px;
}
.board {
  font-size: 14px;
}
.enode
{
  font-size: 10px;
}

/*
line_types */

.under {
  fill: none;
  stroke: black;
  stroke-width: 3px;
}

.admin {
  fill: none;
  stroke: black;
  stroke-width: 3px;
}

.autonomous {
  fill: none;
  stroke: red;
  stroke-width: 1px;
}

.recieves_advice_from {
  fill: none;
  stroke: blue;
  stoke-width: 1px;
}

.administers {
  fill: none;
  stroke: orange;
  stroke-width: 1px;
}

.oversees {
  fill: none;
  stroke: green;
  stroke-width: 1px;
}

.mystery {
  fill: none;
  stroke: Indigo;
  stroke-width: 1px;
}

.support {
  fill: none;
  stroke: yellow;
  stroke-width: 1px;
}

.other {
  fill: none;
  stroke: darkpink;
  stroke-width: 6px;
}

html { -webkit-font-smoothing: antialiased; }

</style>
<body>
<script src="https://d3js.org/d3.v2.js?2.9.3"></script>
<script>

//are all "boss" appointed?

var diameter = 4000;

var tree = d3.layout.tree()
    .size([360, diameter / 2 - 120])
    .separation(function(a, b) { return (a.parent == b.parent ? 1 : 2) / a.depth; });

var diagonal = d3.svg.diagonal.radial()
    .projection(function(d) { return [(d.y), (d.x) / 180 * Math.PI]; });

var svg = d3.select("body").append("svg")
    .attr("width", diameter)
    .attr("height", diameter)
  .append("g")
    .attr("transform", "translate(" + diameter / 2 + "," + diameter / 2 + ")");

// var gridline = svg.append("line")
//   .attr("x1", 0)
//   .attr("y1", 0)
//   .attr("x2", diameter)
//   .attr("y2", diameter)
//   .attr("stroke-width", 2)
//   .attr("stroke", "black");

var nodeColor = d3.scale.ordinal()
  .domain(["executive",  "department", "office", "default", "gboard", "cboard", "aboard", "sboard", "boss", "eboss", "judicial", "court", "jboard", "jdefault",  "enode", "legislative", "ldivision", "housesenate", "ldefault", "mystery", "advisory"])

//add "fund"
  //add "authority"
  //add explainer node?
 //make psc color to show it is "quasi judicial quasi exec?"
//prolly add sboard, statutory board?
//add different kind of boss

// Darker Blue - bureaucracy
// #1F599E #4379AF #8DADCF #D1DEEB #EBF1F6
// Lighter Blue - big commission/small commission
// #3F93C8 #57A7D2 #94C9E3 #D3E9F4 #EDF6F9

.range([
    "#1F599E", //darkest blue executive branch
    "#4379AF", // dark blue department
    "#8DADCF", // "office of"
    "#D1DEEB", // medium blue default

"#9d5594", // dark violet - gov appoints
    "#AC73AB", // middle violet - gov appoints subject to senate
    "#CBA9CC", // light violet- appointment free-for-all
    "#EADDEA", // lightest violet statutory board

"#3F93C8", //darkest violet purple - appointed boss -- appointed by board or gov? distinguish?
    "#D4F693", // middle lime - elected boss -- consider a constrast color here?

"#4CA38E", // sea green dark judicial branch
    "#60B3A3", // sea green middle- courts
    "#97D0C8", //sea green middle - jboard
    "#D4ECE8", //sea green light j default

"#EEFCD4", // lime green light- enode explainer node

"#e53f98", //dark pink legislative branch
    "#D876AC", // legislative division -- gga & audis and accouts
    "#E5ABCD", // middle pink house & senate
    "#F4DCEA", // lighter pink sublegislegis
    
    "#8B8989",  //mystery gray
    "#F6F1F7" //aadvisory violet light
    ]);

//Pink - legis
// #e53f98 #D876AC #E5ABCD #F4DCEA #FAF0F6
// Violet - appointed boards
//  #9d5594 #FAF0F6 #AC73AB #CBA9CC #EADDEA #F6F1F7
// Purple - bosses
// #644E96 #8270A9 #B3A9CA #E1DBEA #F2F1F6
// Darker Blue - bureaucracy
// #1F599E #4379AF #8DADCF #D1DEEB #EBF1F6
// Lighter Blue - big commission/small commission
// #3F93C8 #57A7D2 #94C9E3 #D3E9F4 #EDF6F9
// Teal - judy
// #4CA38E #60B3A3 #97D0C8 #D4ECE8 #EEF7F6
// Lime -other
// #ABF247 #B9F35A #D4F693 #EEFCD4  #F8FEED

//501c3s?

// must include Note for Ga Student Finance Commission
// actually refers to 3 separate bodies with overlapping membership:
//GSFC, Georgia Student Finance Authority and Georgia Higher Education Assistance Corporation

// what about authorities?

//did not enclude EO bodies, like georgia womens garden or whatnot

//'athletic and entertaionment commission' is just licensing for boxers

//sboard - most of the officers (not ex officio) are named in statute
//aboard - if it is like a free-for-all

//some of the j stuff doesnt start till 2014

d3.csv("orgchart1326.csv", function(links) {

var nodesByName = {};

// Create nodes for each unique source and target.
  links.forEach(function(link) {
    var parent = link.source = nodeByName(link.source),
        child = link.target = nodeByName(link.target);
    if (parent.children) parent.children.push(child);
    else parent.children = [child];
  });

for (var i = links.length - 1; i >= 0; i--) {
  links[i].name = links[i].target.name;
};

// for (var i = links.length - 1; i >= 0; i--) {
//   console.log(links[i].line_type)
//   console.log(typeof(links[i].line_type))
// };

// Extract the root node and compute the layout.
var nodes = tree.nodes(links[0].source);

var LabelFinder = function(my_string)
{
  for (var i = links.length - 1; i >= 0; i--) 
  {
    if (links[i].name == my_string) {return links[i].label_type;}
  }
};

var ColorFinder = function(my_string)
{
  for (var i = links.length - 1; i >= 0; i--) 
  {
    if (links[i].name == my_string) {return nodeColor(links[i].label_type);}
  }
};

// var HeightScale = d3.scale.ordinal()
// .domain([""])

// var HeightFinder = function(my_string)
// {
//   for (var i = links.length - 1; i >= 0; i--) 
//   {
//     if (links[i].name == my_string) {return HeightScale(links[i].depth);}
//   }
// };

// Create the link lines.

var dots_array = ("3,3");

// Create the node circles.
  var node = svg.selectAll(".node")
      .data(nodes)
    .enter()
      .append("g")
      .attr("class", "node")
      .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; });

// node.append("circle")
  //     .attr("r", 6)
  //     .attr("fill", function(d) {return ColorFinder(d.name); });

node.append("rect")
    .attr("x", -diameter/100)
    .attr("y", -7)
    .attr("width", (diameter * 0.04))
    .attr("height", 15)
    .attr("rx", 20)
    .attr("ry", 20)
    .attr("fill", function(d) {return ColorFinder(d.name); })
    .attr("class", function(d) {return LabelFinder(d.name); });

for (var i = nodes.length - 1; i >= 0; i--) {
  console.log(nodes[i].depth);
};

node.append("g:text")
     
      .attr("x", function(d) { return d.x < 180 ? -diameter/100 : diameter/100; }  )

.attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
      .attr("transform", function(d)   { return d.x < 180 ? "translate(8)" : "rotate(180)translate(-8)"; })
      .attr("class", function(d) {return LabelFinder(d.name);})
      .attr("fill", "black")
      .attr("id", "tspan")
      .text(function(d) { return d.name; });

// node.append("text")
  //     .attr("dy", ".31em")
  //     .attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
  //     .attr("transform", function(d)   { return d.x < 180 ? "translate(8)" : "rotate(180)translate(-8)"; })
  //     .attr("class", function(d) {return LabelFinder(d.name);})
  //     .attr("fill", function(d) {return ColorFinder(d.name);})
  //     .text(function(d) { return d.name; });

svg.append("text")
  .text("DRAFT ONLY!!")
  .attr("class", "note");

function nodeByName(name) {

return nodesByName[name] || (nodesByName[name] = {name: name});
  }
});

// cafr: "component units" are legally separate organizations for which the states elected officlals are financially accountable

// line_type: D = Division
// DCO = Deputy Commissioner Of
//U = under, default
//A = attached for administrative purpses only
//P = "program" lowercase p
//S = "supports"
//GA = Grant accountable
//UA = under the authority of
//AD = administers
//PA = program areas
//RB = Run By

// Not pictured are divisions common across many offices, like Communications or Administration or Human Resources. Adding those would be like saying every office has desks and computers. Of course they do. But I'm focusing on each office's unique functions.

//sources start with the governor's 2014 budget in brief report, supplemented by department annual reports and websites and the State of Georgia 2013 Agency Directory

//"Program" means any program operated by the executive branch of state government at a cost in excess of $5 million per year

//PSC regulation - Electricty pretty much only Georgia Power tho it oversees others a little bit
//PSC is quasi judicial according to govs budget

//poster: redbubble A2 $19 23.4 x 16.5, A1, $33.25  33.1 x 23.4
//cafepress: small poster $13.99 16x20, large poster 17.99 23x35

//an "authority" = ? public corporation?

</script>

Modified http://d3js.org/d3.v2.js?2.9.3 to a secure url

https://d3js.org/d3.v2.js?2.9.3