canvas.toDataURL返回空白图像

Question

我想绘制一张表格到画布上，然后将画布保存为图像。 （需要创建PDF）

有趣的是，表格显示在画布上，但我无法用.toDataURL转换它，它只是返回一个空白图像。

控制台中没有警报。

function getImgDataTable(tableContainer) { 
    var tableArea = tableContainer.getElementsByTagName('table')[0].parentNode; 
    var doc = tableContainer.ownerDocument; 
    var canvas = doc.createElement('canvas'); 
    canvas.setAttribute('width', tableArea.offsetWidth); 
    canvas.setAttribute('height', tableArea.offsetHeight); 
    doc.body.appendChild(canvas); 
/* using rasterizeHTML.js */ 
    rasterizeHTML.drawHTML('<div style="font-size: 20px;">' + $("#data-table-chart-0").html()+ '</div>', canvas); 
    var imgDataTable = canvas.toDataURL(); 
    console.log(imgDataTable); 
    return imgDataTable; 
} 

我没有想法，每一个见解都被赞赏。

Answer 1

试试这个http://jsfiddle.net/XtUFt/ HTML

<div id="c"></div> 
<div id="i"></div> 

JS

var canvas = document.createElement("canvas"); 
canvas.height = canvas.width = 200; 
$('#c').append(canvas); 

var ctx = canvas.getContext("2d"); 

//draw a circle 
ctx.beginPath(); 
ctx.arc(75, 75, 70, 0, Math.PI*2, true); 
ctx.closePath(); 
ctx.fill(); 

var dataURL = canvas.toDataURL("image/png"); 

$('#i').append($('<img/>', { src : dataURL }));