@@ -10,6 +10,8 @@ var pkg = require('../../../package.json');
10
10
var subroutines = require ( '@src/plot_api/subroutines' ) ;
11
11
var helpers = require ( '@src/plot_api/helpers' ) ;
12
12
var editTypes = require ( '@src/plot_api/edit_types' ) ;
13
+ var annotations = require ( '@src/components/annotations' ) ;
14
+ var images = require ( '@src/components/images' ) ;
13
15
14
16
var d3 = require ( 'd3' ) ;
15
17
var createGraphDiv = require ( '../assets/create_graph_div' ) ;
@@ -2193,6 +2195,10 @@ describe('Test plot api', function() {
2193
2195
spyOn ( subroutines , m ) . and . callThrough ( ) ;
2194
2196
subroutines [ m ] . calls . reset ( ) ;
2195
2197
} ) ;
2198
+
2199
+ spyOn ( annotations , 'drawOne' ) . and . callThrough ( ) ;
2200
+ spyOn ( annotations , 'draw' ) . and . callThrough ( ) ;
2201
+ spyOn ( images , 'draw' ) . and . callThrough ( ) ;
2196
2202
} ) ;
2197
2203
2198
2204
afterEach ( destroyGraphDiv ) ;
@@ -2202,6 +2208,9 @@ describe('Test plot api', function() {
2202
2208
2203
2209
gd . on ( 'plotly_afterplot' , function ( ) { plotCalls ++ ; } ) ;
2204
2210
subroutines . layoutStyles . calls . reset ( ) ;
2211
+ annotations . draw . calls . reset ( ) ;
2212
+ annotations . drawOne . calls . reset ( ) ;
2213
+ images . draw . calls . reset ( ) ;
2205
2214
}
2206
2215
2207
2216
function countCalls ( counts ) {
@@ -2217,6 +2226,16 @@ describe('Test plot api', function() {
2217
2226
2218
2227
expect ( plotCalls ) . toBe ( counts . plot || 0 , 'calls to Plotly.plot' ) ;
2219
2228
plotCalls = 0 ;
2229
+
2230
+ // only consider annotation and image draw calls if we *don't* do a full plot.
2231
+ if ( ! counts . plot ) {
2232
+ expect ( annotations . draw ) . toHaveBeenCalledTimes ( counts . annotationDraw || 0 ) ;
2233
+ expect ( annotations . drawOne ) . toHaveBeenCalledTimes ( counts . annotationDrawOne || 0 ) ;
2234
+ expect ( images . draw ) . toHaveBeenCalledTimes ( counts . imageDraw || 0 ) ;
2235
+ }
2236
+ annotations . draw . calls . reset ( ) ;
2237
+ annotations . drawOne . calls . reset ( ) ;
2238
+ images . draw . calls . reset ( ) ;
2220
2239
}
2221
2240
2222
2241
it ( 'should notice new data by ===, without layout.datarevision' , function ( done ) {
@@ -2344,6 +2363,121 @@ describe('Test plot api', function() {
2344
2363
. then ( done ) ;
2345
2364
} ) ;
2346
2365
2366
+ it ( 'redraws annotations one at a time' , function ( done ) {
2367
+ var data = [ { y : [ 1 , 2 , 3 ] , mode : 'markers' } ] ;
2368
+ var layout = { } ;
2369
+ var ymax ;
2370
+
2371
+ Plotly . newPlot ( gd , data , layout )
2372
+ . then ( countPlots )
2373
+ . then ( function ( ) {
2374
+ ymax = layout . yaxis . range [ 1 ] ;
2375
+
2376
+ layout . annotations = [ {
2377
+ x : 1 ,
2378
+ y : 4 ,
2379
+ text : 'Way up high' ,
2380
+ showarrow : false
2381
+ } , {
2382
+ x : 1 ,
2383
+ y : 2 ,
2384
+ text : 'On the data' ,
2385
+ showarrow : false
2386
+ } ] ;
2387
+ return Plotly . react ( gd , data , layout ) ;
2388
+ } )
2389
+ . then ( function ( ) {
2390
+ // autoranged - so we get a full replot
2391
+ countCalls ( { plot : 1 } ) ;
2392
+ expect ( d3 . selectAll ( '.annotation' ) . size ( ) ) . toBe ( 2 ) ;
2393
+
2394
+ layout . annotations [ 1 ] . bgcolor = 'rgb(200, 100, 0)' ;
2395
+ return Plotly . react ( gd , data , layout ) ;
2396
+ } )
2397
+ . then ( function ( ) {
2398
+ countCalls ( { annotationDrawOne : 1 } ) ;
2399
+ expect ( window . getComputedStyle ( d3 . select ( '.annotation[data-index="1"] .bg' ) . node ( ) ) . fill )
2400
+ . toBe ( 'rgb(200, 100, 0)' ) ;
2401
+ expect ( layout . yaxis . range [ 1 ] ) . not . toBeCloseTo ( ymax , 0 ) ;
2402
+
2403
+ layout . annotations [ 0 ] . font = { color : 'rgb(0, 255, 0)' } ;
2404
+ layout . annotations [ 1 ] . bgcolor = 'rgb(0, 0, 255)' ;
2405
+ return Plotly . react ( gd , data , layout ) ;
2406
+ } )
2407
+ . then ( function ( ) {
2408
+ countCalls ( { annotationDrawOne : 2 } ) ;
2409
+ expect ( window . getComputedStyle ( d3 . select ( '.annotation[data-index="0"] text' ) . node ( ) ) . fill )
2410
+ . toBe ( 'rgb(0, 255, 0)' ) ;
2411
+ expect ( window . getComputedStyle ( d3 . select ( '.annotation[data-index="1"] .bg' ) . node ( ) ) . fill )
2412
+ . toBe ( 'rgb(0, 0, 255)' ) ;
2413
+
2414
+ Lib . extendFlat ( layout . annotations [ 0 ] , { yref : 'paper' , y : 0.8 } ) ;
2415
+
2416
+ return Plotly . react ( gd , data , layout ) ;
2417
+ } )
2418
+ . then ( function ( ) {
2419
+ countCalls ( { plot : 1 } ) ;
2420
+ expect ( layout . yaxis . range [ 1 ] ) . toBeCloseTo ( ymax , 0 ) ;
2421
+ } )
2422
+ . catch ( fail )
2423
+ . then ( done ) ;
2424
+ } ) ;
2425
+
2426
+ it ( 'redraws images all at once' , function ( done ) {
2427
+ var data = [ { y : [ 1 , 2 , 3 ] , mode : 'markers' } ] ;
2428
+ var layout = { } ;
2429
+ var jsLogo = 'https://images.plot.ly/language-icons/api-home/js-logo.png' ;
2430
+
2431
+ var x , y , height , width ;
2432
+
2433
+ Plotly . newPlot ( gd , data , layout )
2434
+ . then ( countPlots )
2435
+ . then ( function ( ) {
2436
+ layout . images = [ {
2437
+ source : jsLogo ,
2438
+ xref : 'paper' ,
2439
+ yref : 'paper' ,
2440
+ x : 0.1 ,
2441
+ y : 0.1 ,
2442
+ sizex : 0.2 ,
2443
+ sizey : 0.2
2444
+ } , {
2445
+ source : jsLogo ,
2446
+ xref : 'x' ,
2447
+ yref : 'y' ,
2448
+ x : 1 ,
2449
+ y : 2 ,
2450
+ sizex : 1 ,
2451
+ sizey : 1
2452
+ } ] ;
2453
+ Plotly . react ( gd , data , layout ) ;
2454
+ } )
2455
+ . then ( function ( ) {
2456
+ countCalls ( { imageDraw : 1 } ) ;
2457
+ expect ( d3 . selectAll ( 'image' ) . size ( ) ) . toBe ( 2 ) ;
2458
+
2459
+ var n = d3 . selectAll ( 'image' ) . node ( ) ;
2460
+ x = n . attributes . x . value ;
2461
+ y = n . attributes . y . value ;
2462
+ height = n . attributes . height . value ;
2463
+ width = n . attributes . width . value ;
2464
+
2465
+ layout . images [ 0 ] . y = 0.8 ;
2466
+ layout . images [ 0 ] . sizey = 0.4 ;
2467
+ Plotly . react ( gd , data , layout ) ;
2468
+ } )
2469
+ . then ( function ( ) {
2470
+ countCalls ( { imageDraw : 1 } ) ;
2471
+ var n = d3 . selectAll ( 'image' ) . node ( ) ;
2472
+ expect ( n . attributes . x . value ) . toBe ( x ) ;
2473
+ expect ( n . attributes . width . value ) . toBe ( width ) ;
2474
+ expect ( n . attributes . y . value ) . not . toBe ( y ) ;
2475
+ expect ( n . attributes . height . value ) . not . toBe ( height ) ;
2476
+ } )
2477
+ . catch ( fail )
2478
+ . then ( done ) ;
2479
+ } ) ;
2480
+
2347
2481
it ( 'can change config, and always redraws' , function ( done ) {
2348
2482
var data = [ { y : [ 1 , 2 , 3 ] } ] ;
2349
2483
var layout = { } ;
0 commit comments