STUDY O's

how do they end up in faceAll()???

by Nivaldo

HTML

<script src="http://investhand.de/d3js/v3v2/bootstrap.js"></script>
<link rel="stylesheet" href="http://investhand.de/d3js/v3v2/bootstrap.css">
<script src="http://d3js.org/d3.v3.js"></script>
<script src="http://investhand.de/static-new/js/jquery.tipsy.js"></script>
<link rel="stylesheet" href="http://investhand.de/static-new/css/tipsy.css">
<div class="container">
				<div class="outer-d3 col-md-7">
					<button class="btn_person">person</button>
					<div class="d3-container">

					</div>
				</div>
		</div>

CSS

@charset "utf-8";
/* CSS Document */

.link10 { stroke: #B8CEE3; stroke-width: 2px; stroke-dasharray: 3, 3; }
.link1 { stroke: #B8CEE3; stroke-width: 2px;}
.nodetext { pointer-events: none; font:Arial, Helvetica, sans-serif}
.tooltip,.tooltipD{font:Arial, Helvetica, sans-serif}

.node {
  cursor: pointer;
}

.node.type0 {
  fill:#333333;
}

.node.type1 {
  fill:#2F4E9B;
}
.node.type2 {
  fill:#5E8AB5;
}
.node.type3 {
  fill:#5E8AB5;
}

.node.type4hover {
  fill:#FFFFFF;
  stroke:red; 
  stroke-width: 3px;
}

.node.type5 {
	fill:#1BC9E0;
}

.node.type6 {
	fill:#E01B98;
}

image.circle {
	cursor:pointer;
}

.fadein{
display:none;
font-size:20px;
}

.rectD{
background-color:#000000;
width:70px;
height:30px
}

.rectL{
background-color:#000000;
width:90px;
height:30px
}

/*div.tooltip {   
  position: absolute;           
  text-align: center;           
  width: 60px;                  
  height: 40px;                 
  padding: 2px;             
  font: 12px sans-serif;        
  background: lightsteelblue;   
  border: 0px;      
  border-radius: 8px;           
  pointer-events: none;         
}*/

div.tooltipD {   
  position: absolute;           
  text-align: center;           
  width: 70px;                  
  height: 20px;                 
  padding: 2px;             
  font: 12px sans-serif;        
  background: lightsteelblue;   
  border: 0px;      
  border-radius: 8px;           
  pointer-events: none;         
}

.desc-tip{
   margin-left: 4px;
}

.desc-tip .tipsy-inner{
        background-color: #5E8AB5;
        max-width: 100px;
        }
        
.desc-tip .tipsy-arrow {
    background: url('../images/tipsy-mblue.gif') no-repeat top left !important;
    }

.company-typeH0-tip .tipsy-arrow {
    background: url('../images/tipsy-3gray.gif') no-repeat top left;
}

.company-typeH1-tip .tipsy-arrow {
    background: url('../images/tipsy-lblue.gif') no-repeat top left;
}

.company-typeH2-tip .tipsy-arrow {
    background:...

JavaScript

var data = {"nodes":[
        					//main nodes
                            {"name":"Know", "full_name":"Knowledge", "type":0, "slug": "", "entity":"company", "id":"7329030",},
                            {"name":"A1", "full_name":"Alphabet 1", "type":1, "slug": "", "entity":"company", "id":"1745614",},
                            {"name":"B2", "full_name":"Alphabet 2", "type":1, "slug": "", "entity":"company", "id":"1142143",},
                            {"name":"C3", "full_name":"Alphabet 3", "type":1, "slug": "", "entity":"company", "id":"1335699",},
                            {"name":"D4", "full_name":"Alphabet 4", "type":1, "slug": "", "entity":"company", "id":"6597671",},
                            {"name":"E5", "full_name":"Alphabet 5", "type":1, "slug": "", "entity":"company", "id":"731492",},
                            {"name":"F6", "full_name":"Alphabet 6", "type":1, "slug": "", "entity":"company", "id":"1745614",},
                            {"name":"G7", "full_name":"Alphabet 7", "type":1, "slug": "", "entity":"company", "id":"1142143",},
                            {"name":"H8", "full_name":"Alphabet 8", "type":1, "slug": "", "entity":"company", "id":"1335699",},
                            {"name":"I9", "full_name":"Alphabet 9", "type":1, "slug": "", "entity":"company", "id":"6597671",},
                            {"name":"J10", "full_name":"Alphabet 10", "type":1, "slug": "", "entity":"company", "id":"731492",},
                            {"name":"K11", "full_name":"Alphabet 11", "type":2, "slug": "", "entity":"company", "id":"1745614",},
                            {"name":"L12", "full_name":"Alphabet 12", "type":2, "slug": "", "entity":"company", "id":"1142143",},
                            {"name":"M13", "full_name":"Alphabet 13", "type":2, "slug": "", "entity":"company", "id":"1335699",},
                            {"name":"N14", "full_name":"Alphabet 14", "type":2, "slug": "", "entity":"company", "id":"6597671",},
                    ...