Poleโญ (Polestar) -- Alpha
WE NO LONGER PLAN TO MAINTAIN THIS PROJECT. PLEASE FOLLOW THE NEW VERSION OF VOYAGER WHICH SUPPORTS ALL INTERACTIONS IN POLESTAR
PoleStar is Tableau-style User Interface for visual analysis, building on top of Vega-Lite. Try our online demo. Also, be sure to check our related projects.
This project is an alpha software. We are working on improving its code and documentation.
If you are using Polestar for your project(s), please let us know what are you using it for by emailing us at Vega-Lite [at] cs.washington.edu. Feedbacks are also welcomed. If you find a bug or have a feature request, please create an issue.
Team
Polestar's development is led by Dominik Moritz, Kanit Wongsuphasawat, and Jeffrey Heer at the University of Washington Interactive Data Lab, in collaboration with UW eScience Institute and Tableau Research
Setup Instruction
Install Dependencies
Make sure you have node.js. (We recommend using homebrew and simply run brew install node
.)
cd
into your local clone of the repository, and install all the npm and bower dependencies (bower will auto-run when npm finishes):
cd polestar
npm install
Now you should have all dependencies and should be ready to work.
Running
You can run npm start
, which serves the site as well as running tests in the background.
If you edit any file, our gulp task runner should automatically refresh the browser and re-run tests.
To execute other tasks, either use the npm script aliases npm run lint
, npm test
, or npm run build
, or else install gulp globally with npm install -g gulp
and run the tasks directly from gulp.
Development Guide
Folder Structure
We try to follow Google's Angular Best Practice for Angular App Structure and use generator-gulp-angular to setup the project.
All source code are under src/
src/app/
contains our main classessrc/components
contains our other componentssrc/assets/images/
contains relevant imagessrc/data/
contains all data that we use in the applicationsrc/vendor
contains
@kanitw created gulp/gen.js
for help generating angular components.
For example, you can run gulp gen -d directiveName
and this would create all relevant files including the javascript file, the template file, the stylesheet file and the test spec.
Coding Style
We use jshint as our linter for coding in the project.
Stylesheets
We use sass as it is a better syntax for css.
Dependencies
Managing front-end dependencies with Bower requires the bower
package to be globally installed:
npm install -g bower
This project depends on Datalib for data processing, Vega-Lite as a formal model for visualization, and Vega-Lite-ui, which contains shared components between Polestar and Voyager.
If you plan to make changes to these dependencies and observe the changes without publishing / copying compiled libraries all the time, use bower link
.
In each of your dependency repository, run
cd path/to/dependency-repo
bower link
Then go to this project's directory and run
bower link datalib
bower link vega-lite
bower link vega-lite-ui
Now all the changes you make in each repo will be reflected in your Vega-Lite automatically.
Since bower uses the compiled main file, make sure that each repos is compiled everytime you run npm start
.
Otherwise, you will get errors for missing libraries.
Releasing / Github Pages
gh-pages
branch is for releasing a stable version.
gh-pages
should only contain the dist folder.
Use publish.sh
to:
- publish the current version to npm
- deploy the current branch to gh-pages and
- create a release tag for github and bower.
Acknowledgement
We used generator-gulp-angular for bootstraping our project.