Donuts

Hover a slice. Values come from the sheet's ages, location, gender rows.

Copy<vc-donut chart="ages" heading="Ages"></vc-donut>

Bars

Sheet rows: why. Options: heading (omit for none), labels="below|above", label-align="left|center|right", value-position="top|center|bottom".

Copy<vc-bars chart="why"></vc-bars>

Stats

Sheet rows: reach. One tag per number. fit="true" fills the container width; align="left|center|right".

Copy<vc-stat chart="reach" item="reach_1"></vc-stat>

Coverage table

Sheet rows: coverage (value = reach, value2 = AVE). Total row is calculated.

Headings can live in the sheet instead: add coverage rows with ID head1, head2, head3, total (Label = title, Note = sub-title) and use just <vc-table chart="coverage">. UTBS does this.

Copy<vc-table chart="coverage" head1="Reach" sub1="Unique Monthly Views via SimilarWeb" head2="Total AVE" sub2="Ad Value Equivalency" total-label="Fall '25 Total"></vc-table>

Platforms beyond editorials

Sheet rows: platforms. The note column is the group (Email Database / Social / Experiential). Builds itself: logo, rails, arrows, icons, counting numbers.

Copy<vc-orgchart chart="platforms" logo-src="https://www.crssdfest.com/wp-content/uploads/2023/09/cropped-Snakes_ring-inverse-fill.png"></vc-orgchart>

Setup

Sheet columns: chart | label | value | color | value2 | format | note | suffix (only the first three are required).

Copy<script src="https://vc-charts.netlify.app/vc-charts.js" defer></script>