1.首先需要引入外掛canvas2image.js用來將canvas轉圖片

cesium也是基於canvas容器實現webgl，canvas可以直接將內容儲存成圖片：canvas2image。我們只需要獲取到cesium的容器canvas就可以直接儲存為圖片了： 

var canvas = viewer.scene.canvas;

 var genimg = Canvas2Image.convertToImage(canvas, canvas.width, canvas.height , 'png');

 var image = document.getElementById('image');

 image.src = genimg.src;
 

2.執行控制檯報錯：Blocked script execution in 'about:blank' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.

分析：因為infoBox是Ifram框架，H5的新安全機制不允許在其中執行指令碼，如果在裡面寫了類似於點選事件的指令碼，則會提示如下錯誤：

解決方法有兩個：

     1.禁用infobox，自己設計資訊面板。

     2.設定沙箱的許可權

var iframe = document.getElementsByClassName('cesium-infoBox-iframe')[0];

iframe.setAttribute('sandbox', 'allow-same-origin allow-scripts allow-popups allow-forms'); 

3.結果執行無法得到場景截圖，是空白：

場景截圖需要開啟：preserveDrawingBuffer。

viewer初始化設定：

contextOptions: {
            //cesium狀態下允許canvas轉圖片convertToImage
          webgl: {
              alpha: true,
              depth: false,
              stencil: true,
              antialias: true,
              premultipliedAlpha: true,
              preserveDrawingBuffer: true,
              failIfMajorPerformanceCaveat: true
          },
          allowTextureFilterAnisotropic: true
        },
 

之後便可以將截圖儲存到標籤img中

4.想要將截圖下載到本地

 /**
     * 在本地進行檔案儲存
     * @param  {String} data     要儲存到本地的圖片資料（img的src）
     * @param  {String} filename 檔名
     */
    var saveFile = function(data, filename){
        var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
        save_link.href = data;
        save_link.download = filename;

        var event = document.createEvent('MouseEvents');
        event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        save_link.dispatchEvent(event);
    };

5.若需要將除cesium以外的dom加入到截圖中，需要藉助html2canvas外掛來實現，引入html2canvas

將第1步替換：

var test = $("body").get(0); //將jQuery物件轉換為dom物件
    // 點選轉成canvas
    $('#btn').click(function(e) {
        // 呼叫html2canvas外掛
        html2canvas(test).then(function(canvas) {
            // canvas寬度
            var canvasWidth = canvas.width;
            // canvas高度
            var canvasHeight = canvas.height;

                // 呼叫Canvas2Image外掛轉圖片
            var img = Canvas2Image.convertToImage(canvas, canvasWidth, canvasHeight);
            var image = document.getElementById('image');
            //儲存到img標籤中
            image.src = img.src;

            // 呼叫儲存到本地的方法下載圖片
            saveFile(image.src, "aa.png")
        });
    });