2017: Team coherentie FOOCES

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
	<title>Team coherentie FOOCES</title>

<script src="https://d3js.org/d3.v3.js"></script>
	<script src="d3.stretched.chord.js"></script>
	<script src="d3.layout.chord.sort.js"></script>
	
	
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	
	
	<link href='https://fonts.googleapis.com/css?family=Open+Sans:700,400,300' rel='stylesheet' type='text/css'>
	  <style>
		body {
		  font-family: 'Open Sans', sans-serif;
		  font-size: 12px;
		  font-weight: 400;
		  color: #525252;
		  text-align: center;
		}	
		
		line {
		  stroke: #000;
		  stroke-width: 1.px;
		}

text {
		  font-size: 8px;
		}

path.chord {
		  fill-opacity: .80;
		}
		
		.title {
			text-anchor: middle;
			fill: #3B3B3B;
			font-weight: 300;
			font-size: 16px;
		}
		.titleLine {
			stroke: #DCDCDC;
			shape-rendering: crispEdges;
		}
		
		.title-h3 {
		    margin-top: 20px;
		    margin-bottom: 10px;
		    font-size: 24px;
		    font-weight: 500;
			line-height: 1.1;
			color: #3B3B3B;
		}
		
		@media (min-width: 500px) {
		  .explanation {
			width: 50%; 
			margin: 0 auto;
		  }
		}
	  </style>
  </head>
  <body>
 
	<div class="title-h3">Hoeveel interactie is er tussen en met de teams van FOOCES?</div>

<div id="chart"></div>
	
	<div style="width: 100%;">
		<div class="explanation">
		Dit diagram toont de team interactie voor dienst FOOCES. Om een duidelijk overzicht te houden zijn niet alle teams opgenomen in dit diagram, alleen de grootste. 
		</div>
	</div>
	
    <script src="script.js"></script>
	
  </body>
</html>

Modified http://d3js.org/d3.v3.js to a secure url

Modified http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js to a secure url

https://d3js.org/d3.v3.js

https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js