D3FC

Components to rapidly build fast, highly customisable, interactive charts with D3

Source | Issues | Documentation

Building a bespoke chart from scratch is a big undertaking. Luckily D3 is an excellent library for providing the low-level building blocks required e.g. scales, behaviours, paths. However, it's rare to have the luxury of starting from such a fundamental level, when higher-level charting libraries exist.

D3FC exists to plug that gap. To provide higher-level components, with a compositional approach, that can act as a higher-level starting point. This allows you to extensively style the components, augment them with novel behaviours and make fundamental changes by dropping down to their sub-components.

The library also provides low-level components in a few functional areas that D3 doesn't cover e.g. label layout optimisation, rendering surface elements and WebGL components.

Featured Examples

Bubble Chart Brush Zoom Chart Zoom Stacked Bar Chart Simple Chart Streaming Chart Building a Chart Transitions Sample Technical Indicator MACD Label Layout Diamonds SVG, Webgl and Canvas Chart Earth and Mars Boxplot Label Layout Example Bar Chart Race Small Multiples London Marathon 2016 Pacing vs. Finish Time Interactive Small Multiples Discontinuous Axis

Other Examples

Axis Label Offset Technical Indicator Stochastic Oscillator Series SVG Auto Bandwidth Series SVG Area Series Webgl Candlestick Series Webgl Bar Series SVG Candlestick Element Bespoke Chart Layout Annotation SVG Band Axis Tick Arguments Series Canvas Repeat Annotation SVG Crosshair Series Canvas Decorate Append Chart Cartesian Second Axis Series SVG Bar Technical Indicator Bollinger Bands SVG Series Canvas Box Plot Series Canvas OHLC WebGL Context Lost Series SVG Decorate Append Technical Indicator Relative Strength Index Series SVG Box Plot Series Webgl Line Series Canvas Area Series Canvas Multi Annotation Gridline Transition Technical Indicator Elder Ray Series Canvas Grouped Series Canvas Point Technical Indicator Force Index Annotation Canvas Line Series SVG Grouped Axis Center Annotation SVG Gridline Series Canvas Heatmap Axis Rotate Auto Axis Color Chart Cartesian Move Axis Series Canvas Stacked Series SVG Repeat Chart Cartesian Ordinal Annotation Canvas Crosshair Series Canvas Bar Series Canvas Auto Bandwidth Series SVG Heatmap Series SVG Stacked Series SVG OHLC Idempotent Streaming Chart Series SVG Point Size Type Series Webgl Repeat Chart Cartesian Custom Axis Axis Transition Axis Offset Series SVG Decorate Annotation Canvas Band Series Canvas Candlestick WebGL With SVG Overlay Series Canvas Point Size Type Series Webgl Error Bar Series Webgl Area Series SVG Line Chart Cartesian Transition Axis Rotate Decorate Series Canvas Error Bar Series Webgl Stacked Series SVG Multi Series Webgl Multi Series Canvas Decorate Technical Indicator Bollinger Bands Canvas Series Webgl Point Annotation SVG Line Series SVG Point Series Canvas Line Chart Deprecated Series SVG Error Bar Series Webgl OHLC Series Webgl Box Plot Technical Indicator Envelope Annotation Canvas Gridline Axis Band Scale Series SVG Grouped Alternate