quay/static/directives/ps-usage-graph.html

<div class="ps-usage-graph-element">
  Build Workers:
  <div class="realtime-area-chart"
       data="[data.build.job_total, data.build.running_total]"
       labels="['Queued Build Jobs', 'Running Build Jobs']"
       colors="['rgb(157, 194, 211)', 'rgb(56, 122, 163)']"
       counter="counter"></div>

  <div class="realtime-area-chart"
       data="[data.build.job_total, data.build.workers, data.build.running_local]"
       labels="['Queued Build Jobs', 'Build Workers (local)', 'Running Build Jobs (local)']"
       colors="['rgb(157, 194, 211)', 'rgb(161, 208, 93)', 'rgb(210, 237, 130)']"
       counter="counter"></div>

  CPU:
  <div class="realtime-line-chart" data="data.count.cpu" counter="counter"
       label-template="CPU #{x} %"></div>

  Process Count:
  <div class="realtime-line-chart" data="data.count.processes" counter="counter"
       label-template="Process Count"></div>

  Virtual Memory:
  <div class="realtime-line-chart" data="data.count.virtual_mem[2]" counter="counter"
       label-template="Virtual Memory %"></div>

  Swap Memory:
  <div class="realtime-line-chart" data="data.count.swap_mem[3]" counter="counter"
       label-template="Swap Memory %"></div>

  Network Connections:
  <div class="realtime-line-chart" data="data.count.connections" counter="counter"
       label-template="Network Connection Count"></div>

  Network Usage:
  <div class="realtime-line-chart" data="data.count.network" labels="['Bytes In', 'Bytes Out']" counter="counter"></div>
</div>