diff options
author | Dan Mané <danmane@google.com> | 2016-07-01 10:41:22 -0800 |
---|---|---|
committer | TensorFlower Gardener <gardener@tensorflow.org> | 2016-07-01 11:48:11 -0700 |
commit | ec748d869c9f0130f4526568b1f185c1bec82453 (patch) | |
tree | c13de9686717ac5ed4381b5391016b1f1cf6f169 | |
parent | b3fe7b62beb50b80cb7622b544ab187dd189b7e0 (diff) |
If you have a zoomed in TensorBoard chart, and you load new data, and you unzoom, the chart should snap to the new extent of the data.
Change: 126431405
-rw-r--r-- | tensorflow/tensorboard/components/tf-event-dashboard/dragZoomInteraction.ts | 22 |
1 files changed, 16 insertions, 6 deletions
diff --git a/tensorflow/tensorboard/components/tf-event-dashboard/dragZoomInteraction.ts b/tensorflow/tensorboard/components/tf-event-dashboard/dragZoomInteraction.ts index 92a5ad2971..6e8b9c6879 100644 --- a/tensorflow/tensorboard/components/tf-event-dashboard/dragZoomInteraction.ts +++ b/tensorflow/tensorboard/components/tf-event-dashboard/dragZoomInteraction.ts @@ -17,8 +17,6 @@ module Plottable { export class DragZoomLayer extends Components.SelectionBoxLayer { private _dragInteraction: Interactions.Drag; private _doubleClickInteraction: Interactions.DoubleClick; - private xDomainToRestore: any[]; - private yDomainToRestore: any[]; private isZoomed = false; private easeFn: (t: number) => number = d3.ease('cubic-in-out'); private _animationTime = 750; @@ -133,8 +131,6 @@ export class DragZoomLayer extends Components.SelectionBoxLayer { if (!this.isZoomed) { this.isZoomed = true; - this.xDomainToRestore = this.xScale().domain(); - this.yDomainToRestore = this.yScale().domain(); } this.interpolateZoom(x0, x1, y0, y1); } @@ -145,8 +141,22 @@ export class DragZoomLayer extends Components.SelectionBoxLayer { return; } this.isZoomed = false; - this.interpolateZoom(this.xDomainToRestore[0], this.xDomainToRestore[1], - this.yDomainToRestore[0], this.yDomainToRestore[1]); + + // Some Plottable magic follows which ensures that when we un-zoom, we + // un-zoom to the current extent of the data; i.e. if new data was loaded + // since we zoomed, we should un-zoom to the extent of the new data. + // this basically replicates the autoDomain logic in Plottable. + // it uses the internal methods to get the same boundaries that autoDomain + // would, but allows us to interpolate the zoom with a nice animation. + let xScale = this.xScale() as any; + let yScale = this.yScale() as any; + xScale._domainMin = null; + xScale._domainMax = null; + yScale._domainMin = null; + yScale._domainMax = null; + let xDomain = xScale._getExtent(); + let yDomain = yScale._getExtent(); + this.interpolateZoom(xDomain[0], xDomain[1], yDomain[0], yDomain[1]); } // If we are zooming, disable interactions, to avoid contention |