Jay Taylor's notes

back to listing index

dc.js - Dimensional Charting Javascript Library

[web search]
Original source (nickqizhu.github.io)
Tags: javascript d3 charting visualization nickqizhu.github.io
Clipped on: 2014-05-16

dc.js - Dimensional Charting Javascript Library

dc.js is a javascript charting library with native crossfilter support and allowing highly efficient exploration on large multi-dimensional dataset (inspired by crossfilter's demo). It leverages d3 engine to render charts in css friendly svg format. Charts rendered using dc.js are naturally data driven and reactive therefore providing instant feedback on user's interaction. The main objective of this project is to provide an easy yet powerful javascript library which can be utilized to perform data visualization and analysis in browser as well as on mobile device.

Version Status

This page is running version: v2.0.0-dev. The lastest stable version is 1.6.0.

Getting Started

Take a look at the annotated source to the Nasdaq Example that is shown below.

For more information and assistance

  • Release Notes
  • Wiki - Additional examples
  • Roadmap - Future Plans
  • Stable API - Documentation
  • Master API - Bleeding Edge
  • Mailing List - The users group and best place to post support questions.
  • Issues - Please post any issues you have found or enhancements you would like to see. Usage questions should be directed to the mailing list

Fork me @ https://github.com/NickQiZhu/dc.js and also feel free to report any issue or request a new type of chart to be included in the next release.

Examples

The following charts provide a live example of dc.js used against Nasdaq 100 index for the last 27 years. (You can run this example completely off-line). Although it is just an example, using it you can already ask some quite interesting questions. If I am going to gamble whether Nasdaq 100 will gain or lose tomorrow what is my chance? Is Friday or Monday the most unlucky day for investors? Is spring better than winter to invest? Can you find the outliers? When did the outliers occur? Public data source: PiTrading.com.

Try it out or checkout other examples.

Nasdaq 100 Index 1985/11/01-2012/06/29

Yearly Performance (radius: fluctuation/index ratio, color: gain/loss)
1986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120121985-2,000-1,500-1,000-50005001,0001,5002,000Index Gain-150%-100%-50%0%50%100%150%Index Gain %
Days by Gain/Loss
Gain(53%)Loss(46%)
Quarters
Q1Q2Q3Q4
Day of Week
05001,000MonTueWedThuFri
Days by Fluctuation(%)
-25%-20%-15%-10%-5%0%5%10%15%20%25%05001,0001,5002,000
Monthly Index Abs Move & Volume/500,000 Chart
1986198819901992199419961998200020022004200620082010201201,0002,0003,0004,0005,0006,0007,000Monthly Index AverageMonthly Index Move
19861988199019921994199619982000200220042006200820102012

select a time range to zoom in

6,724 selected out of 6,724 records | Reset All
Date Open Close Change Volume
2012/06
06/18/20122570.982592.5221.5415407330
06/19/20122606.432620.8314.4017714840
06/20/20122625.002623.33-1.6715045430
06/21/20122619.982556.96-63.0217211650
06/22/20122562.282585.5323.2522237210
06/25/20122562.982533.54-29.4414373980
06/26/20122541.212549.848.6315455900
06/27/20122558.672565.536.8615713580
06/28/20122565.532536.65-28.8816722440
06/29/20122566.842615.7248.8818325310
Image (Asset 1/1) alt=