Make the tooltip animation snappier for line charts

When data is coming in live, the tooltip can get bogged down by updates
causing the tooltip to never make it under the mouse, which looks like
either lag or a bug.
This commit is contained in:
Michael Lange
2018-09-07 17:16:20 -07:00
parent bb40cb029b
commit db6ad98eb4
2 changed files with 5 additions and 1 deletions

View File

@@ -15,6 +15,10 @@
pointer-events: none;
z-index: $z-tooltip;
&.is-snappy {
transition: 0.2s top ease-out, 0.05s left ease-out;
}
&::before {
pointer-events: none;
display: inline-block;

View File

@@ -16,7 +16,7 @@
<g class="x-axis axis" transform="translate(0, {{xAxisOffset}})"></g>
<g class="y-axis axis" transform="translate({{yAxisOffset}}, 0)"></g>
</svg>
<div class="chart-tooltip {{if isActive "active" "inactive"}}" style={{tooltipStyle}}>
<div class="chart-tooltip is-snappy {{if isActive "active" "inactive"}}" style={{tooltipStyle}}>
<ol>
<p>
<span class="label">

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB