https://github.com/tgdwyer/WebCola

Javascript constraint-based graph layout
https://github.com/tgdwyer/WebCola

Last synced: 9 days ago
JSON representation

Javascript constraint-based graph layout

• Host: GitHub
• URL: https://github.com/tgdwyer/WebCola
• Owner: tgdwyer
• License: mit
• Created: 2013-07-10T05:42:18.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2023-07-19T00:21:04.000Z (over 1 year ago)
• Last Synced: 2024-10-29T15:03:48.227Z (10 days ago)
• Language: TypeScript
• Homepage: http://marvl.infotech.monash.edu/webcola/
• Size: 40.1 MB
• Stars: 2,018
• Watchers: 70
• Forks: 258
• Open Issues: 107
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-d3 - WebCola - Layout for graph visualization and exploration (Charts)
• awesome-d3 - WebCola - Layout for graph visualization and exploration (Charts)
• awesome-frontend-graph-library - cola.js - quality graph visualization and exploration using D3.js and other web-based graphics libraries. (Layout Algorithm)
• awesome-d3 - WebCola - Layout for graph visualization and exploration (Charts)
• awesome-starred - tgdwyer/WebCola - Javascript constraint-based graph layout (others)

README

        
WebCola [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

=======

JavaScript constraint based layout for high-quality graph visualization and exploration 

using D3.js and other web-based graphics libraries.



  

    

  

  

    

  



[Homepage with code and more examples](http://marvl.infotech.monash.edu/webcola)

Note: While D3 adaptor supports both D3 v3 and D3 v4, WebCoLa's interface is styled like D3 v3. Follow the setup in our homepage for more details.

Installation

------------

#### Browser:

```html

```

The minified version can also be accessed from [jsDelivr](https://cdn.jsdelivr.net/gh/tgdwyer/WebCola/WebCola/cola.min.js).

#### Npm:

	

	npm install webcola --save

You can also install it through npm by first adding it to `package.json`:

    "dependencies": {

      "webcola": "latest"

    }

Then by running `npm install`.

#### Bower:

	bower install webcola --save

If you use TypeScript, you can get complete TypeScript definitions by installing [tsd 0.6](https://github.com/DefinitelyTyped/tsd) and running `tsd link`.

Building

--------

*Linux/Mac/Windows Command Line:*

 - install [node.js](http://nodejs.org)

 - from the WebCola directory:

        npm install

 - build, minify and test:

        npm run build

        npm run test

This creates the `cola.js` and `cola.min.js` files in the `dist` directory and runs tests.

*Visual Studio:*

 - get the [typescript plugin](http://www.typescriptlang.org/#Download)

 - open webcola.sln

Running

-------

*Linux/Mac/Windows Command Line:*

Install the Node.js http-server module:

    npm install -g http-server

After installing http-server, we can serve out the example content in the WebCola directory.

    npm run website

    http-server website

The default configuration of http-server will serve the exampes on [http://localhost:8080](http://localhost:8080).