Print or Export Cesium Map Loading Division

[Basil Mohammed]

I am in a need to print and share the HTML division where my cesium map loads. I used the simple cesium app creating tutorials and some JavaScript codes in order to enable the facility. Currently I am able to print the entire screen but my code is unable to get the contents of the division where the cesium map loads. You can find the screenshot below:

My JavaScript Code is as follows:

$(function()
{
    var viewer = document.getElementById("cesiumContainer");
    function print_voucher()
    {   
        var win = window.open();
        win.document.write("<br><img src='"+viewer.toDataURL()+"'/>");
        win.print();
        win.location.reload();
    }
    $("#printVoucher").click(function(){ print_voucher(); });
});

I need to enable the user to share the Desktop view by printing the page including the loaded 3D models on cesium map.

I am using the latest version of cesium, My Operating System is Win10, FireFox Developer is my browser.

The GitHub project link is available here

[Omar Shehata]

This happens because by the time you're taking the screenshot, the WebGL drawing buffer has already been swapped out. This happens for performance reasons, you can read more about it here:

https://stackoverflow.com/a/32641456/1278023

To force it to keep the buffer until the next redraw, pass the preserveDrawingBuffer option to the viewer as shown below:

var viewer = new Cesium.Viewer('cesiumContainer', {

    contextOptions: {

        webgl: {

            preserveDrawingBuffer: true

        }

    }

});

Then calling toDataURL should work.

[Kevin Ring]

Omar and Basil,

I'd suggest doing something like this instead:

https://github.com/TerriaJS/terriajs/blob/d6b048a0d6e5209f2c7258758195facd9f9a3cbb/lib/Models/Cesium.js#L520

Using preserveDrawingBuffer has a cost every frame, but you don't need to pay it as long as you grab the content of the Canvas inside postRender.

Kevin

--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

www.kotachrome.com/kevin

[Basil Mohammed]

Thanks @Omar Shehata for extending resourceful help to me. It works for me.

Attaching the updated GitHub Project Link.

- Basil

[Basil Mohammed]

@Kevin Thanks for the response. I haven't tried this one as the reply by @Omar Shehata was satisfying. Once again thanks.

Find the attached Link for GitHub Project link Here.

- Basil

[z15010...@gmail.com]

https://github.com/richard1015/cesium-print

I hope I can help you.