快照 html 5 画布答案

【问题标题】：Snapshot html 5 canvas快照 html 5 画布
【发布时间】：2014-11-30 19:01:16
【问题描述】：

这是我的代码，用于拍摄我身体 300px/300px 的快照。

    html2canvas(document.body, {
      onrendered: function(canvas) {
        document.body.appendChild(canvas);
      },
      width: 300,
      height: 300
    });

为了测试它，我只是放了一个这样的

<a href="#" onclick="html2canvas(element, options);"> CANVAS </a>

但是当我点击什么都看不到...我是否必须放置我想要快照的标签？

【问题讨论】：

标签： javascript html canvas snapshot

【解决方案1】：

在您的onclick 中，您传递的元素和选项应该是一个元素（例如 document.body），而选项是 html2canvas 方法中的第二个参数。

如果您在 html2canvas.js 中使用 jquery，您可以执行以下操作：-

这是您单击以获取快照的链接

<a href="#" id="snapshot">Test snapshot</a>

这就是脚本的样子

<script>
    $("#snapshot").click(function()
    {
        html2canvas(document.body,
        {
            onrendered: function(canvas)
            {
                document.body.appendChild(canvas);
            },
            width: 300,
            height: 300
        });
    });
</script>

【讨论】：

【解决方案2】：

代码的第一部分不是函数声明。尝试以下方法：

function performScreenshot(element) {
    html2canvas(element, {
        onrendered: function(canvas) {
        document.body.appendChild(canvas);
        },
        width: 300,
        height: 300
    });
}

然后调用

<a href="#" onclick="performScreenshot(document.body);"> CANVAS </a>

请记住“脚本使用的所有图像都需要位于同一来源下，才能在没有代理帮助的情况下读取它们”（html2canvas documentation）

【讨论】：

【解决方案3】：

现在是我的正确代码，它可以工作。

$(document).ready(function Canvas(){
   html2canvas($('#col2Game'), {
      onrendered: function (canvas) {
      document.body.appendChild(canvas);
      }
   });
});

我有我的 get_uploads.php 文件

$id = $_GET['id'];
$folder = 'uploads';
$handle = opendir($folder);

while(($file = readdir($handle)) !== false){
    if($file != '.' && $file != '..'){

        $nameFile = explode('.',$file);

        if($nameFile[0] == $id)
        {
            echo '<img src="'.$folder.'/'.$file.'?time='.time().'"/>';
            exit();
        }
    }
}

echo 'error';

我的 upload.php 文件

if(isset($_GET['id']))
{
    $id= $_GET['id'];

    $folder = 'uploads/';
    $filename = $id.'.jpg';
    $input_con = file_get_contents("php://input");
    $file_path = $folder.$filename;

    file_put_contents($file_path, $input_con);
}

但是如何将我的画布快照放入上传文件夹？

【讨论】：