https://github.com/michaelcurrin/network-graphs
The easy way to visualize CSV data as a network graph
https://github.com/michaelcurrin/network-graphs
d3 d3-visualization dataviz force-directed-graph javascript network-graph
Last synced: about 1 year ago
JSON representation
The easy way to visualize CSV data as a network graph
- Host: GitHub
- URL: https://github.com/michaelcurrin/network-graphs
- Owner: MichaelCurrin
- License: mit
- Created: 2019-03-23T18:34:05.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2020-12-20T07:58:44.000Z (over 5 years ago)
- Last Synced: 2025-03-25T20:21:38.822Z (about 1 year ago)
- Topics: d3, d3-visualization, dataviz, force-directed-graph, javascript, network-graph
- Language: JavaScript
- Homepage: https://michaelcurrin.github.io/network-graphs/
- Size: 31.3 KB
- Stars: 5
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Network Graphs
> The easy way to visualize CSV data as a network graph
Create an animated force-directed network graph in the browser, consisting of nodes with connecting arrows, text labels and color. The nodes are force-directed i.e. they respond to clicking and dragging mouse actions.
[](https://michaelcurrin.github.io/network-graphs/)
## Purpose
I've built this project as a wrapper on the D3 library which allows me to easily point to a CSV dataset, configure some parameters and then show the visualization in the browser.
The reason I made it is that I have a couple of personal projects which have data which is ideal for making network graphs. But this type of graph is not often found in the dashboard tools I've used. Although there is one in Google Fusion Tables which reads CSV data and can be easily configured, unfortunately Google is retiring that system.
## Installation
Clone the repo.
There are no dependencies to install.
## Usage
Start a server in the root of the project.
If you have Python 3 installed, that's a good choice. Here's a shortcut, using [Makefile](/Makefile).
```sh
$ make serve
```
## Deploy
> Setup the site on GH Pages
1. Fork the project.
2. Go to Settings of your repo.
3. Setup _GitHub Pages_ using `master` and project root.
4. Wait for your build to complete in the Environment tab on the repo main page.
5. Then click _View Deployment_ to find your URL.
## Resources
I found these code samples and they have been extremely useful.
- [Force-directed graph with arrows](http://bl.ocks.org/jhb/5955887)
- [Process CSV data](https://bl.ocks.org/mbostock/2949937)
## License
Released under [MIT](/LICENSE).