This simple app shows how to make a derby component out of a reusable d3 visualization that makes use of behaviors.
The visualization was ported from the canonical zoom example, with some changes to handle being redrawn. A great introduction to this process can be found in the general update pattern tutorials.
To appease derby and racer, you'll need redis and MongoDB installed. If they are both available locally on default ports, this app will work pretty much out of the box. I was able to follow the instructions for deploying to Heroku, but given the current security posture of this app, this might not be A Good Idea.
All other dependencies are handled by npm
. Note that the derby stack is under
active development at this point, and this repo is just a demo... so it might
break at any time.
npm install
npm start
Navigate to the local development server.
There is no authn/authz whatsoever on the app, nor is there any validation of any of the data. As derby, racer and ShareJS mature, it should be possible to add both of these.
Not much was modified from the skeleton created by derby bare
, aside from
work done in the ui
component itself, which could be mostly modified to suit
your needs.
- /ui/behaviors/index.js: basically the controller, this module knows how to work with both the model and high-level d3 calls
- /ui/behaviors/render.js: the view, which passes information translated from screen coordinates back to the model
- /ui/behaviors/index.html: really just a shim
- /ui/behaviors/index.styl: styling for the svg and html wrappers... a little messy right now
- /lib/app/index.js: the controller
- /view/app/index.html: html wrapper
- /styles/app/index.styl: base styles
This code is made available as free software under the MIT License.