Realtime Visualizations w/ D3 and Backbone. CodeFlower Source code visualization. This experiment visualizes source repositories using an interactive tree.
Purpose Did you ever dive into an existing project and wish you could have a bird's eye view of the whole code? CodeFlowers tries to answer these needs. Usage To create a CodeFlower, include the CodeFlower.js file together with d3.js, just like in this page. Var myFlower = new CodeFlower("#visualization", 300, 200); myflower.update(jsonData); Input data format The jsonData format taken as input to update() is extremely simple. Generating JSON for a project It's easy to generate loc metrics for any project, whatever the language. Licence. Home · metormote/iopctrl Wiki. More Data Visualization Libraries Based on D3.JS - Mike McDearmon. There are a lot of ways to visualize data on the Web (with more emerging every day), but the flexibility, versatility, and energized development community surrounding D3.js makes it a great option to explore.
The following list of D3 plugins, extensions, and applications below is by no means comprehensive, but oughta be enough to keep you busy for a while. If you’re just getting your feet wet with D3.js, here are some great learning resources to get you acclimated:D3 for mere mortals: Great introductory lessons for those starting from scratch.Try D3 Now: Another great resource for learning about core D3 concepts.Data-Driven Documents (paper): An academic article by Mike Bostock with loads of footnotes.Learning D3, Scott Becker: A quick and effective tutorial series to get yourself up and running.Dashing D3: A very thorough tutorial series covering a LOT more than just D3.Interactive Data Visualization for the Web is a fantastic book by Scott Murray. Cubism.js. Time Series Visualization foo7.6 bar−6.2 foo + bar1.4 foo - bar14 Cubism.js is a D3 plugin for visualizing time series.
Scalable Cubism fetches time series data incrementally: after the initial display, Cubism reduces server load by polling only the most recent values. Effective Cubism also scales in terms of perception: small multiples aligned by time facilitate rapid comparison. Area (120px)7.6 Area (30px)7.6 In contrast, horizon charts reduce vertical space without losing resolution. Horizon, 1-band (120px)7.6. Gallery · mbostock/d3 Wiki. Wiki ▸ Gallery Welcome to the D3 gallery!