Area

Home / Demo / Area
Area

Renderer: Canvas

Module: vizart-basic

Data: NASDAQ history 1985-2012, 6724 lines.

import { area } from 'vizart-basic';
import 'vizart-basic/dist/vizart-basic.css';

const options = {
		data: {
				x:  { name: 'date', type: 'date', accessor: 'date', format: '%m/%d/%Y'},
				y: [{ name: metricAccessor, type: 'number', accessor: metricAccessor}],
		},
		ordering: {
				accessor: 'date',
				direction: 'asc'
		},
		plots: {
				areaOpacity: 0.5,
				curve: 'basis',
				strokeWidth: 2,
				nodeRadius: 4,
				drawArea: true,
				showDots: false
		}
};

const chart = area('#chart', options);
d3.csv('assets/nasdaq1985-2012.csv', function(err, res){
	area.render(res);
});