Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 76 lines (43 sloc) 2.888 kB
8b7131f @Munter Added some nice badges to README
authored
1 AssetViz
2 ========
3 [![NPM version](https://badge.fury.io/js/assetviz.svg)](http://badge.fury.io/js/assetviz)
4 [![Dependency Status](https://david-dm.org/Munter/assetviz.svg)](https://david-dm.org/Munter/assetviz)
16e16b8 @Munter Added README and LICENSE
authored
5
55351cb @Munter Update README.md
authored
6 Assetviz is a web application code base visualization tool.
7 Generate a self encapsulated html-file with a force directed graph representing the assets in your project and their relations.
8
9 As an added bonus this also works with any web page url as well.
16e16b8 @Munter Added README and LICENSE
authored
10
11 ![Example](https://raw.github.com/munter/assetviz/master/example/assetviz.png)
12
13 ## Installation
14
15 ```
16 npm install assetviz
17 ```
18
19 If you get installation errors for node-canvas, don't despair. It's an optional dependency used by [Assetgraph](https://github.com/One-com/assetgraph) to do some other cool stuff that isn't used in AssetViz.
20
21 ## Usage
22
23
24 ```
1818fe7 @Munter Added --output switch to define output filename. '-' pipes output to …
authored
25 $ assetviz [-h] [-v] [-r /path/to/webroot] [-o output.html] /path/to/webroot/index.html
16e16b8 @Munter Added README and LICENSE
authored
26 $ google-chrome assetviz.html
27 ```
28
29 The command line tool outputs an html-file called `assetviz.html` in the current working directory.
30
31 ### Arguments:
32
33 - Any number of html.files
34 - A path, assetviz will look for `index.html` in that path
35 - A minimatch pattern like `path/to/webroot/**/*.html`
36 - An URL *(yes, you read that right)*
37
38 ### Parameters:
39
40 **-h** : **Help**
41
992967b @Munter Update README.md
authored
42 **-o** : **Output**. The file name to output to. `-` pipes to stdout. Defaults to `./assetviz.html` if undefined.
16e16b8 @Munter Added README and LICENSE
authored
43
44 **-r** : **Root**. Tells AssetViz which directory to treat as the web root. Only useful if you are graphing an html-file that has relations outside its own directory.
45
1818fe7 @Munter Added --output switch to define output filename. '-' pipes output to …
authored
46 **-v** : **Verbose**. Includes inline assets in the output graph. If unset only inline elements relevant to describe file relations will be shown.
47
16e16b8 @Munter Added README and LICENSE
authored
48 ## AssetViz output
49
50 The outputted graph html-file is called `assetviz.html`. It is a self contained file with no external dependencies, so you can upload it anywhere, email it or do whatever you want with it without worrying about dependencies or being online to view.
51
52 While viewing the graph you can use the mousewheel to zoom and click+drag to pan (google maps style navigation).
53
54
55 ## Future roadmap
56
57 - Improve text rendering
58 - Highlight relations on hover
59 - Relation direction with arrow heads
60 - Merge visualization template with [grunt-dependencygraph](https://github.com/auchenberg/grunt-dependencygraph)
61
62
63 ## Thanks to
64
65 [Andreas Lind Petersen](https://github.com/papandreou) for all his wonderful work on [Assetgraph](https://github.com/One-com/assetgraph). We have barely scratched the surface of the potential this project has.
66 [Kenneth Auchenberg](https://github.com/auchenberg) for his visualization work and revitalization of the source code visualization dream.
67
68
69 ## License
70
71 [MIT](https://raw.github.com/munter/assetviz/master/LICENSE.txt)
59686f0 @bitdeli-chef Add a Bitdeli badge to README
bitdeli-chef authored
72
73
74 [![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/Munter/assetviz/trend.png)](https://bitdeli.com/free "Bitdeli Badge")
75
Something went wrong with that request. Please try again.