All contacts of one account — gray individual lines, red average line, Avg / Actual NPS toggle. · ← Contact view
<script src="flightpath-widget.js"></script>
<link rel="stylesheet" href="flightpath-themes.css"> <!-- optional -->
<div id="my-widget" class="fp-theme-midnight"></div>
<script>
FlightpathChart.renderAccount(document.getElementById('my-widget'), data);
FlightpathChart.renderTable(document.getElementById('my-table'), data);
</script>
data shape: { account: {name, url}, contacts: [ { contact: {name, url}, points: [...] } ] }
— each contact's points[] uses the same fields as the contact widget.
"Average NPS" plots the mean 0–10 score per time bucket over the individual contact lines,
with non-responses shown as ×'s. "Actual NPS" plots (% promoters − % detractors) per time
bucket on a −100…+100 scale, with year tick marks; a bucket with no responses shows an ×
on the zero line. The second dropdown sets the bucket: month, quarter, half-year or year.
The widget fills whatever container width it is given and redraws itself on resize.
All colors are CSS variables — see flightpath-themes.css.