open-nomad/ui/app/templates/components/gauge-chart.hbs

20 lines
730 B
Handlebars
Raw Normal View History

2020-05-09 00:26:18 +00:00
<svg data-test-gauge-chart role="img" height={{height}}>
<defs>
<linearGradient x1="0" x2="1" y1="0" y2="0" class="{{chartClass}}" id="{{fillId}}">
<stop class="start" offset="0%" />
<stop class="end" offset="100%" />
</linearGradient>
<clipPath id="{{maskId}}">
<path class="fill" d="{{valueArc}}" />
</clipPath>
</defs>
<g class="canvas {{chartClass}}">
<path class="background" d="{{backgroundArc}}" />
<rect class="area" x="0" y="0" width="100%" height="100%" fill="url(#{{fillId}})" clip-path="url(#{{maskId}})" />
</g>
</svg>
<div class="metric">
<h3 class="label">{{label}}</h3>
<p class="value">{{format-percentage value total=total complement=complement}}</p>
</div>