Skip to content

Commit 6c64652

Browse files
eismaneisman
committed
Initial commit
0 parents  commit 6c64652

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+4650
-0
lines changed

‎.gitignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.sass-cache
2+
.tmp
3+
coverage
4+
node_modules
5+
target

‎.jshintrc

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"curly": true,
3+
"eqeqeq": true,
4+
"immed": true,
5+
"latedef": true,
6+
"newcap": true,
7+
"noarg": true,
8+
"sub": true,
9+
"undef": true,
10+
"boss": true,
11+
"eqnull": true,
12+
"node": true,
13+
"globals" : {
14+
/* MOCHA */
15+
"describe" : false,
16+
"it" : false,
17+
"before" : false,
18+
"beforeEach" : false,
19+
"after" : false,
20+
"afterEach" : false
21+
}
22+
}

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2016 Eduardo Eisman
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+100
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
# neo4jd3.js
2+
3+
[Neo4j](https://github.com/neo4j) graph visualization using [D3.js](https://github.com/d3/d3).
4+
5+
## Features
6+
7+
* Neo4j's JSON graph format.
8+
* Force simulation.
9+
* Info panel that shows nodes and relationships information on hover.
10+
* Click callbacks.
11+
* Custom node colors by node type.
12+
* [Font Awesome](http://fontawesome.io/) icon nodes.
13+
* Relationship auto-orientation.
14+
* Zoom, pan, auto fit.
15+
* Compatible with D3.js v4.
16+
17+
## API
18+
19+
```javascript
20+
new neo4jd3(selector, options);
21+
```
22+
23+
### Options
24+
25+
| Parameter | Type | Description |
26+
| --------- | ---- | ----------- |
27+
| **dataUrl** | *string* | URL of the endpoint that serves the graph in JSON format. |
28+
| **icons** | *object* | Map node labels to [Font Awesome icons](http://fontawesome.io/icons).<br>Example:<br>`{`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'Address': 'home',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'BirthDate': 'calendar-o',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'EncryptedPassword': 'asterisk',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'NameSignature': 'pencil',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'Phone': 'phone',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'Player': 'user',`<br>&nbsp;&nbsp;&nbsp;&nbsp;`'SecurityChallengeAnswer': 'comment'`<br>`}`. |
29+
| **infoPanel** | *boolean* | Show the information panel: `true`, `false`. Default: `true`. |
30+
| **minCollision** | *int* | Minimum distance between nodes. Default: 2 * *nodeRadius*. |
31+
| **nodeRadius** | *int* | Radius of nodes. Default: 25. |
32+
| **onNodeDoubleClick** | *function* | Callback function to be executed when the user double clicks a node. |
33+
| **onRelationshipDoubleClick** | *function* | Callback function to be executed when the user double clicks a relationship. |
34+
| **zoomFit** | *boolean* | Adjust the graph to the container once it has been loaded: `true`, `false`. Default: `false`. |
35+
36+
### Example
37+
38+
Live example @ [https://eisman.github.io/neo4jd3/](https://eisman.github.io/neo4jd3/)
39+
40+
```javascript
41+
var neo4jd3 = new Neo4jd3('#neo4jd3', {
42+
dataUrl: 'json/data.json',
43+
icons: {
44+
'Address': 'home',
45+
'Api': 'gear',
46+
'BirthDate': 'birthday-cake',
47+
'Cookie': 'paw',
48+
'CreditCard': 'credit-card',
49+
'Device': 'laptop',
50+
'Email': 'at',
51+
'Git': 'git',
52+
'Github': 'github',
53+
'icons': 'font-awesome',
54+
'Ip': 'map-marker',
55+
'Issues': 'exclamation-circle',
56+
'Language': 'language',
57+
'Options': 'sliders',
58+
'Password': 'asterisk',
59+
'Phone': 'phone',
60+
'Project': 'folder-open',
61+
'SecurityChallengeAnswer': 'commenting',
62+
'User': 'user',
63+
'zoomFit': 'arrows-alt',
64+
'zoomIn': 'search-plus',
65+
'zoomOut': 'search-minus'
66+
},
67+
minCollision: 60,
68+
nodeRadius: 25,
69+
onNodeDoubleClick: function(node) {
70+
console.log('double click on node: ' + JSON.stringify(node));
71+
72+
switch(node.labels[0]) {
73+
case 'Icons':
74+
// TODO
75+
neo4jd3.icons(!neo4jd3.icons());
76+
break;
77+
case 'ZoomIn':
78+
// TODO
79+
neo4jd3.zoomIn();
80+
break;
81+
case 'ZoomOut':
82+
// TODO
83+
neo4jd3.zoomOut();
84+
break;
85+
}
86+
},
87+
onRelationshipDoubleClick: function(relationship) {
88+
console.log('double click on relationship: ' + JSON.stringify(relationship));
89+
},
90+
zoomFit: true
91+
});
92+
```
93+
94+
## What's next?
95+
96+
* More than one relationship between two nodes.
97+
98+
## Copyright and license
99+
100+
Code and documentation copyright 2016 the author. Code released under the [MIT license](LICENSE). Docs released under [Creative Commons](docs/LICENSE).

‎dist/css/neo4jd3.css

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
* {
2+
margin: 0px;
3+
padding: 0px;
4+
}
5+
6+
body {
7+
font: 13px 'Helvetica Neue',Helvetica,Arial,sans-serif;
8+
font-size: 20px;
9+
}
10+
11+
.neo4jd3-graph {
12+
border: 1px solid #ddd;
13+
border-radius: 5px;
14+
}
15+
16+
.neo4jd3-info {
17+
font-size: 16px;
18+
padding: 10px;
19+
position: absolute;
20+
}
21+
.neo4jd3-info a.btn {
22+
margin-left: 5px;
23+
margin-top: 5px;
24+
opacity: 1;
25+
}
26+
.neo4jd3-info a.info {
27+
background-color: #a5abb6;
28+
border: 1px solid #9aa1ac;
29+
color: white;
30+
}
31+
32+
.node .outline {
33+
cursor: pointer;
34+
fill: #a5abb6;
35+
pointer-events: all;
36+
stroke: #9aa1ac;
37+
stroke-width: 2px;
38+
}
39+
.node .ring {
40+
fill: none;
41+
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
42+
filter: alpha(opacity=0);
43+
opacity: 0;
44+
stroke: #6ac6ff;
45+
stroke-width: 8px;
46+
}
47+
48+
.node.selected .ring,
49+
.node:hover .ring {
50+
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=30)';
51+
filter: alpha(opacity=30);
52+
opacity: .3;
53+
}
54+
55+
.node-text.node-icon {
56+
font-family: FontAwesome;
57+
}
58+
59+
.relationship {
60+
cursor: default;
61+
}
62+
.relationship line {
63+
stroke: #aaa;
64+
}
65+
.relationship .outline {
66+
cursor: default;
67+
}
68+
.relationship .overlay {
69+
cursor: default;
70+
fill: #6ac6ff;
71+
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
72+
filter: alpha(opacity=0);
73+
opacity: 0;
74+
}
75+
.relationship text {
76+
cursor: default;
77+
}
78+
79+
.relationship.selected .overlay,
80+
.relationship:hover .overlay {
81+
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=30)';
82+
filter: alpha(opacity=30);
83+
opacity: .3;
84+
}
85+
86+
svg {
87+
cursor: move;
88+
}

‎dist/css/neo4jd3.min.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)