-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
3 additions
and
80 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,80 +1,5 @@ | ||
| h1. A simple way to get started with data visualizations using d3 and coffeescript | ||
| This is an attempt at a partial recreation of the amazing <a href="http://www.textarc.org/">TextArc</a> text visualization by W. Bradford Paley. | ||
|
|
||
| h2. Usage | ||
|
|
||
| h3. First Clone the Repository | ||
|
|
||
| <pre> | ||
| git clone git@github.com:vlandham/vis.git | ||
| cd vis | ||
| </pre> | ||
|
|
||
| h3. You might consider creating a new branch for your Vis | ||
|
|
||
| <pre> | ||
| git checkout -b interesting_new_bar_chart | ||
| </pre> | ||
|
|
||
| h3. View built in example | ||
|
|
||
| You can start up a local webserver by using python's simple server: | ||
|
|
||
| <pre> | ||
| python -m SimpleHTTPServer 3000 | ||
| </pre> | ||
|
|
||
|
|
||
| or @thin@ in ruby | ||
|
|
||
| <pre> | ||
| thin start | ||
| # might have to run 'bundle install' first | ||
| </pre> | ||
|
|
||
| Now go to "http://0.0.0.0:3000":http://0.0.0.0:3000/ | ||
|
|
||
| and you have a basic visualization | ||
|
|
||
| h3. Start Coding | ||
|
|
||
| Open up @coffee/vis.coffee@ and start modifying the built in visualization to fit your needs. | ||
|
|
||
| h2. Folder Organization | ||
|
|
||
| * @/@ | ||
| ** main vis area | ||
| * @/index.html@ | ||
| ** main page for your visualization. Loads coffeescript and javascript files. | ||
| * @/coffee/@ | ||
| ** coffeescript files. Example @vis.coffee@. | ||
| * @/data/@ | ||
| ** data dump for @.csv@ and @.json@ files and other data files your vis uses. | ||
| * @/js/@ | ||
| ** javascript goes here. JS Libraries in @libs@ directory | ||
| * @/css/@ | ||
| ** put your stylesheets in here | ||
| * @/img/@ | ||
| ** put your images in here | ||
| * @/tools/@ | ||
| ** put your helper scripts / data manipulation tools here | ||
|
|
||
| h2. Requirments | ||
|
|
||
| To startup the server, you either need @python@, or a bunch of @ruby@ gems (should be simplified in the future). | ||
|
|
||
| Run @bundle install@ to get the gems needed. Gems listed in the Gemfile | ||
|
|
||
| h2. Contents | ||
|
|
||
| h3. Twitter Bootstrap | ||
|
|
||
| h3. d3.js | ||
|
|
||
| h3. Raphael | ||
|
|
||
| h3. coffee-script.js | ||
|
|
||
| h3. jQuery | ||
|
|
||
| h3. Leaflet | ||
| This is meant as a tribute to the pioneering work, and as an experiment in how one might implement such interactive visualizations using current open web technologies. | ||
|
|
||
| This version is implemented completely in the browser using D3.js |
Oops, something went wrong.