Skip to content

Commit d873eac

Browse files
committed
first working version
1 parent 958b7e0 commit d873eac

File tree

10 files changed

+5199
-145
lines changed

10 files changed

+5199
-145
lines changed

build/d3-dot-graph.js

Lines changed: 2491 additions & 0 deletions
Large diffs are not rendered by default.

build/d3-dot-graph.min.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

example/index.html

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,7 @@
2323
</style>
2424
<svg width="960" height="600"></svg>
2525
<script src="https://d3js.org/d3.v4.min.js"></script>
26-
<script src="/grammar/dot.js"></script>
27-
<script src="/d3-dot-graph.js"></script>
26+
<script src="../build/d3-dot-graph.js"></script>
2827
<script>
2928

3029
var line = d3.line()
@@ -52,7 +51,7 @@
5251
.attr("id", String)
5352
.attr("viewBox", "0 -5 10 10")
5453
.attr("refX", 15)
55-
.attr("refY", -1.5)
54+
.attr("refY", -0.5)
5655
.attr("markerWidth", 6)
5756
.attr("markerHeight", 6)
5857
.attr("orient", "auto")
@@ -102,10 +101,17 @@
102101
.radius(function(d) { return d.y; });
103102

104103
function ticked() {
105-
path.attr("d",
106-
(d)=>linkGen(d))
107-
//(d) => line([[d.source.x, d.source.y], [d.target.x, d.target.y]]));
108-
104+
path.attr("d", function(d) {
105+
var dx = d.target.x - d.source.x,
106+
dy = d.target.y - d.source.y,
107+
dr = Math.sqrt(dx * dx + dy * dy);
108+
return "M" +
109+
d.source.x + "," +
110+
d.source.y + "A" +
111+
dr + "," + dr + " 0 0,1 " +
112+
d.target.x + "," +
113+
d.target.y;
114+
});
109115
node
110116
.attr("transform", function(d) {
111117
return "translate(" + d.x + "," + d.y + ")"; });

grammar/dot.pegjs

Lines changed: 173 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,173 @@
1+
// Simplified DOT grammar
2+
//
3+
// Not supported (yet):
4+
//
5+
// * HTML IDs
6+
7+
{
8+
function merge(a, b, key) {
9+
10+
function x(a) {
11+
a.forEach(function (b) {
12+
if (!(b[key] in obj)) {
13+
obj[b[key]] = obj[b[key]] || {};
14+
array.push(obj[b[key]]);
15+
}
16+
Object.keys(b).forEach(function (k) {
17+
obj[b[key]][k] = b[k];
18+
});
19+
});
20+
}
21+
22+
var array = [],
23+
obj = {};
24+
25+
x(a);
26+
x(b);
27+
return array;
28+
}
29+
30+
var directed;
31+
}
32+
33+
start
34+
= graphStmt+
35+
36+
graphStmt
37+
= _* strict:(strict _)? type:graphType _* id:(id)? _* '{' _* stmts:stmtList? _* '}' _* {
38+
return {type: type, id: id, strict: strict !== null, stmts: stmts};
39+
}
40+
41+
stmtList
42+
= first:stmt _* ';'? rest:(_* inner:stmt _* ';'?)* {
43+
var result = [first];
44+
for (var i = 0; i < rest.length; ++i) {
45+
result.push(rest[i][1]);
46+
}
47+
return result;
48+
}
49+
50+
stmt
51+
= attrStmt
52+
/ edgeStmt
53+
/ subgraphStmt
54+
/ inlineAttrStmt
55+
/ nodeStmt
56+
57+
attrStmt
58+
= type:(graph / node /edge) _* attrs:attrList {
59+
return { type: "attr", attrType: type, attrs: attrs || {}};
60+
}
61+
62+
inlineAttrStmt
63+
= k:id _* '=' _* v:id {
64+
var attrs = {};
65+
attrs[k] = v;
66+
return { type: "inlineAttr", attrs: attrs };
67+
}
68+
69+
nodeStmt
70+
= id:nodeId _* attrs:attrList? { return {type: "node", id: id, attrs: attrs || {}}; }
71+
72+
edgeStmt
73+
= lhs:(nodeIdOrSubgraph) _* rhs:edgeRHS _* attrs:attrList? {
74+
var elems = [lhs];
75+
for (var i = 0; i < rhs.length; ++i) {
76+
elems.push(rhs[i]);
77+
}
78+
return { type: "edge", elems: elems, attrs: attrs || {} };
79+
}
80+
81+
subgraphStmt
82+
= id:(subgraph _* (id _*)?)? '{' _* stmts:stmtList? _* '}' {
83+
id = (id && id[2]) || [];
84+
return { type: "subgraph", id: id[0], stmts: stmts };
85+
}
86+
87+
attrList
88+
= first:attrListBlock rest:(_* attrListBlock)* {
89+
var result = first;
90+
for (var i = 0; i < rest.length; ++i) {
91+
merge(result, rest[i][1]);
92+
}
93+
return result;
94+
}
95+
96+
attrListBlock
97+
= '[' _* aList:aList? _* ']' { return aList; }
98+
99+
aList
100+
= first:idDef rest:(_* ','? _* idDef)* {
101+
var result = first;
102+
for (var i = 0; i < rest.length; ++i) {
103+
_.merge(result, rest[i][3]);
104+
}
105+
return result;
106+
}
107+
108+
edgeRHS
109+
= ("--" !{ return directed; } / "->" &{ return directed; }) _* rhs:(nodeIdOrSubgraph) _* rest:edgeRHS? {
110+
var result = [rhs];
111+
if (rest) {
112+
for (var i = 0; i < rest.length; ++i) {
113+
result.push(rest[i]);
114+
}
115+
}
116+
return result;
117+
}
118+
119+
idDef
120+
= k:id v:(_* '=' _* id)? {
121+
var result = {};
122+
result[k] = v[3];
123+
return result;
124+
}
125+
126+
nodeIdOrSubgraph
127+
= subgraphStmt
128+
/ id:nodeId { return { type: "node", id: id, attrs: {} }; }
129+
130+
nodeId
131+
= id:id _* port? { return id; }
132+
133+
port
134+
= ':' _* id _* (':' _* compassPt)?
135+
136+
compassPt
137+
= "ne" / "se" / "sw" / "nw" / "n" / "e" / "s" / "w" / "c" / "_"
138+
139+
id "identifier"
140+
= fst:[a-zA-Z\u0200-\u0377_] rest:[a-zA-Z\u0200-\u0377_0-9]* { return fst + rest.join(""); }
141+
/ sign:'-'? dot:'.' after:[0-9]+ {
142+
return (sign || "") + dot + after.join("");
143+
}
144+
/ sign:'-'? before:[0-9]+ after:('.' [0-9]*)? {
145+
return (sign || "") + before.join("") + (after ? after[0] : "") + (after ? after[1].join("") : "");
146+
}
147+
/ '"' id:("\\\"" { return '"'; } / "\\" ch:[^"] { return "\\" + ch; } / [^"])* '"' {
148+
return id.join("");
149+
}
150+
151+
node = k:"node"i { return k.toLowerCase(); }
152+
edge = k:"edge"i { return k.toLowerCase(); }
153+
graph = k:"graph"i { return k.toLowerCase(); }
154+
digraph = k:"digraph"i { return k.toLowerCase(); }
155+
subgraph = k:"subgraph"i { return k.toLowerCase(); }
156+
strict = k:"strict"i { return k.toLowerCase(); }
157+
158+
graphType
159+
= graph:graph / graph:digraph {
160+
directed = graph === "digraph";
161+
return graph;
162+
}
163+
164+
whitespace "whitespace"
165+
= [ \t\r\n]+
166+
167+
comment "comment"
168+
= "//" ([^\n])*
169+
/ "/*" (!"*/" .)* "*/"
170+
171+
_
172+
= whitespace
173+
/ comment

package.json

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,17 @@
55
"main": "index.js",
66
"scripts": {
77
"test": "mocha test/*.js",
8-
"build": "pegjs --format globals --export-var d3dot grammar/dot.pegjs ",
8+
"build": "pegjs --format globals --export-var d3dotparser1 --output src/dot-parser.js grammar/dot.pegjs; rollup -c",
9+
"prepublish": "rollup -c && uglifyjs build/d3-dot-graph.js -c negate_iife=false -m -o build/d3-dot-graph.min.js",
910
"start": "npm run build"
1011
},
11-
,
1212
"keywords": [
1313
"dot",
1414
"graphviz",
1515
"d3",
1616
"graph"
1717
],
18-
"repository": {
18+
"repository": {
1919
"type": "git",
2020
"url": "git+https://github.com/gmamaladze/d3-dot-graph.git"
2121
},
@@ -25,5 +25,9 @@
2525
"url": "https://github.com/gmamaladze/d3-dot-graph/issues"
2626
},
2727
"homepage": "https://github.com/gmamaladze/d3-dot-graph#readme",
28-
"dependencies": {}
28+
"dependencies": {
29+
"pegjs": "^0.10.0",
30+
"rollup": "^0.49.2",
31+
"rollup-watch": "^4.3.1"
32+
}
2933
}

rollup.config.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default {
2+
input: "src/index.js",
3+
name: "d3dot",
4+
context: "window",
5+
output: {
6+
format: "umd",
7+
file: "build/d3-dot-graph.js"
8+
}
9+
};

0 commit comments

Comments
 (0)