作为图像不能在移动设备上工作的画布保存

我有一个代码，它结合了多个画布并将它们保存到一个图像文件中。虽然这适用于非移动设备，但是我在移动设备上进行了测试，并且在生成了图像的同时，打开该文件会向您发送一条消息，指出“图像_无法显示，因为它包含错误。”作为图像不能在移动设备上工作的画布保存

下面是转换为图像的代码：

<script type='text/javascript'> 
window.addEventListener('load', function() { 
    'use strict'; 
    var src = document.getElementById('src'); 
    var dst = document.getElementById('dst'); 
    var dst1 = document.getElementById('dst1'); 
    var input = src.getContext('2d'); 
    var output = dst.getContext('2d'); 
    var output1 = dst1.getContext('2d'); 

    dst.width = dst_w; 
    dst.height = dst_h; 
    dst1.width = dst1_w; 
    dst1.height = dst1_h; 

    var img=document.getElementById("scream"); 
    input.drawImage(img,0,0); 

    var sprkl = document.getElementById('sprkl'); 
    var output_s = sprkl.getContext('2d'); 
    input.drawImage(document.getElementById('sparkle'),0,0,150,150); 

    input.drawImage(document.getElementById('circle'),0,0,<?php echo $lenssize.",".$lenssize.",".$left.",".$top.",".$dia.",".$dia; ?>); 
    input.drawImage(document.getElementById('circle1'),0,0,<?php echo $lenssize.",".$lenssize.",".$left1.",".$top1.",".$dia1.",".$dia1; ?>); 

    function gonext() { 
    var a = document.getElementById('src'); 
    var dataURL = a.toDataURL(); 
    $.post("save.php?filen=<?php echo $filen; ?>", {data: a.toDataURL("image/png")}) 
    window.setTimeout(function() { 
      document.frmnext.submit(); 
    }, 10000); 
} 

<div style="position: relative; z-index: 2"> 
      <canvas id="src" width="<?php echo $width; ?>" height="<?php echo $height; ?>"></canvas> 
      <canvas id="sprkl" style="position: absolute; z-index: 3;"></canvas> 
      <canvas id="dst" style='position: absolute; z-index: 3'></canvas> 
      <canvas id="dst1" style='position: absolute; z-index: 3'></canvas> 
</div>

来源

2013-10-02 zakuwolf

您确定手机浏览器支持'toDataURL'的画布吗？我看不到'if（output_s）'的检查。如果您将数据保存到“Blob”（除非您将其保存在服务器上），则还可以阻止往返。 –

我很欣赏你的时间回答我的问题，但我已经找到了解决办法是here

我只是添加的js文件就是这样。

再次感谢:)

来源

2013-10-03 06:24:05 zakuwolf

为了支持toDataURL试试这个，因为我认为，还有与喜欢的base64数据串输出图像的问题...

我有同样的我的项目的问题，我发现this solution

$('.jSignature').attr('id','image_b_id'); 
var canvas_1 = document.getElementById('image_b_id'); 
var image_b_base64 = canvas_1.toDataURL();

当我创建jSignature Canvas，我可以在许多移动设备上运行。但有一个错误的其他一些设备，如银河迷你...

来源

2013-10-02 21:10:18

作为图像不能在移动设备上工作的画布保存

回答

相关问题