如何在Canvas中打开图像?其被编码

我使用的

var strDataURI = oCanvas.toDataURL();

输出是编码的基础64图像。我如何在画布上绘制这个图像?

我想使用strDataURI并创建图像?它是poosible吗?
如果它不是那么可能是解决方案加载图像在画布上?

解决方法

给定数据网址后,您可以通过将图片的src设置为数据网址来创建图片(在网页上或纯粹在JS中)。例如:
var img = new Image;
img.src = strDataURI;

HTML5 Canvas Context的drawImage() method可以将图像(或画布或视频)的全部或部分复制到画布上。

你可以这样使用它:

var myCanvas = document.getElementById('my_canvas_id');
var ctx = myCanvas.getContext('2d');
var img = new Image;
img.onload = function(){
  ctx.drawImage(img,0); // Or at whatever offset you like
};
img.src = strDataURI;

编辑:我以前建议在这个空间,当涉及数据URI时可能不需要使用onload处理程序。基于this question的实验测试,这是不安全的。上面的序列创建图像,设置onload使用新的图像,然后设置src是必要的一些浏览器,以确保使用的结果。

将图像从数据网址绘制到画布的更多相关文章

  1. canvas 实现 github404动态效果的示例代码

    本篇文章主要介绍了canvas 实现 github404动态效果的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. iOS:用于填充异步提取数据的设计模式

    我正在开发一个从Web获取数据并将其显示给用户的应用程序.假设数据是餐馆的评论,并且在一个视图上显示一个评论.用户可以向左或向右滑动以转到上一个/下一个评论.数据是异步提取的.这是问题陈述–假设已经提取了5条评论,并且用户正在查看当前的第3条评论.现在,第6次审核被提取,我想将其显示为用户的第4次审核.我的模型类应该如何通知视图控制器?除上述3之外的其他建议值得欢迎!

  3. ios – 1天后firebase crashlytics报告中没有数据

    解决方法对于那些仍然有问题的人.检查您的podfile中是否还有pod’Firebase/Crash’.当我删除旧的Firebase崩溃报告时,我的问题已修复.

  4. 将AWS DynamoDB表中的数据加载到iOS上的UITableView

    我的iOS应用程序中使用Swift编写的一个屏幕是UITableView.在这个UITableView中,我想从AWSDynamoDB表中加载名为Books的数据.目前,这是我在故事板上的原型单元格:在表格中我有3个属性:“名称”,“价格”和“ISBN”.我想要的是扫描“书籍”表,并过滤结果,因此结果的“ISBN”属性将包含数字“9”.在我筛选结果后,我想将它们应用到UITableView,因此“

  5. ios – 未为测试目标生成核心数据类

    我使用CoreData的自动生成的类.除测试目标外,我的项目还有3个目标.对于每个目标,正确生成CoreData类,我通过检查DerivedData文件夹进行验证.但是,尽管在核心数据模型文件中打勾,但不会为测试目标生成类.当我尝试引用测试目标中的一个CoreData类时,这会导致“未声明的标识符”和“使用未声明的类型”错误.我该如何解决这个问题?

  6. ios – NSURLCache和数据保护

    我正在尝试保护存储在NSURLCache中的敏感数据.我的应用程序文件和CoreDatasqlite文件设置为NSFileProtectionComplete.但是,我无法将NSURLCache文件数据保护级别更改为NSFileProtectionCompleteUntilFirstUserAuthentication以外的任何其他级别.这会在设备锁定时暴露缓存中的任何敏感数据.我需要缓存响应,以

  7. ios – 领域:如何获取数据库的当前大小

    是否有RealmAPI方法使用RealmSwift作为数据存储来获取我的RealmSwift应用程序的当前数据库大小?

  8. 核心数据 – 核心数据NSPersistentStore问题

    我正在开发一个分阶段推出的应用程序.对于每个sprint,都有数据库更改,因此已实现核心数据迁移.到目前为止,我们已经有3个阶段发布.每当连续升级时,应用程序运行正常.但每当我尝试从版本1升级到版本3时,都会发生’无法添加持久存储’错误.有人可以帮我解决这个问题吗?

  9. iOS Swift在哪里存储用户登录数据或OAuth令牌?

    事情并不像在用户手机上存储登录数据的最佳做法那样清晰.有人建议将userID=123和loggedIn=true类型数据等数据存储在NSUSerDefaults数据中.然而根据我的理解,根据这篇文章https://www.andyibanez.com/nsuserdefaults-not-for-sensitive-data/,这些数据可以很容易地被操作所以问题是:当用户浏览各种屏幕时,持久登录数

  10. ios – Swift – 使用字典数组从字典访问数据时出错

    我有一个非常简单的例子,说明我想做什么基本上,我有一个字典,其值包含[String:String]字典数组.我把数据填入其中,但当我去访问数据时,我收到此错误:Cannotsubscriptavalueoftype‘[([String:String])]?’withanindexoftype‘Int’请让我知道我做错了什么.解决方法您的常量数组是可选的.订阅字典总是返回一个可选项.你必须打开它.更

随机推荐

  1. 微信小程序canvas实现水平、垂直居中效果

    这篇文章主要介绍了小程序中canvas实现水平、垂直居中效果,本文图文实例代码相结合给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

  2. 使用HTML5做的导航条详细步骤

    这篇文章主要介绍了用HTML5做的导航条详细步骤,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. H5最强接口之canvas实现动态图形功能

    这篇文章主要介绍了H5最强接口之canvas实现动态图形功能,需要的朋友可以参考下

  4. Canvas高级路径操作之拖拽对象的实现

    这篇文章主要介绍了Canvas高级路径操作之拖拽对象的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  5. html5视频自动横过来自适应页面且点击播放功能的实现

    这篇文章主要介绍了h5视频自动横过来自适应页面且点击播放,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. 详解HTML5中的picture元素响应式处理图片

    这篇文章主要介绍了详解HTML5中的picture元素响应式处理图片,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. canvas像素点操作之视频绿幕抠图

    这篇文章主要介绍了canvas像素点操作之视频绿幕抠图的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. html5利用canvas实现颜色容差抠图功能

    这篇文章主要介绍了html5利用canvas实现颜色容差抠图功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

  9. canvas绘制视频封面的方法

    这篇文章主要介绍了canvas绘制视频封面的方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  10. HTML5拖拽功能实现的拼图游戏

    本文通过实例代码给大家介绍了HTML5拖拽功能实现的拼图游戏,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧

返回
顶部