@@ -3235,23 +3235,7 @@ describe('Test axes', function() {
32353235 } ) ;
32363236
32373237 describe ( 'automargin' , function ( ) {
3238- var data = [ {
3239- x : [
3240- 'short label 1' , 'loooooong label 1' ,
3241- 'short label 2' , 'loooooong label 2' ,
3242- 'short label 3' , 'loooooong label 3' ,
3243- 'short label 4' , 'loooooongloooooongloooooong label 4' ,
3244- 'short label 5' , 'loooooong label 5'
3245- ] ,
3246- y : [
3247- 'short label 1' , 'loooooong label 1' ,
3248- 'short label 2' , 'loooooong label 2' ,
3249- 'short label 3' , 'loooooong label 3' ,
3250- 'short label 4' , 'loooooong label 4' ,
3251- 'short label 5' , 'loooooong label 5'
3252- ]
3253- } ] ;
3254- var gd , initialSize , previousSize , savedBottom ;
3238+ var gd ;
32553239
32563240 beforeEach ( function ( ) {
32573241 gd = createGraphDiv ( ) ;
@@ -3260,170 +3244,144 @@ describe('Test axes', function() {
32603244 afterEach ( destroyGraphDiv ) ;
32613245
32623246 it ( 'should grow and shrink margins' , function ( done ) {
3247+ var initialSize ;
3248+ var previousSize ;
3249+
3250+ function assertSize ( msg , actual , exp ) {
3251+ for ( var k in exp ) {
3252+ var parts = exp [ k ] . split ( ' -' ) ;
3253+ var op = parts [ 0 ] ;
3254+
3255+ var method = {
3256+ '=' : 'toBe' ,
3257+ '~=' : 'toBeWithin' ,
3258+ grew : 'toBeGreaterThan' ,
3259+ shrunk : 'toBeLessThan' ,
3260+ initial : 'toBe'
3261+ } [ op ] ;
3262+
3263+ var val = op === 'initial' ? initialSize [ k ] : previousSize [ k ] ;
3264+ var msgk = msg + ' ' + k + ( parts [ 1 ] ? ' -' + parts [ 1 ] : '' ) ;
3265+ var args = op === '~=' ? [ val , 1.1 , msgk ] : [ val , msgk , '' ] ;
3266+
3267+ expect ( actual [ k ] ) [ method ] ( args [ 0 ] , args [ 1 ] , args [ 2 ] ) ;
3268+ }
3269+ }
32633270
3264- Plotly . plot ( gd , data )
3265- . then ( function ( ) {
3266- expect ( gd . _fullLayout . xaxis . _tickAngles . xtick ) . toBe ( 30 ) ;
3267-
3268- initialSize = previousSize = Lib . extendDeep ( { } , gd . _fullLayout . _size ) ;
3269- return Plotly . relayout ( gd , { 'yaxis.automargin' : true } ) ;
3270- } )
3271- . then ( function ( ) {
3272- var size = gd . _fullLayout . _size ;
3273- expect ( size . l ) . toBeGreaterThan ( previousSize . l ) ;
3274- expect ( size . r ) . toBe ( previousSize . r ) ;
3275- expect ( size . b ) . toBe ( previousSize . b ) ;
3276- expect ( size . t ) . toBe ( previousSize . t ) ;
3277-
3278- previousSize = Lib . extendDeep ( { } , size ) ;
3279- return Plotly . relayout ( gd , { 'xaxis.automargin' : true } ) ;
3280- } )
3281- . then ( function ( ) {
3282- var size = gd . _fullLayout . _size ;
3283- expect ( size . l ) . toBe ( previousSize . l ) ;
3284- expect ( size . r ) . toBe ( previousSize . r ) ;
3285- expect ( size . b ) . toBeGreaterThan ( previousSize . b ) ;
3286- expect ( size . t ) . toBe ( previousSize . t ) ;
3287-
3288- previousSize = Lib . extendDeep ( { } , size ) ;
3289- savedBottom = previousSize . b ;
3290-
3291- // move all the long x labels off-screen
3292- return Plotly . relayout ( gd , { 'xaxis.range' : [ - 10 , - 5 ] } ) ;
3293- } )
3294- . then ( function ( ) {
3295- var size = gd . _fullLayout . _size ;
3296- expect ( size . l ) . toBe ( previousSize . l ) ;
3297- expect ( size . r ) . toBe ( previousSize . r ) ;
3298- expect ( size . t ) . toBe ( previousSize . t ) ;
3299- expect ( size . b ) . toBe ( initialSize . b ) ;
3300-
3301- // move all the long y labels off-screen
3302- return Plotly . relayout ( gd , { 'yaxis.range' : [ - 10 , - 5 ] } ) ;
3303- } )
3304- . then ( function ( ) {
3305- var size = gd . _fullLayout . _size ;
3306- expect ( size . l ) . toBe ( initialSize . l ) ;
3307- expect ( size . r ) . toBe ( previousSize . r ) ;
3308- expect ( size . t ) . toBe ( previousSize . t ) ;
3309- expect ( size . b ) . toBe ( initialSize . b ) ;
3310-
3311- // bring the long labels back
3312- return Plotly . relayout ( gd , {
3313- 'xaxis.autorange' : true ,
3314- 'yaxis.autorange' : true
3315- } ) ;
3316- } )
3317- . then ( function ( ) {
3318- var size = gd . _fullLayout . _size ;
3319- expect ( size . l ) . toBe ( previousSize . l ) ;
3320- expect ( size . r ) . toBe ( previousSize . r ) ;
3321- expect ( size . t ) . toBe ( previousSize . t ) ;
3322- expect ( size . b ) . toBe ( previousSize . b ) ;
3323-
3324- return Plotly . relayout ( gd , { 'xaxis.tickangle' : 45 } ) ;
3325- } )
3326- . then ( function ( ) {
3327- var size = gd . _fullLayout . _size ;
3328- expect ( size . l ) . toBe ( previousSize . l ) ;
3329- expect ( size . r ) . toBe ( previousSize . r ) ;
3330- expect ( size . b ) . toBeGreaterThan ( previousSize . b ) ;
3331- expect ( size . t ) . toBe ( previousSize . t ) ;
3332-
3333- previousSize = Lib . extendDeep ( { } , size ) ;
3334- return Plotly . relayout ( gd , { 'xaxis.tickangle' : 30 } ) ;
3335- } )
3336- . then ( function ( ) {
3337- var size = gd . _fullLayout . _size ;
3338- expect ( size . l ) . toBe ( previousSize . l ) ;
3339- expect ( size . r ) . toBe ( previousSize . r ) ;
3340- expect ( size . b ) . toBe ( savedBottom ) ;
3341- expect ( size . t ) . toBe ( previousSize . t ) ;
3342-
3343- previousSize = Lib . extendDeep ( { } , size ) ;
3344- return Plotly . relayout ( gd , { 'yaxis.ticklen' : 30 } ) ;
3345- } )
3346- . then ( function ( ) {
3347- var size = gd . _fullLayout . _size ;
3348- expect ( size . l ) . toBeGreaterThan ( previousSize . l ) ;
3349- expect ( size . r ) . toBe ( previousSize . r ) ;
3350- expect ( size . b ) . toBe ( previousSize . b ) ;
3351- expect ( size . t ) . toBe ( previousSize . t ) ;
3352-
3353- previousSize = Lib . extendDeep ( { } , size ) ;
3354- return Plotly . relayout ( gd , { 'yaxis.title.font.size' : 30 } ) ;
3355- } )
3356- . then ( function ( ) {
3357- var size = gd . _fullLayout . _size ;
3358- expect ( size ) . toEqual ( previousSize ) ;
3359-
3360- previousSize = Lib . extendDeep ( { } , size ) ;
3361- return Plotly . relayout ( gd , { 'yaxis.title.text' : 'hello' } ) ;
3362- } )
3363- . then ( function ( ) {
3364- var size = gd . _fullLayout . _size ;
3365- expect ( size . l ) . toBeGreaterThan ( previousSize . l ) ;
3366- expect ( size . r ) . toBe ( previousSize . r ) ;
3367- expect ( size . b ) . toBe ( previousSize . b ) ;
3368- expect ( size . t ) . toBe ( previousSize . t ) ;
3369-
3370- previousSize = Lib . extendDeep ( { } , size ) ;
3371- return Plotly . relayout ( gd , { 'yaxis.anchor' : 'free' } ) ;
3372- } )
3373- . then ( function ( ) {
3374- var size = gd . _fullLayout . _size ;
3375- expect ( size . l ) . toBeWithin ( previousSize . l , 1.1 ) ;
3376- expect ( size . r ) . toBe ( previousSize . r ) ;
3377- expect ( size . b ) . toBe ( previousSize . b ) ;
3378- expect ( size . t ) . toBe ( previousSize . t ) ;
3379-
3380- previousSize = Lib . extendDeep ( { } , size ) ;
3381- return Plotly . relayout ( gd , { 'yaxis.position' : 0.1 } ) ;
3382- } )
3383- . then ( function ( ) {
3384- var size = gd . _fullLayout . _size ;
3385- expect ( size . l ) . toBeLessThan ( previousSize . l , 'axis moved right' ) ;
3386- expect ( size . r ) . toBe ( previousSize . r ) ;
3387- expect ( size . b ) . toBe ( previousSize . b ) ;
3388- expect ( size . t ) . toBe ( previousSize . t ) ;
3389-
3390- previousSize = Lib . extendDeep ( { } , size ) ;
3391- return Plotly . relayout ( gd , { 'yaxis.anchor' : 'x' } ) ;
3392- } )
3393- . then ( function ( ) {
3394- var size = gd . _fullLayout . _size ;
3395- expect ( size . l ) . toBeGreaterThan ( previousSize . l , 'axis snapped back' ) ;
3396- expect ( size . r ) . toBe ( previousSize . r ) ;
3397- expect ( size . b ) . toBe ( previousSize . b ) ;
3398- expect ( size . t ) . toBe ( previousSize . t ) ;
3271+ function check ( msg , relayoutObj , exp ) {
3272+ return function ( ) {
3273+ return Plotly . relayout ( gd , relayoutObj ) . then ( function ( ) {
3274+ var gs = Lib . extendDeep ( { } , gd . _fullLayout . _size ) ;
3275+ assertSize ( msg , gs , exp ) ;
3276+ previousSize = gs ;
3277+ } ) ;
3278+ } ;
3279+ }
33993280
3400- previousSize = Lib . extendDeep ( { } , size ) ;
3401- return Plotly . relayout ( gd , {
3402- 'yaxis.side' : 'right' ,
3403- 'xaxis.side' : 'top'
3404- } ) ;
3281+ Plotly . plot ( gd , [ {
3282+ x : [
3283+ 'short label 1' , 'loooooong label 1' ,
3284+ 'short label 2' , 'loooooong label 2' ,
3285+ 'short label 3' , 'loooooong label 3' ,
3286+ 'short label 4' , 'loooooongloooooongloooooong label 4' ,
3287+ 'short label 5' , 'loooooong label 5'
3288+ ] ,
3289+ y : [
3290+ 'short label 1' , 'loooooong label 1' ,
3291+ 'short label 2' , 'loooooong label 2' ,
3292+ 'short label 3' , 'loooooong label 3' ,
3293+ 'short label 4' , 'loooooong label 4' ,
3294+ 'short label 5' , 'loooooong label 5'
3295+ ]
3296+ } ] , {
3297+ margin : { l : 0 , r : 0 , b : 0 , t : 0 } ,
3298+ width : 600 , height : 600
34053299 } )
34063300 . then ( function ( ) {
3407- var size = gd . _fullLayout . _size ;
3408- // left to right and bottom to top
3409- expect ( size . l ) . toBe ( initialSize . r ) ;
3410- expect ( size . r ) . toBe ( previousSize . l ) ;
3411- expect ( size . b ) . toBe ( initialSize . b ) ;
3412- expect ( size . t ) . toBeWithin ( previousSize . b , 1.1 ) ;
3301+ expect ( gd . _fullLayout . xaxis . _tickAngles . xtick ) . toBe ( 30 ) ;
34133302
3414- return Plotly . relayout ( gd , {
3415- 'xaxis.automargin' : false ,
3416- 'yaxis.automargin' : false
3417- } ) ;
3418- } )
3419- . then ( function ( ) {
3420- var size = gd . _fullLayout . _size ;
3421- // back to the defaults
3422- expect ( size ) . toEqual ( initialSize ) ;
3423- } )
3303+ var gs = gd . _fullLayout . _size ;
3304+ initialSize = Lib . extendDeep ( { } , gs ) ;
3305+ previousSize = Lib . extendDeep ( { } , gs ) ;
3306+ } )
3307+ . then ( check ( 'automargin y' , { 'yaxis.automargin' : true } , {
3308+ t : '=' , l : 'grew' ,
3309+ b : '=' , r : '='
3310+ } ) )
3311+ . then ( check ( 'automargin x' , { 'xaxis.automargin' : true } , {
3312+ t : '=' , l : '=' ,
3313+ b : 'grew' , r : 'grew'
3314+ } ) )
3315+ . then ( check ( 'move all x label off-screen' , { 'xaxis.range' : [ - 10 , - 5 ] } , {
3316+ t : '=' , l : '=' ,
3317+ b : 'initial' , r : 'initial'
3318+ } ) )
3319+ . then ( check ( 'move all y label off-screen' , { 'yaxis.range' : [ - 10 , - 5 ] } , {
3320+ t : '=' , l : 'initial' ,
3321+ b : '=' , r : '='
3322+ } ) )
3323+ . then ( check ( 'back to label for auto ranges' , { 'xaxis.autorange' : true , 'yaxis.autorange' : true } , {
3324+ t : '=' , l : 'grew' ,
3325+ b : 'grew' , r : 'grew'
3326+ } ) )
3327+ . then ( check ( 'tilt x label to 45 degrees' , { 'xaxis.tickangle' : 45 } , {
3328+ t : '=' , l : '=' ,
3329+ b : 'grew' , r : 'shrunk'
3330+ } ) )
3331+ . then ( check ( 'tilt x labels back to 30 degrees' , { 'xaxis.tickangle' : 30 } , {
3332+ t : '=' , l : '=' ,
3333+ b : 'shrunk' , r : 'grew'
3334+ } ) )
3335+ . then ( check ( 'bump y-axis tick length' , { 'yaxis.ticklen' : 30 } , {
3336+ t : '=' , l : 'grew' ,
3337+ b : '=' , r : 'grew - as x ticks got shifted right'
3338+ } ) )
3339+ . then ( check ( 'add y-axis title' , { 'yaxis.title.text' : 'hello' } , {
3340+ t : '=' , l : 'grew' ,
3341+ b : '=' , r : 'grew - as x ticks got shifted right'
3342+ } ) )
3343+ . then ( check ( 'size up y-axis title' , { 'yaxis.title.font.size' : 30 } , {
3344+ t : '=' , l : 'grew' ,
3345+ b : '=' , r : 'grew - as x ticks got shifted right'
3346+ } ) )
3347+ . then ( check ( 'tilt y labels up 30 degrees' , { 'yaxis.tickangle' : 30 } , {
3348+ t : 'grew' , l : 'shrunk' ,
3349+ b : '=' , r : 'shrunk - as x ticks got shifted left'
3350+ } ) )
3351+ . then ( check ( 'un-tilt y labels' , { 'yaxis.tickangle' : null } , {
3352+ t : 'shrunk' , l : 'grew' ,
3353+ b : '=' , r : 'grew'
3354+ } ) )
3355+ . then ( check ( 'unanchor y-axis' , { 'yaxis.anchor' : 'free' } , {
3356+ t : '=' , l : '~=' ,
3357+ b : '=' , r : '='
3358+ } ) )
3359+ . then ( check ( 'offset y-axis to the left' , { 'yaxis.position' : 0.1 } , {
3360+ t : '=' , l : 'shrunk - as y-axis shifted right' ,
3361+ b : '=' , r : 'shrunk - as y-axis shifted right'
3362+ } ) )
3363+ . then ( check ( 're-anchor y-axis' , { 'yaxis.anchor' : 'x' } , {
3364+ t : '=' , l : 'grew' ,
3365+ b : '=' , r : 'grew'
3366+ } ) )
3367+ . then ( check ( 'flip axis side' , { 'yaxis.side' : 'right' , 'xaxis.side' : 'top' } , {
3368+ t : 'grew' , l : 'shrunk' ,
3369+ b : 'shrunk' , r : 'grew'
3370+ } ) )
3371+ . then ( check ( 'tilt x labels vertically' , { 'xaxis.tickangle' : 90 } , {
3372+ t : 'grew' , l : 'shrunk' ,
3373+ b : '=' , r : '='
3374+ } ) )
3375+ . then ( check ( 'tilt y labels down 30 degrees' , { 'yaxis.tickangle' : 30 } , {
3376+ t : '=' , l : '=' ,
3377+ b : 'grew' , r : 'shrunk'
3378+ } ) )
3379+ . then ( check ( 'turn off automargin' , { 'xaxis.automargin' : false , 'yaxis.automargin' : false } , {
3380+ t : 'initial' , l : 'initial' ,
3381+ b : 'initial' , r : 'initial'
3382+ } ) )
34243383 . catch ( failTest )
34253384 . then ( done ) ;
3426-
34273385 } ) ;
34283386 } ) ;
34293387
0 commit comments