<fundraising-chart>

The fundraising chart custom element is an attempt to simplify the process of repeatedly editing a chart in CUE over time by hiding most of the structure and styling in the Shadow DOM. It was created for The Fresno Bee Education Lab landing page.

EXAMPLE
Phase 1 goal Phase 2 Goal
<script async src="https://media.mcclatchy.com/labs/fundraising-chart.js"></script>
<fundraising-chart collected="246000" goal="600000">
  <chart-phase value="300000">Phase 1 goal</chart-phase>
  <chart-phase value="600000">Phase 2 Goal</chart-phase>
</fundraising-chart>
copy starter code