-
Notifications
You must be signed in to change notification settings - Fork 0
/
grid.html
80 lines (67 loc) · 2.99 KB
/
grid.html
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
79
80
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Kanishchev Konstantin web page</title>
<meta name="description" content="">
<meta name="author" content="">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<style>
body { padding-top: 60px; }
#chart svg {border: solid;}
rect {stroke: none; fill:black;}
#shbox {fill:gray; stroke: black; stroke-width:1; stroke-dasharray: 4 2;}
line {stroke-width:4;}
circle {stroke: red; fill: none;}
path {stroke: black; stroke-width:2; fill: none;}
</style>
</head>
<body>
<div class="container">
<div class="offset2 span8" id="chart" style="text-align:center"></div>
<div class="offset2 span8" style="text-align:center">
<div class="btn-toolbar" id="controls">
<div class="btn-group"> <button class="btn" id="bbox">Place conductor</button> </div>
<div class="btn-group">
<button class="btn" id="bline">Place charge:</button>
<button class="btn btn-danger" id="bplus" ><i class="icon-plus"></i></button>
<button class="btn btn-primary" id="bminus"><i class="icon-minus"></i></button>
</div>
<div class="btn-group"> <button class="btn">Clear</button> </div>
</div>
</div>
</div> <!-- /container -->
<script type="text/javascript" src="d3.v2.js"> </script>
<script type="text/javascript" src="grid.js"> </script>
<script type="text/javascript">
var step = 40;
var width = d3.select("#chart").style("width");
var grd = new Grid("#chart",10,10,step);
grd.BoxMode();
d3.select("#bplus" ).on("click",grd.SetRedLineMode.bind (grd));
d3.select("#bminus").on("click",grd.SetBlueLineMode.bind(grd));
d3.select("#bbox" ).on("click",grd. BoxMode.bind(grd));
d3.select("#bline" ).on("click",grd.LineMode.bind(grd));
</script>
<!-- Placed at the end of the document so the pages load faster -->
<!--
<script src="bootstrap/js/tests/vendor/jquery.js"></script>
<script src="bootstrap/js/bootstrap-transition.js"></script>
<script src="bootstrap/js/bootstrap-alert.js"></script>
<script src="bootstrap/js/bootstrap-modal.js"></script>
<script src="bootstrap/js/bootstrap-dropdown.js"></script>
<script src="bootstrap/js/bootstrap-scrollspy.js"></script>
<script src="bootstrap/js/bootstrap-tab.js"></script>
<script src="bootstrap/js/bootstrap-tooltip.js"></script>
<script src="bootstrap/js/bootstrap-popover.js"></script>
<script src="bootstrap/js/bootstrap-button.js"></script>
<script src="bootstrap/js/bootstrap-collapse.js"></script>
<script src="bootstrap/js/bootstrap-carousel.js"></script>
<script src="bootstrap/js/bootstrap-typeahead.js"></script>
-->
</body>
</html>