Print or Export Cesium Map Loading Division

406 views
Skip to first unread message

Basil Mohammed

unread,
Mar 5, 2019, 7:30:47 AM3/5/19
to cesium-dev
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:

print.JPG



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

unread,
Mar 8, 2019, 11:28:44 AM3/8/19
to cesium-dev
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:


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

unread,
Mar 9, 2019, 5:38:22 AM3/9/19
to cesiu...@googlegroups.com
Omar and Basil,

I'd suggest doing something like this instead:

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.


--

Basil Mohammed

unread,
Mar 11, 2019, 3:56:04 AM3/11/19
to cesium-dev
Thanks @Omar Shehata for extending resourceful help to me. It works for me.

Attaching the updated GitHub Project Link.

- Basil

Basil Mohammed

unread,
Mar 11, 2019, 4:00:40 AM3/11/19
to cesium-dev
@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

unread,
May 23, 2019, 5:31:06 AM5/23/19
to cesium-dev
Reply all
Reply to author
Forward
0 new messages