add format "full-json" to Plotly.toImage and Plotly.dowloadImage

Author: antoinerg

src/plot_api/to_image.js

@@ -11,6 +11,7 @@
 var isNumeric = require('fast-isnumeric');
 
 var plotApi = require('./plot_api');
+var plots = require('../plots/plots');
 var Lib = require('../lib');
 
 var helpers = require('../snapshot/helpers');
@@ -20,7 +21,7 @@ var svgToImg = require('../snapshot/svgtoimg');
 var attrs = {
     format: {
         valType: 'enumerated',
-        values: ['png', 'jpeg', 'webp', 'svg'],
+        values: ['png', 'jpeg', 'webp', 'svg', 'full-json'],
         dflt: 'png',
         description: 'Sets the format of exported image.'
     },
@@ -170,6 +171,15 @@ function toImage(gd, opts) {
             var width = clonedGd._fullLayout.width;
             var height = clonedGd._fullLayout.height;
 
+            if(format === 'full-json') {
+                var json = plots.graphJson(clonedGd, false, 'keepdata', false, true);
+                if(imageDataOnly) {
+                    return resolve(json);
+                } else {
+                    return resolve(helpers.encodeJSON(json));
+                }
+            }
+
             plotApi.purge(clonedGd);
             document.body.removeChild(clonedGd);
 

src/snapshot/helpers.js

@@ -36,6 +36,10 @@ exports.encodeSVG = function(svg) {
     return 'data:image/svg+xml,' + encodeURIComponent(svg);
 };
 
+exports.encodeJSON = function(json) {
+    return 'data:application/json,' + encodeURIComponent(json);
+};
+
 var DOM_URL = window.URL || window.webkitURL;
 
 exports.createObjectURL = function(blob) {
@@ -49,6 +53,8 @@ exports.revokeObjectURL = function(url) {
 exports.createBlob = function(url, format) {
     if(format === 'svg') {
         return new window.Blob([url], {type: 'image/svg+xml;charset=utf-8'});
+    } else if(format === 'full-json') {
+        return new window.Blob([url], {type: 'application/json;charset=utf-8'});
     } else {
         var binary = fixBinary(window.atob(url));
         return new window.Blob([binary], {type: 'image/' + format});

test/jasmine/tests/download_test.js

@@ -52,6 +52,12 @@ describe('Plotly.downloadImage', function() {
         .then(done);
     }, LONG_TIMEOUT_INTERVAL);
 
+    it('should create link, remove link, accept options', function(done) {
+        downloadTest(gd, 'full-json')
+        .catch(failTest)
+        .then(done);
+    }, LONG_TIMEOUT_INTERVAL);
+
     it('should create link, remove link, accept options', function(done) {
         checkWebp(function(supported) {
             if(supported) {

test/jasmine/tests/toimage_test.js

@@ -263,4 +263,28 @@ describe('Plotly.toImage', function() {
             done();
         });
     });
+
+    describe('with format `full-json`', function() {
+        var imgOpts = {format: 'full-json', imageDataOnly: true};
+        it('export a graph div', function(done) {
+            Plotly.plot(gd, [{y: [1, 2, 3]}])
+            .then(function() { return Plotly.toImage('graph', imgOpts);})
+            .then(function(fig) {
+                fig = JSON.parse(fig);
+                expect(fig.data[0].mode).toBe('lines+markers', 'contain default mode');
+            })
+            .catch(failTest)
+            .then(done);
+        });
+
+        it('export an object with data/layout/config', function(done) {
+            Plotly.toImage({data: [{y: [1, 2, 3]}]}, imgOpts)
+            .then(function(fig) {
+                fig = JSON.parse(fig);
+                expect(fig.data[0].mode).toBe('lines+markers', 'contain default mode');
+            })
+            .catch(failTest)
+            .then(done);
+        });
+    });
 });