gramcracker.github.io/index.html at master · gramcracker/gramcracker.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="styles.css">
	<script src="https://d3js.org/d3.v4.min.js"></script>
	<script src="https://cdn.jsdelivr.net/gh/holtzy/D3-graph-gallery@master/LIB/sankey.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
	<div class="container" align="center" >
		<div class="container" >
			<div align="left" style="display: inline-block; padding: 5px; border: 1px solid #353b45; margin: 10px" >
				<div class="md-form mb-3" style="margin-right: 50px; margin-left: 50px; margin-top: 15px">
					<input class="form-control" id="Search" type="text" placeholder="Search" onfocus="this.placeholder = ''" >
				</div>
				<text style="color:#8992a1; font-size:13px">//Grey matter:</text>
				<div id="treemapChart"></div>
				<text style="color:#8992a1; font-size:13px">//White matter:</text>

				<div id="sankeyChart">
				</div>
			</div>
			<ul id="legend">
					<li><span style="color: #8992a1">Glutimate</span></li>
					<li><span style="color: #8992a1">GABA</span></li>
					<li><span style="color: #8992a1">Serotonin</span></li>
					<li><span style="color: #8992a1">Dopamine</span></li>
					<li><span style="color: #8992a1">Acetylcholine</span></li>
					<li><span style="color: #8992a1">Norepinephrine</span></li>
					<li><span style="color: #8992a1">Other</span></li>
				</ul>
			<ul id="web_links">
				<li>
					<a href = "https://jsoneditoronline.org/?url=https%3A%2F%2Fraw.githubusercontent.com%2Fgramcracker%2Fgramcracker.github.io%2Fmaster%2Fwhitematter.json">
						<text>//Editor</text>
					</a>
				</li>
				<li>
					<a href="https://raw.githubusercontent.com/gramcracker/gramcracker.github.io/master/whitematter.json">
						<text>//Raw</text>
					</a>
				</li>
				<li>
					<a href="https://github.com/gramcracker/gramcracker.github.io">
						<text>//Project</text>
					</a>
				</li>
				<li>
					<a href="https://ko-fi.com/joshcollins">
						<text>//Buy me coffee ☕</text>
					</a>
				</li>

			</ul>

		</div>
	</div>

	<ul class='custom_menu'>
	  <li data-action = "view_outgoing">view outgoing</li>
	  <li data-action = "view_incoming">view incoming</li>
	</ul>

	<script src="treemap.js"></script>
	<script src="contextmenu.js"></script>
	<script src="sankey.js"></script>
	<script>
		$("#Search").keydown(function(event) {
			if(event.keyCode === 13){
				search($("#Search").val());
				$("#Search").val("")
			}
		});
	</script>
</body>
</html>