@@ -15,7 +15,7 @@ var Drawing = require('../../components/drawing');
15
15
var Axes = require ( './axes' ) ;
16
16
var axisRegex = require ( './constants' ) . attrRegex ;
17
17
18
- module . exports = function transitionAxes ( gd , newLayout , transitionOpts , makeOnCompleteCallback ) {
18
+ function transitionAxes ( gd , newLayout , transitionOpts , makeOnCompleteCallback ) {
19
19
var fullLayout = gd . _fullLayout ;
20
20
var axes = [ ] ;
21
21
@@ -323,4 +323,189 @@ module.exports = function transitionAxes(gd, newLayout, transitionOpts, makeOnCo
323
323
raf = window . requestAnimationFrame ( doFrame ) ;
324
324
325
325
return Promise . resolve ( ) ;
326
+ }
327
+
328
+ function transitionAxes2 ( gd , edits , transitionOpts , makeOnCompleteCallback ) {
329
+ var fullLayout = gd . _fullLayout ;
330
+
331
+ function ticksAndAnnotations ( xa , ya ) {
332
+ var activeAxIds = [ xa . _id , ya . _id ] ;
333
+ var i ;
334
+
335
+ for ( i = 0 ; i < activeAxIds . length ; i ++ ) {
336
+ Axes . doTicksSingle ( gd , activeAxIds [ i ] , true ) ;
337
+ }
338
+
339
+ function redrawObjs ( objArray , method , shortCircuit ) {
340
+ for ( i = 0 ; i < objArray . length ; i ++ ) {
341
+ var obji = objArray [ i ] ;
342
+
343
+ if ( ( activeAxIds . indexOf ( obji . xref ) !== - 1 ) ||
344
+ ( activeAxIds . indexOf ( obji . yref ) !== - 1 ) ) {
345
+ method ( gd , i ) ;
346
+ }
347
+
348
+ // once is enough for images (which doesn't use the `i` arg anyway)
349
+ if ( shortCircuit ) return ;
350
+ }
351
+ }
352
+
353
+ redrawObjs ( fullLayout . annotations || [ ] , Registry . getComponentMethod ( 'annotations' , 'drawOne' ) ) ;
354
+ redrawObjs ( fullLayout . shapes || [ ] , Registry . getComponentMethod ( 'shapes' , 'drawOne' ) ) ;
355
+ redrawObjs ( fullLayout . images || [ ] , Registry . getComponentMethod ( 'images' , 'draw' ) , true ) ;
356
+ }
357
+
358
+ function unsetSubplotTransform ( plotinfo ) {
359
+ var xa = plotinfo . xaxis ;
360
+ var ya = plotinfo . yaxis ;
361
+
362
+ fullLayout . _defs . select ( '#' + plotinfo . clipId + '> rect' )
363
+ . call ( Drawing . setTranslate , 0 , 0 )
364
+ . call ( Drawing . setScale , 1 , 1 ) ;
365
+
366
+ plotinfo . plot
367
+ . call ( Drawing . setTranslate , xa . _offset , ya . _offset )
368
+ . call ( Drawing . setScale , 1 , 1 ) ;
369
+
370
+ var traceGroups = plotinfo . plot . selectAll ( '.scatterlayer .trace' ) ;
371
+
372
+ // This is specifically directed at scatter traces, applying an inverse
373
+ // scale to individual points to counteract the scale of the trace
374
+ // as a whole:
375
+ traceGroups . selectAll ( '.point' )
376
+ . call ( Drawing . setPointGroupScale , 1 , 1 ) ;
377
+ traceGroups . selectAll ( '.textpoint' )
378
+ . call ( Drawing . setTextPointsScale , 1 , 1 ) ;
379
+ traceGroups
380
+ . call ( Drawing . hideOutsideRangePoints , plotinfo ) ;
381
+ }
382
+
383
+ function updateSubplot ( edit , progress ) {
384
+ var plotinfo = edit . plotinfo ;
385
+ var xa1 = plotinfo . xaxis ;
386
+ var ya1 = plotinfo . yaxis ;
387
+
388
+ var xr0 = edit . xr0 ;
389
+ var xr1 = edit . xr1 ;
390
+ var xlen = xa1 . _length ;
391
+ var yr0 = edit . yr0 ;
392
+ var yr1 = edit . yr1 ;
393
+ var ylen = ya1 . _length ;
394
+
395
+ var editX = xr0 [ 0 ] !== xr1 [ 0 ] || xr0 [ 1 ] !== xr1 [ 1 ] ;
396
+ var editY = yr0 [ 0 ] !== yr1 [ 0 ] || yr0 [ 1 ] !== yr1 [ 1 ] ;
397
+ var viewBox = [ ] ;
398
+
399
+ if ( editX ) {
400
+ var dx0 = xr0 [ 1 ] - xr0 [ 0 ] ;
401
+ var dx1 = xr1 [ 1 ] - xr1 [ 0 ] ;
402
+ viewBox [ 0 ] = ( xr0 [ 0 ] * ( 1 - progress ) + progress * xr1 [ 0 ] - xr0 [ 0 ] ) / ( xr0 [ 1 ] - xr0 [ 0 ] ) * xlen ;
403
+ viewBox [ 2 ] = xlen * ( ( 1 - progress ) + progress * dx1 / dx0 ) ;
404
+ xa1 . range [ 0 ] = xr0 [ 0 ] * ( 1 - progress ) + progress * xr1 [ 0 ] ;
405
+ xa1 . range [ 1 ] = xr0 [ 1 ] * ( 1 - progress ) + progress * xr1 [ 1 ] ;
406
+ } else {
407
+ viewBox [ 0 ] = 0 ;
408
+ viewBox [ 2 ] = xlen ;
409
+ }
410
+
411
+ if ( editY ) {
412
+ var dy0 = yr0 [ 1 ] - yr0 [ 0 ] ;
413
+ var dy1 = yr1 [ 1 ] - yr1 [ 0 ] ;
414
+ viewBox [ 1 ] = ( yr0 [ 1 ] * ( 1 - progress ) + progress * yr1 [ 1 ] - yr0 [ 1 ] ) / ( yr0 [ 0 ] - yr0 [ 1 ] ) * ylen ;
415
+ viewBox [ 3 ] = ylen * ( ( 1 - progress ) + progress * dy1 / dy0 ) ;
416
+ ya1 . range [ 0 ] = yr0 [ 0 ] * ( 1 - progress ) + progress * yr1 [ 0 ] ;
417
+ ya1 . range [ 1 ] = yr0 [ 1 ] * ( 1 - progress ) + progress * yr1 [ 1 ] ;
418
+ } else {
419
+ viewBox [ 1 ] = 0 ;
420
+ viewBox [ 3 ] = ylen ;
421
+ }
422
+
423
+ ticksAndAnnotations ( plotinfo . xaxis , plotinfo . yaxis ) ;
424
+
425
+ var xScaleFactor = editX ? xlen / viewBox [ 2 ] : 1 ;
426
+ var yScaleFactor = editY ? ylen / viewBox [ 3 ] : 1 ;
427
+ var clipDx = editX ? viewBox [ 0 ] : 0 ;
428
+ var clipDy = editY ? viewBox [ 1 ] : 0 ;
429
+ var fracDx = editX ? ( viewBox [ 0 ] / viewBox [ 2 ] * xlen ) : 0 ;
430
+ var fracDy = editY ? ( viewBox [ 1 ] / viewBox [ 3 ] * ylen ) : 0 ;
431
+ var plotDx = xa1 . _offset - fracDx ;
432
+ var plotDy = ya1 . _offset - fracDy ;
433
+
434
+ plotinfo . clipRect
435
+ . call ( Drawing . setTranslate , clipDx , clipDy )
436
+ . call ( Drawing . setScale , 1 / xScaleFactor , 1 / yScaleFactor ) ;
437
+
438
+ plotinfo . plot
439
+ . call ( Drawing . setTranslate , plotDx , plotDy )
440
+ . call ( Drawing . setScale , xScaleFactor , yScaleFactor ) ;
441
+
442
+ // apply an inverse scale to individual points to counteract
443
+ // the scale of the trace group.
444
+ Drawing . setPointGroupScale ( plotinfo . zoomScalePts , 1 / xScaleFactor , 1 / yScaleFactor ) ;
445
+ Drawing . setTextPointsScale ( plotinfo . zoomScaleTxt , 1 / xScaleFactor , 1 / yScaleFactor ) ;
446
+ }
447
+
448
+ var onComplete ;
449
+ if ( makeOnCompleteCallback ) {
450
+ // This module makes the choice whether or not it notifies Plotly.transition
451
+ // about completion:
452
+ onComplete = makeOnCompleteCallback ( ) ;
453
+ }
454
+
455
+ function transitionComplete ( ) {
456
+ var aobj = { } ;
457
+ var k ;
458
+
459
+ for ( k in edits ) {
460
+ var edit = edits [ k ] ;
461
+ aobj [ edit . plotinfo . xaxis . _name + '.range' ] = edit . xr1 . slice ( ) ;
462
+ aobj [ edit . plotinfo . yaxis . _name + '.range' ] = edit . yr1 . slice ( ) ;
463
+ }
464
+
465
+ // Signal that this transition has completed:
466
+ onComplete && onComplete ( ) ;
467
+
468
+ return Registry . call ( 'relayout' , gd , aobj ) . then ( function ( ) {
469
+ for ( k in edits ) {
470
+ unsetSubplotTransform ( edits [ k ] . plotinfo ) ;
471
+ }
472
+ } ) ;
473
+ }
474
+
475
+ var t1 , t2 , raf ;
476
+ var easeFn = d3 . ease ( transitionOpts . easing ) ;
477
+
478
+ gd . _transitionData . _interruptCallbacks . push ( function ( ) {
479
+ window . cancelAnimationFrame ( raf ) ;
480
+ raf = null ;
481
+ return transitionComplete ( ) ;
482
+ } ) ;
483
+
484
+ function doFrame ( ) {
485
+ t2 = Date . now ( ) ;
486
+
487
+ var tInterp = Math . min ( 1 , ( t2 - t1 ) / transitionOpts . duration ) ;
488
+ var progress = easeFn ( tInterp ) ;
489
+
490
+ for ( var k in edits ) {
491
+ updateSubplot ( edits [ k ] , progress ) ;
492
+ }
493
+
494
+ if ( t2 - t1 > transitionOpts . duration ) {
495
+ transitionComplete ( ) ;
496
+ raf = window . cancelAnimationFrame ( doFrame ) ;
497
+ } else {
498
+ raf = window . requestAnimationFrame ( doFrame ) ;
499
+ }
500
+ }
501
+
502
+ t1 = Date . now ( ) ;
503
+ raf = window . requestAnimationFrame ( doFrame ) ;
504
+
505
+ return Promise . resolve ( ) ;
506
+ }
507
+
508
+ module . exports = {
509
+ transitionAxes : transitionAxes ,
510
+ transitionAxes2 : transitionAxes2
326
511
} ;
0 commit comments