javascript - 使用画布捕获 div 为 php 中的图形提供空白图像

Question

我曾尝试捕获 div。它在捕获和保存过程中获取内容和图像。但是当我尝试使用画布捕获图形时，它会给出空白图像。它需要图像的高度和宽度，但它显示白色的空白图像。

我曾经使用过 JPower Graph

这是在索引文件中添加的：

<script type="text/javascript">
    function capture() {
        $('#target').html2canvas({
            onrendered: function (canvas) {
                //Set hidden field's value to image data (base-64 string)
                $('#img_val').val(canvas.toDataURL("image/png"));
                //Submit the form manually
                document.getElementById("myForm").submit();
            }
        });
    }
</script>

<form method="POST" enctype="multipart/form-data" action="save.php" id="myForm">
    <input type="hidden" name="img_val" id="img_val" value="" />
</form>

这是save.php

$filteredData=substr($_POST['img_val'], strpos($_POST['img_val'], ",")+1);

//Decode the string
$unencodedData=base64_decode($filteredData);

//Save the image
file_put_contents('img.png', $unencodedData);