text: ﻿<html>
      <head>
  		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
  		
  		<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
  		<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
  		<script type="text/javascript" src="http://www.amcharts.com/lib/3/gantt.js"></script>
  		<script src="../responsive.min.js" type="text/javascript"></script>
  
  		<style>
  		body, html {
  			height: 100%;
  			padding: 0;
  			margin: 0;
  			overflow: hidden;
  		}
  		#chartdiv {
  			width: 100%;
  			height: 100%;
  		}
  		</style>
  
  		<script type="text/javascript">
  			AmCharts.useUTC = true;
  			var chart = AmCharts.makeChart( "chartdiv", {
  				"type": "gantt",
  				"period": "hh",
  				"pathToImages": "http://www.amcharts.com/lib/3/images/",
  				"balloonDateFormat": "JJ:NN",
  				"columnWidth": 0.5,
  				"valueAxis": {
  					"type": "date",
  					"minimum": 7,
  					"maximum": 31
  				},
  				"brightnessStep": 10,
  				"graph": {
  					"fillAlphas": 1,
  					"balloonText": "<b>[[task]]</b>: [[open]] [[value]]"
  				},
  				"rotate": true,
  				"categoryField": "category",
  				"segmentsField": "segments",
  				"colorField": "color",
  				"startDate": "2015-01-01",
  				"startField": "start",
  				"endField": "end",
  				"durationField": "duration",
  				"dataProvider": [ {
  					"category": "John",
  					"segments": [ {
  						"start": 7,
  						"duration": 2,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 2,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Smith",
  					"segments": [ {
  						"start": 10,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 1,
  						"color": "#CF794A",
  						"task": "Task #3"
  					}, {
  						"duration": 4,
  						"color": "#7B742C",
  						"task": "Task #1"
  					} ]
  				}, {
  					"category": "Ben",
  					"segments": [ {
  						"start": 12,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"start": 16,
  						"duration": 2,
  						"color": "#FFE4C4",
  						"task": "Task #4"
  					} ]
  				}, {
  					"category": "Mike",
  					"segments": [ {
  						"start": 9,
  						"duration": 6,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 4,
  						"color": "#7E585F",
  						"task": "Task #2"
  					} ]
  				}, {
  					"category": "Lenny",
  					"segments": [ {
  						"start": 8,
  						"duration": 1,
  						"color": "#CF794A",
  						"task": "Task #3"
  					}, {
  						"duration": 4,
  						"color": "#7B742C",
  						"task": "Task #1"
  					} ]
  				}, {
  					"category": "Scott",
  					"segments": [ {
  						"start": 15,
  						"duration": 3,
  						"color": "#7E585F",
  						"task": "Task #2"
  					} ]
  				}, {
  					"category": "Julia",
  					"segments": [ {
  						"start": 9,
  						"duration": 2,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 1,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 8,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Bob",
  					"segments": [ {
  						"start": 9,
  						"duration": 8,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 7,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Kendra",
  					"segments": [ {
  						"start": 11,
  						"duration": 8,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"start": 16,
  						"duration": 2,
  						"color": "#FFE4C4",
  						"task": "Task #4"
  					} ]
  				}, {
  					"category": "Tom",
  					"segments": [ {
  						"start": 9,
  						"duration": 4,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 3,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 5,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Kyle",
  					"segments": [ {
  						"start": 6,
  						"duration": 3,
  						"color": "#7E585F",
  						"task": "Task #2"
  					} ]
  				}, {
  					"category": "Anita",
  					"segments": [ {
  						"start": 12,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"start": 16,
  						"duration": 2,
  						"color": "#FFE4C4",
  						"task": "Task #4"
  					} ]
  				}, {
  					"category": "Jack",
  					"segments": [ {
  						"start": 8,
  						"duration": 10,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					} ]
  				}, {
  					"category": "Kim",
  					"segments": [ {
  						"start": 12,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 3,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Aaron",
  					"segments": [ {
  						"start": 18,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 2,
  						"color": "#FFE4C4",
  						"task": "Task #4"
  					} ]
  				}, {
  					"category": "Alan",
  					"segments": [ {
  						"start": 17,
  						"duration": 2,
  						"color": "#7B742C",
  						"task": "Task #1"
  					}, {
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 2,
  						"color": "#CF794A",
  						"task": "Task #3"
  					} ]
  				}, {
  					"category": "Ruth",
  					"segments": [ {
  						"start": 13,
  						"duration": 2,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"duration": 1,
  						"color": "#CF794A",
  						"task": "Task #3"
  					}, {
  						"duration": 4,
  						"color": "#7B742C",
  						"task": "Task #1"
  					} ]
  				}, {
  					"category": "Simon",
  					"segments": [ {
  						"start": 10,
  						"duration": 3,
  						"color": "#7E585F",
  						"task": "Task #2"
  					}, {
  						"start": 17,
  						"duration": 4,
  						"color": "#FFE4C4",
  						"task": "Task #4"
  					} ]
  				} ],
  				"chartScrollbar": {},
  				"chartCursor": {
  					"valueBalloonsEnabled": false,
  					"cursorAlpha": 0.1,
  					"valueLineBalloonEnabled": true,
  					"valueLineEnabled": true,
  					"fullWidth": true
  				},
  				"responsive": {
  					"enabled": true
  				}
  			} );
  		</script>
  	</head>
  	<body>
  		<div id="chartdiv"></div>
  	</body>
  </html>