lufy's legend

标题: 求助！苹果手机getDataURL方法出现问题 [打印本页]

作者: ohufei 时间: 2016-10-25 16:09
标题: 求助！苹果手机getDataURL方法出现问题
先贴代码：

var draw_bmd = new LBitmapData(null,0,0,640,1040);
draw_bmd.draw(work_container);
var draw_bmp = new LBitmap(draw_bmd);
var draw_img_data = draw_bmp.getDataURL("image/jpeg",0.7);
alert(draw_img_data);

复制代码

很简单，对不对？新建一个LBitmapData对象，然后draw一个显示对象，生成一个LBitmap，再去通过getDataURL方法获取Base64图片数据，保存成图片文件。在电脑上测试没问题，安卓手机（华为p9）测试没问题，但是在苹果手机上draw以后LBitmap显示出来是正常的，但是Base64图片数据保存以后就变成一张全黑的图片了。苹果手机上alert出来的Base64数据显示如下图：

这个数据看起来就有问题吧？为什么getDataURL方法在苹果手机上会出问题呢？我折腾一天了还没搞清楚，求助！

作者: lufy 时间: 2016-10-26 10:25
数据保存下来对比一下看看一不一样

作者: ohufei 时间: 2016-10-27 16:26
对比了，苹果保存的数据不一样。就苹果有问题，pc和安卓没问题。另外就是在苹果手机上用canvas原生的toDataURL方法保存base64也是没问题的。

作者: lufy 时间: 2016-10-27 20:35

ohufei 发表于 2016-10-27 16:26
对比了，苹果保存的数据不一样。就苹果有问题，pc和安卓没问题。另外就是在苹果手机上用canvas原生的toData ...

http://lufylegend.com/html5/lufylegend/ps.html
我这里有个demo，iphone6s和ipad测试都好用，你试试看吧

作者: ohufei 时间: 2016-10-31 19:59
老大，不是每次使用getDataURL方法都有问题，以前做的项目也没问题，这次可能是处理的图片尺寸比较大（加载进来的图片大概有3000x4000像素的样子，然后截取一部分），就出这个问题了。如果是小尺寸图片，截取范围小的时候是没问题的。这次用其他方式处理了，但是这个问题确实在苹果手机上是存在的，不知道是lufy框架的问题还是我处理不当的原因？

作者: lufy 时间: 2016-11-1 09:20

ohufei 发表于 2016-10-31 19:59
老大，不是每次使用getDataURL方法都有问题，以前做的项目也没问题，这次可能是处理的图片尺寸比较大（加载 ...

苹果手机对于网页中的图片以及canvas的大小是有限制的，你的图片尺寸应该是超过限制了

作者: ohufei 时间: 2016-11-1 15:21
图片在lufy里加载进来显示是正常的，直接使用“main_canvas”的toDataURL方法获取到的base64也没有问题，只是在lufy里用getDataURL方法获取的base64有问题。

作者: lufy 时间: 2016-11-1 15:50

ohufei 发表于 2016-11-1 15:21
图片在lufy里加载进来显示是正常的，直接使用“main_canvas”的toDataURL方法获取到的base64也没有问题，只 ...

你所说的main_canvas，它的大小就是游戏初始化的大小，无论你用的图片多大，它的大小是固定的，用toDataURL得到的图像就是画面上显示的那部分图像，所以你用它toDataURL没有问题啊
但是引擎里的getDataURL，是将整个对象进行toDataURL，为了得到完整的图片，会根据图片大小来设定canvas的大小，然后再进行toDataURL
所以，两者使用的canvas以及得到的data大小是不一样的

作者: lufy 时间: 2016-11-1 15:54

var draw_bmd = new LBitmapData(null,0,0,640,1040);
draw_bmd.draw(work_container);
var draw_bmp = new LBitmap(draw_bmd);
var draw_img_data = draw_bmp.getDataURL("image/jpeg",0.7);
alert(draw_img_data);

复制代码

这个是你贴出来的代码，640,1040的大小应该没问题啊，你是说这部分代码得到的data有问题吗？还是实际上有问题的代码跟这个不一样

作者: ohufei 时间: 2016-11-8 17:18

lufy 发表于 2016-11-1 15:50
你所说的main_canvas，它的大小就是游戏初始化的大小，无论你用的图片多大，它的大小是固定的，用toDataUR ...

可能就是您说的这个问题，因为draw_bmd这个draw的那个对象work_container，加载了用户上传的照片（尺寸太大），造成后面getDataURL的问题。但是draw之后显示还是正常的，使用getDataURL生成的base64数据就有问题了。

作者: chensz 时间: 2018-5-3 14:45

lufy 发表于 2016-10-27 20:35
http://lufylegend.com/html5/lufylegend/ps.html
我这里有个demo，iphone6s和ipad测试都好用，你试试看 ...

这个demo为啥我用安卓，iphone6和iphone8测试都没反应咧，大神

作者: lufy 时间: 2018-5-4 06:49

chensz 发表于 2018-5-3 14:45
这个demo为啥我用安卓，iphone6和iphone8测试都没反应咧，大神

这个demo是好多年前写的了，例子里用以下方式显示导出的图片
window.open(backLayer.getDataURL());
这种方式现在的浏览器貌似不支持了，但是getDataURL()是好用的，你可以通过其他方式把图片导出来

欢迎光临 lufy's legend (http://lufylegend.com/forum/)