red_grape 0.0.12 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/.gitignore +1 -1
- data/bin/juicer +23 -5
- data/bin/redgrape +2 -2
- data/bin/trellis +3 -3
- data/lib/red_grape/element.rb +4 -0
- data/lib/red_grape/graph.rb +4 -3
- data/lib/red_grape/graph_store.rb +29 -0
- data/lib/red_grape/pipe/base.rb +2 -4
- data/lib/red_grape/pipe/context.rb +72 -22
- data/lib/red_grape/pipe/order_pipe.rb +12 -0
- data/lib/red_grape/pipe/{paths_pipe.rb → path_pipe.rb} +12 -3
- data/lib/red_grape/pipe/scatter_pipe.rb +1 -1
- data/lib/red_grape/pipe/select_pipe.rb +8 -1
- data/lib/red_grape/tools/irg.rb +2 -2
- data/lib/red_grape/tools/{graph_store.rb → trellis.rb} +2 -21
- data/lib/red_grape.rb +4 -2
- data/public/cellar/graph.html +220 -0
- data/public/cellar/index.html +78 -0
- data/public/cellar/vertex.html +103 -0
- data/public/js/d3.v2.js +9387 -0
- data/public/js/jquery-1.7.2.min.js +4 -0
- data/test/test_graph_store.rb +35 -0
- data/test/test_on_the_nature_of_pipes.rb +1 -2
- data/test/test_order_pipe.rb +13 -0
- data/test/test_select_pipe.rb +9 -0
- data/test/test_traversal_patterns.rb +31 -31
- metadata +17 -7
- data/lib/red_grape/path_group.rb +0 -12
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
<html>
|
|
2
|
+
<head>
|
|
3
|
+
<script src="/js/jquery-1.7.2.min.js"></script>
|
|
4
|
+
<script>
|
|
5
|
+
$(function() {
|
|
6
|
+
function setGraph(graphId) {
|
|
7
|
+
if (graphId) {
|
|
8
|
+
graphs.val(graphId);
|
|
9
|
+
$('iframe').attr('src', '/cellar/graph.html#' + graphId);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
var iframeHeight = $('body').height() - $('header').height();
|
|
14
|
+
$('iframe').height(iframeHeight);
|
|
15
|
+
|
|
16
|
+
var graphs = $('#graphs');
|
|
17
|
+
graphs.change(function(evt) {
|
|
18
|
+
setGraph(graphs.val());
|
|
19
|
+
});
|
|
20
|
+
$.get(
|
|
21
|
+
'/graphs',
|
|
22
|
+
function(data) {
|
|
23
|
+
data = eval('(' + data + ')');
|
|
24
|
+
$.each(data.graphs, function(i, graph) {
|
|
25
|
+
graphs.append($('<option value="' + graph + '">' + graph + '</option>'));
|
|
26
|
+
});
|
|
27
|
+
setGraph(data.graphs[0]);
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
});
|
|
31
|
+
</script>
|
|
32
|
+
<style>
|
|
33
|
+
body {
|
|
34
|
+
margin:0;
|
|
35
|
+
padding:0;
|
|
36
|
+
}
|
|
37
|
+
header {
|
|
38
|
+
margin:0;
|
|
39
|
+
width:100%;
|
|
40
|
+
background-color:black;
|
|
41
|
+
box-shadow: 0px 2px 3px #888;
|
|
42
|
+
}
|
|
43
|
+
header h1 {
|
|
44
|
+
display:inline;
|
|
45
|
+
color:white;
|
|
46
|
+
margin-left:10px;
|
|
47
|
+
font-size:1em;
|
|
48
|
+
font-weight:normal;
|
|
49
|
+
}
|
|
50
|
+
header h1 a {
|
|
51
|
+
text-decoration:none;
|
|
52
|
+
color:white;
|
|
53
|
+
}
|
|
54
|
+
header select {
|
|
55
|
+
position:absolute;
|
|
56
|
+
right:10px;
|
|
57
|
+
}
|
|
58
|
+
iframe {
|
|
59
|
+
width:100%;
|
|
60
|
+
height:500px;
|
|
61
|
+
border:none;
|
|
62
|
+
}
|
|
63
|
+
</style>
|
|
64
|
+
</head>
|
|
65
|
+
<body>
|
|
66
|
+
<header>
|
|
67
|
+
<h1>
|
|
68
|
+
<a href="/cellar/index.html">The Juice Cellar: a Graph Viewer</a>
|
|
69
|
+
</h1>
|
|
70
|
+
<select id="graphs">
|
|
71
|
+
<option>[Change a Graph]</option>
|
|
72
|
+
</select>
|
|
73
|
+
</header>
|
|
74
|
+
<section>
|
|
75
|
+
<iframe name="graph"></iframe>
|
|
76
|
+
</seciton>
|
|
77
|
+
</body>
|
|
78
|
+
</html>
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
|
5
|
+
<title>Flare Dendrogram</title>
|
|
6
|
+
<!--script type='text/javascript' src='/js/d3.v3.js'></script-->
|
|
7
|
+
<script type='text/javascript' src='/js/d3.v2.js'></script>
|
|
8
|
+
<style type='text/css'>
|
|
9
|
+
.node circle {
|
|
10
|
+
fill: #fff;
|
|
11
|
+
stroke: steelblue;
|
|
12
|
+
stroke-width: 1.5px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.node {
|
|
16
|
+
font: 10px sans-serif;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.link {
|
|
20
|
+
fill: none;
|
|
21
|
+
stroke: #ccc;
|
|
22
|
+
stroke-width: 1.5px;
|
|
23
|
+
}
|
|
24
|
+
</style>
|
|
25
|
+
</head>
|
|
26
|
+
<body>
|
|
27
|
+
<div id="chart"></div>
|
|
28
|
+
<script type='text/javascript'>
|
|
29
|
+
var json = {
|
|
30
|
+
"name":"node1",
|
|
31
|
+
"children":[
|
|
32
|
+
{
|
|
33
|
+
"name":"node2",
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
"name":"node3",
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
"name":"node4",
|
|
40
|
+
"children":[
|
|
41
|
+
{
|
|
42
|
+
"name":"node3",
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
"name":"node5"
|
|
46
|
+
}
|
|
47
|
+
]
|
|
48
|
+
}
|
|
49
|
+
]
|
|
50
|
+
};
|
|
51
|
+
/*
|
|
52
|
+
var node1 = { "name":"node1" };
|
|
53
|
+
var node2 = { "name":"node2" };
|
|
54
|
+
var node3 = { "name":"node3" };
|
|
55
|
+
var node4 = { "name":"node4" };
|
|
56
|
+
var node5 = { "name":"node5" };
|
|
57
|
+
node1.children = [ node2, node3, node4 ];
|
|
58
|
+
node3.children = [ node3, node5 ];
|
|
59
|
+
var json = node1;
|
|
60
|
+
*/
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
var radius = 960 / 2;
|
|
64
|
+
|
|
65
|
+
var cluster = d3.layout.cluster()
|
|
66
|
+
.size([360, radius - 120]);
|
|
67
|
+
cluster.sort(function(a, b) { console.log(a.name, b.name); return d3.ascending(a.name, b.name)});
|
|
68
|
+
|
|
69
|
+
var diagonal = d3.svg.diagonal.radial()
|
|
70
|
+
.projection(function(d) { return [d.y, d.x / 180 * Math.PI]; });
|
|
71
|
+
|
|
72
|
+
var vis = d3.select("#chart").append("svg")
|
|
73
|
+
.attr("width", radius * 2)
|
|
74
|
+
.attr("height", radius * 2)
|
|
75
|
+
.append("g")
|
|
76
|
+
.attr("transform", "translate(" + radius + "," + radius + ")");
|
|
77
|
+
|
|
78
|
+
var nodes = cluster.nodes(json);
|
|
79
|
+
|
|
80
|
+
var link = vis.selectAll("path.link")
|
|
81
|
+
.data(cluster.links(nodes))
|
|
82
|
+
.enter().append("path")
|
|
83
|
+
.attr("class", "link")
|
|
84
|
+
.attr("d", diagonal);
|
|
85
|
+
|
|
86
|
+
var node = vis.selectAll("g.node")
|
|
87
|
+
.data(nodes)
|
|
88
|
+
.enter().append("g")
|
|
89
|
+
.attr("class", "node")
|
|
90
|
+
.attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })
|
|
91
|
+
|
|
92
|
+
node.append("circle")
|
|
93
|
+
.attr("r", 4.5);
|
|
94
|
+
|
|
95
|
+
node.append("text")
|
|
96
|
+
.attr("dx", function(d) { return d.x < 180 ? 8 : -8; })
|
|
97
|
+
.attr("dy", ".31em")
|
|
98
|
+
.attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
|
|
99
|
+
.attr("transform", function(d) { return d.x < 180 ? null : "rotate(180)"; })
|
|
100
|
+
.text(function(d) { return d.name; });
|
|
101
|
+
</script>
|
|
102
|
+
</body>
|
|
103
|
+
</html>
|