Renderer: Canvas
Module: vizart-hierarchy
Data: Wanli University Library book borrowing records. Bars in each circle represents borrowings from schools of Wanli university
Doc: API
import { circlePack } from 'vizart-hierarchy'; import 'vizart-hierarchy/dist/vizart-hierarchy.css'; const options = { data: { x: { name: 'School', type: 'string', accessor: 'MX'}, y: { name: 'Book Borrowings', type: 'number', accessor: 'MY'}, }, plots: { titleFn: (d)=> { return 'Total: ' + d + ' borrowings'} } }; let chart = VizArtHierarchy.circlePack('#chart', options); $.getJSON('./data/library.json', function(data){ chart.render(data); chart.createLegend('#legendCircles'); });