Merge pull request #846 from plotly/export-layout-image-eps-pdf

Fix <svg> export of graphs with layout images

Author: etpinard

src/components/images/draw.js

@@ -11,6 +11,7 @@
 var d3 = require('d3');
 var Drawing = require('../drawing');
 var Axes = require('../../plots/cartesian/axes');
+var xmlnsNamespaces = require('../../constants/xmlns_namespaces');
 
 module.exports = function draw(gd) {
 
@@ -52,9 +53,10 @@ module.exports = function draw(gd) {
 
     // Images must be converted to dataURL's for exporting.
     function setImage(d) {
-
         var thisImage = d3.select(this);
 
+        thisImage.attr('xmlns', xmlnsNamespaces.svg);
+
         var imagePromise = new Promise(function(resolve) {
 
             var img = new Image();
@@ -92,7 +94,6 @@ module.exports = function draw(gd) {
     }
 
     function applyAttributes(d) {
-
         var thisImage = d3.select(this);
 
         // Axes if specified
@@ -140,7 +141,9 @@ module.exports = function draw(gd) {
             yId = yref ? yref._id : '',
             clipAxes = xId + yId;
 
-        thisImage.call(Drawing.setClipUrl, 'clip' + fullLayout._uid + clipAxes);
+        if(clipAxes) {
+            thisImage.call(Drawing.setClipUrl, 'clip' + fullLayout._uid + clipAxes);
+        }
     }
 
 

test/image/export_test.js

@@ -14,7 +14,7 @@ var test = require('tape');
 var FORMATS = ['svg', 'pdf', 'eps'];
 
 // non-exhaustive list of mocks to test
-var DEFAULT_LIST = ['0', 'geo_first', 'gl3d_z-range', 'text_export'];
+var DEFAULT_LIST = ['0', 'geo_first', 'gl3d_z-range', 'text_export', 'layout_image'];
 
 // minimum satisfactory file size
 var MIN_SIZE = 100;