Stretched Chord

Unlike regular chord, Stretched Chord represents single direction path between entities. This work is based on Nadieh Bremer's Hacking a Chord Diagram to create a radial Sankey
Home / Demo / Stretched Chord
Stretched Chord

Renderer: SVG

Module: vizart-path

Data: Diamond Color, Clarity, Carat and Anatomy

Doc: API

import { strentchedChord } from 'vizart-path';
import 'vizart-path/dist/vizart-path.css';

const options = {
	chart: {
		margin: { left: 30, right: 30, top: 10, bottom: 30 }
	},
	data: {
		source: { name: 'Color', accessor: 'color' },
		target: { name: 'Clarity', accessor: 'clarity' },
		link: {name: 'Price', accessor: 'price'}
	},
	plots: {
		emptyPercent: 0.001,
		chordPadding: 0.0002
	}
};

const _data = ...
const _chart = strentchedChord('#chart', options);
_chart.render(_data);