row

• Quick Reference
• API

Quick Reference

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

const options = {
	chart: {
		height: 420,
		margin: { left: 30, right: 30, top: 10, bottom: 30 }
	},

	data: {
		x: { accessor: 'age', type: 'number', name: 'Age' },
		y: [ { accessor: 'income', type: 'number', name: 'Monthly Income' } ]
	},
};

const fakeData = [
	{ age: 19, income: 9 }
]

const chart = row('#chart', options);
chart.render(fakeData);

API

Default options:

const DefaultOpt = {
  chart: { type: 'row' },
  plots: {
    barLabel: {
      enabled: false,
      color: 'black',
    },
    metricLabel: {
      enabled: false,
      color: 'black',
      offset: 10,
    },

    enableMiniBar: true,
    miniBarWidth: 50,
  },
};

enableMiniBar

Display mini bar?

miniBarWidth

Mini bar width, will take effect only when enableMiniBar is true

barLabel.enabled

enable the dimension label within bars or not.

barLabel.color

color of bar label

metricLabel.enabled

display metric label on top of bars?

metricLabel.color

color of metric label

metricLabel.offset

Metric label offset against bar top