diff --git a/src/plot_api/plot_api.js b/src/plot_api/plot_api.js index 2975f9ec50e..af891ba692d 100644 --- a/src/plot_api/plot_api.js +++ b/src/plot_api/plot_api.js @@ -47,11 +47,21 @@ var subroutines = require('./subroutines'); * */ Plotly.plot = function(gd, data, layout, config) { + var frames; + gd = helpers.getGraphDiv(gd); // Events.init is idempotent and bails early if gd has already been init'd Events.init(gd); + if(Lib.isPlainObject(data)) { + var obj = data; + data = obj.data; + layout = obj.layout; + config = obj.config; + frames = obj.frames; + } + var okToPlot = Events.triggerHandler(gd, 'plotly_beforeplot', [data, layout, config]); if(okToPlot === false) return Promise.reject(); @@ -62,6 +72,12 @@ Plotly.plot = function(gd, data, layout, config) { 'but this container doesn\'t yet have a plot.', gd); } + function addFrames() { + if(frames) { + return Plotly.addFrames(gd, frames); + } + } + // transfer configuration options to gd until we move over to // a more OO like model setPlotContext(gd, config); @@ -329,6 +345,7 @@ Plotly.plot = function(gd, data, layout, config) { Lib.syncOrAsync([ Plots.previousPromises, + addFrames, drawFramework, marginPushers, marginPushersAgain, diff --git a/test/jasmine/tests/plot_api_test.js b/test/jasmine/tests/plot_api_test.js index 06078004c2a..c42ebf273e9 100644 --- a/test/jasmine/tests/plot_api_test.js +++ b/test/jasmine/tests/plot_api_test.js @@ -11,6 +11,7 @@ var subroutines = require('@src/plot_api/subroutines'); var d3 = require('d3'); var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div'); +var fail = require('../assets/fail_test'); describe('Test plot api', function() { @@ -22,6 +23,69 @@ describe('Test plot api', function() { }); }); + describe('Plotly.plot', function() { + var gd; + + beforeEach(function() { + gd = createGraphDiv(); + }); + + afterEach(destroyGraphDiv); + + it('accepts gd, data, layout, and config as args', function(done) { + Plotly.plot(gd, + [{x: [1, 2, 3], y: [1, 2, 3]}], + {width: 500, height: 500}, + {editable: true} + ).then(function() { + expect(gd.layout.width).toEqual(500); + expect(gd.layout.height).toEqual(500); + expect(gd.data.length).toEqual(1); + expect(gd._context.editable).toBe(true); + }).catch(fail).then(done); + }); + + it('accepts gd and an object as args', function(done) { + Plotly.plot(gd, { + data: [{x: [1, 2, 3], y: [1, 2, 3]}], + layout: {width: 500, height: 500}, + config: {editable: true}, + frames: [{y: [2, 1, 0], name: 'frame1'}] + }).then(function() { + expect(gd.layout.width).toEqual(500); + expect(gd.layout.height).toEqual(500); + expect(gd.data.length).toEqual(1); + expect(gd._transitionData._frames.length).toEqual(1); + expect(gd._context.editable).toBe(true); + }).catch(fail).then(done); + }); + + it('allows adding more frames to the initial set', function(done) { + Plotly.plot(gd, { + data: [{x: [1, 2, 3], y: [1, 2, 3]}], + layout: {width: 500, height: 500}, + config: {editable: true}, + frames: [{y: [7, 7, 7], name: 'frame1'}] + }).then(function() { + expect(gd.layout.width).toEqual(500); + expect(gd.layout.height).toEqual(500); + expect(gd.data.length).toEqual(1); + expect(gd._transitionData._frames.length).toEqual(1); + expect(gd._context.editable).toBe(true); + + return Plotly.addFrames(gd, [ + {y: [8, 8, 8], name: 'frame2'}, + {y: [9, 9, 9], name: 'frame3'} + ]); + }).then(function() { + expect(gd._transitionData._frames.length).toEqual(3); + expect(gd._transitionData._frames[0].name).toEqual('frame1'); + expect(gd._transitionData._frames[1].name).toEqual('frame2'); + expect(gd._transitionData._frames[2].name).toEqual('frame3'); + }).catch(fail).then(done); + }); + }); + describe('Plotly.relayout', function() { var gd;