ios html字符串 h5,javascript – iOS HTML5 Canvas toDataURL

我需要一些帮助.对于通过

HTML 5 / Canvas获取图像的base64,我们似乎遇到了iOS问题.如果我们使用画布的默认高度/宽度或硬编码高度和宽度,一切正常.但是,如果我们将画布高度/宽度设置为图像src的高度/宽度,则图像将不会加载到画布中,因此我们不会将图像作为base64.

有效的代码片段：

function convertImageToBase64(imgUrl, callback) {

var canvas = document.createElement("canvas");

var context = canvas.getContext('2d');

// load image from data url

var imageObj= new Image();

imageObj.onload = function () {

var dataUrl;

context.drawImage(imageObj, 0, 0, canvas.width, canvas.height);

dataUrl = canvas.toDataURL("image/png");

callback.call(this, dataUrl);

canvas = null;

};

imageObj.src = imgUrl;

}

代码段在iOS上不起作用但在Android上有效：

function convertImageToBase64(imgUrl, callback) {

var canvas = document.createElement("canvas");

var context = canvas.getContext('2d');

// load image from data url

var imageObj= new Image();

imageObj.onload = function () {

var dataUrl;

canvas.width = imageObj.width;

canvas.height = imageObj.height;

context.drawImage(imageObj, 0, 0, canvas.width, canvas.height);

dataUrl = canvas.toDataURL("image/png");

callback.call(this, dataUrl);

canvas = null;

};

imageObj.src = imgUrl;

}

我们需要能够根据图像本身建立画布高度/宽度.

非常感谢任何指导或帮助.

ios html字符串 h5,javascript – iOS HTML5 Canvas toDataURL相关推荐

java 画笔粗细,javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
js+html5 canvas实现的涂鸦画板特效,可调画笔颜色|粗细|橡皮,可以保存涂鸦效果为图片编码,非常适合学习html5的canvas,必须支持html5的浏览器才能看到效果. javascri ...
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板 <!doctype html> <head> <meta http-equiv= ...
html绘制动态小人,JavaScript和html5 canvas如何绘制一个小人的代码
这篇文章主要介绍了JavaScript+html5 canvas绘制的小人效果,涉及JavaScript结合html5 canvas图形绘制及颜色随机填充的技巧,需要的朋友可以参考下本文实例讲述了J ...
html5 todataurl,HTML5 Canvas toDataURL()
HTML5 Canvas toDataURL() HTML5 Canvas toDataURL()功能可以抓取HTML5 canvas的内容,从toDataURL()函数返回的数据是一个字符串,表示包 ...
html5canvas绘图空白,html5 canvas toDataURL返回空白图像
我使用以下代码绘制画布并使用toDataUrl将其保存为png图像.html5 canvas toDataURL返回空白图像 body { margin: 0px; padding: 0px; } # ...
JavaScript和html5 canvas生成圆形印章
代码: function createSeal(id,company,name){var canvas = document.getElementById(id); var context = can ...
[转]JavaScript和html5 canvas生成圆形印章
本文转自:http://www.cnblogs.com/dragondean/p/6013529.html 代码: function createSeal(id,company,name){var c ...
m3u8 video ios h5_【H5】iOS系统下的video视频播放完后重新刷新视频
业务需求是H5页面中嵌套video视频,自定义控制视频暂停或者播放,但是对于ios系统下手机,会出现两个问题导致自定义播放事件失效: 1.ios系统下视频自动回放全屏幕播放 2.播放完之后定义在最后一 ...
html绘制静态图表,怎样用JavaScript和HTML5 Canvas绘制图表
在这篇教程中,我将展示用JavaScript和canvas作为手段,在饼状图和圆环图上显示数字信息. 与从零到一创建图表相比,其实有更简便的方式,例如用CodeCanyon上的这个图表库但是如果你想 ...

ios html字符串 h5,javascript – iOS HTML5 Canvas toDataURL

ios html字符串 h5,javascript – iOS HTML5 Canvas toDataURL相关推荐

最新文章

热门文章