| {{#if @dataset}} |
| <svg |
| data-test-horizontal-bar-chart |
| class="chart is-horizontal" |
| {{on "mouseleave" this.removeTooltip}} |
| {{did-insert this.renderChart @dataset}} |
| {{did-update this.renderChart @dataset}} |
| > |
| </svg> |
| {{else}} |
| <EmptyState @subTitle={{or @noDataMessage "No data to display"}} @bottomBorder={{true}} /> |
| {{/if}} |
| {{#if this.tooltipTarget}} |
| {{! Required to set tag name = div https://github.com/yapplabs/ember-modal-dialog/issues/290 }} |
| {{! Component must be in curly bracket notation }} |
| {{! template-lint-disable no-curly-component-invocation }} |
| {{#modal-dialog |
| tagName="div" |
| tetherTarget=this.tooltipTarget |
| targetAttachment="bottom middle" |
| attachment="bottom middle" |
| offset="35px 0" |
| }} |
| <div class={{concat "chart-tooltip horizontal-chart " (if this.isLabel "is-label-fit-content")}}> |
| <p>{{this.tooltipText}}</p> |
| </div> |
| <div class="chart-tooltip-arrow"></div> |
| {{/modal-dialog}} |
| {{/if}} |