github.com/hernad/nomad@v1.6.112/ui/app/templates/components/line-chart.hbs (about) 1 {{! 2 Copyright (c) HashiCorp, Inc. 3 SPDX-License-Identifier: MPL-2.0 4 ~}} 5 6 <div 7 class="chart line-chart" 8 ...attributes 9 {{did-insert this.onInsert}} 10 {{did-update this.renderChart}} 11 {{did-update this.recomputeXAxis this.xScale}} 12 {{did-update this.recomputeYAxis this.yScale}} 13 {{window-resize this.updateDimensions}}> 14 <svg data-test-line-chart aria-labelledby="{{this.titleId}}" aria-describedby="{{this.descriptionId}}"> 15 <title id="{{this.titleId}}">{{this.title}}</title> 16 <desc id="{{this.descriptionId}}"> 17 {{#if this.description}} 18 {{this.description}} 19 {{else}} 20 X-axis values range from {{this.xRange.firstObject}} to {{this.xRange.lastObject}}, 21 and Y-axis values range from {{this.yRange.firstObject}} to {{this.yRange.lastObject}}. 22 {{/if}} 23 </desc> 24 <g class="y-gridlines gridlines" transform="translate({{this.yAxisOffset}}, 0)"></g> 25 {{#if this.ready}} 26 {{yield (hash 27 Area=(component "chart-primitives/area" 28 curve="linear" 29 xScale=this.xScale 30 yScale=this.yScale 31 xProp=this.xProp 32 yProp=this.yProp 33 width=this.yAxisOffset 34 height=this.xAxisOffset) 35 ) to="svg"}} 36 {{/if}} 37 <g aria-hidden="true" class="x-axis axis" transform="translate(0, {{this.xAxisOffset}})"></g> 38 <g aria-hidden="true" class="y-axis axis" transform="translate({{this.yAxisOffset}}, 0)"></g> 39 <rect data-test-hover-target class="hover-target" x="0" y="0" width="{{this.yAxisOffset}}" height="{{this.xAxisOffset}}" /> 40 </svg> 41 {{#if this.ready}} 42 {{yield (hash 43 VAnnotations=(component "chart-primitives/v-annotations" 44 timeseries=@timeseries 45 format=this.xFormat 46 scale=this.xScale 47 prop=this.xProp 48 height=this.xAxisOffset) 49 HAnnotations=(component "chart-primitives/h-annotations" 50 format=this.yFormat 51 scale=this.yScale 52 prop=this.yProp 53 left=this.canvasDimensions.left 54 width=this.canvasDimensions.width) 55 Tooltip=(component "chart-primitives/tooltip" 56 active=this.activeData.length 57 style=this.tooltipStyle 58 data=this.activeData) 59 ) to="after"}} 60 {{/if}} 61 </div>