Black Lives Matter. Please consider donating to Black Girls Code today.

Problem exporting 3D surface to png

Hello,
I started using plot.ly in javascript for a 3D surface graph and it works fine. But I have a problem exporting it to png using the button of the ploty.ly toolbar. A popup is displayed with the message “Sorry! There was a problem downloading your snapshot”. I tested it in Chrome and Edge but always this error. I tested for a 3D scatter and no problem. So I guess is something about my data or my code for this 3D surface, but I can’t figure out.
Here is the web page that reports this error. And the data I use (the Test3DData.js file) can be downloaded here
Any help will be welcome! Thanks.

<!DOCTYPE html>
<head>
    <style>
        div.content 
        {
        font-size:11pt;
        font-family:Calibri;
        }
    </style>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>

</head>
<body>

<script src="Test3DData.js"></script>


<!-- Plotly chart will be drawn inside this DIV -->
<div id="graphDiv" style="margin-top: 0; z-index:1" >
</div>

  <script>

        dataset = [];
        selectedColorScale =  getColorScaleLayer();
        layer = surfacedata;
        for (i = 0; i < layer.surfaceData.length; i++) {
            if (layer.surfaceColor[i].length == 0) { 
                layer.surfaceData[i] = new Array(layer.size);
            }
        }
        dataset.push({
            showlegend: false,
            showscale: false,
            hoverinfo: "z",
            z: layer.surfaceData,
            type: 'surface',
            surfacecolor: layer.surfaceColor,
            cmin: layer.minColor, cmax: layer.maxColor,
            colorscale: selectedColorScale
        });

        var layout = {
            width: 1000,
            height: 600,
            paper_bgcolor: 'rgba(0,0,0,0)',
            plot_bgcolor: 'rgba(0,0,0,0)',
            margin: {
                l: 10,
                r: 10,
                b: 10,
                t: 0
            },
            scene: {
                camera: {
                    eye: { z: 1.5, x: 2 }
                },
                xaxis:{showticklabels:false , title:"y"},
                yaxis: { showticklabels: false, title: "x"},
            },
            displayModeBar: true
        };

        Plotly.newPlot("graphDiv", dataset, layout);

        function getColorScaleLayer() {
          return[ [0, 'rgb(20,10,245)'],
                          [0.1, 'rgb(45,107,230)'],
                          [0.2, 'rgb(45,231,216)'],
                          [0.3, 'rgb(45,231,216)'],
                          [0.4, 'rgb(0,255,0)'],
                          [0.7, 'rgb(255, 255 ,0)'],
                          [0.8, 'rgb(245, 187 ,15)'],
                          [1, 'rgb(255,0,0)']];
        }


 </script>
</body>
</html>

I agree it doesn’t work.

Also, it doesn’t work in my R studio browser, can’t export the file to any format.

there are lots of bugs at present. I have to use plotly1 most of the time because plotly2 is very much a work in progress

Not sure if you’re still running into this problem or not, but I ran into that problem a few times on Chrome while working with Plotly from Jupyter. However, it worked just fine when I switched to Firefox. I suspect that Edge may have been giving you the same problems as Chrome since I believe Edge is also Chromium-based.

Could please you share a minimal data+layout?