var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("tulip");
ctx.drawImage(img,10,10,200,200);

学习canvas时,发现当在Chrome和Opera中运行上面代码是,画布中并不能显示出相应的图片,后来通过查询才明白,图片加载是异步加载,当调用draw Image()时,图片信息还没加载完,所以无法显示,很简单的解决方法就是把

ctx.drawImage(img,10,10,200,200);
这段代码放进window.onload中;

关于Chrome和Opera中draw Image()方法无法在canvas画布中绘制图片的问题的更多相关文章

  1. [原]unity中WWW isDone方法只能在主线程中调用

    项目中要使用动态加载,原计划是生成WWW对象后,放到一个容器里.由一个独立线程轮询容器里的对象,如果www.isDone为true时,回调一个接口把结果交给请求方. new Thread( new T ...

  2. android中Canvas使用drawBitmap绘制图片

    1.主要的绘制图片方法 //Bitmap:图片对象,left:偏移左边的位置,top: 偏移顶部的位置     drawBitmap(Bitmap bitmap, float left, float ...

  3. H5 Canvas | 画布中变量作用域与setInterval方法同步执行探究

    Demo - 随机绘制圆环 实现思路: 将一个圆环的绘制分成100份,setInterval()方法定义每隔时间n绘制一段新的,每份的开始路径都是上一次的结束路径,实现步进绘制. 通过Math.ran ...

  4. 利用pandas库中的read_html方法快速抓取网页中常见的表格型数据

    本文转载自:https://www.makcyun.top/web_scraping_withpython2.html 需要学习的地方: (1)read_html的用法 作用:快速获取在html中页面 ...

  5. Java小题,通过JNI调用本地C++共享库中的对应方法实现杨辉三角的绘制

    1.在Eclipse中配置Javah,配置如下 位置是你javah.exe在你电脑磁盘上的路径 位置:C:\Program Files\Java\jdk1.8.0_112\bin\javah.exe ...

  6. canvas toDataURL() 方法如何生成部分画布内容的图片

    HTMLCanvasElement.toDataURL() 方法返回一个包含图片展示的 data URI .可以使用 type参数其类型,默认为 PNG 格式.图片的分辨率为96dpi. 如果画布的高 ...

  7. 小程序中曾经遇到的坑(1)----canvas画布

    目前正在开发小程序,在开发过程中,总会遇到一些坑,而这些坑并不会有很多开发者遇到而说出来.这里先记录一条我开发过程中遇到的问题,以便后人在开发中能够更容易的解决问题!!! 首先,小程序在canvas画 ...

  8. junit4 assert类中的assert方法总结

    junit中的assert方法全部放在Assert类中,总结一下junit类中assert方法的分类. 1.assertTrue/False([String message,]boolean cond ...

  9. junit中的assert方法总结

    junit中的assert方法全部放在Assert类中,总结一下junit类中assert方法的分类.1.assertTrue/False([String message,]boolean condi ...

随机推荐

  1. 多线程辅助类-CountDownLatch的用法

    转自:http://www.iteye.com/topic/1002652 CountDownLatch,一个同步辅助类,在完成一组正在其他线程中执行的操作之前,它允许一个或多个线程一直等待. 主要方 ...

  2. Linux下监控网卡流量的软件iftop

    官网上说使用iftop需要libpcap和libcurses这两个包. 用命令查找了一下 #  rpm -qa | grep libpcap libpcap-0.9.4-15.el5 只找到了这个,缺 ...

  3. BZOJ_4010_[HNOI2015]菜肴制作_拓扑排序+贪心

    BZOJ_4010_[HNOI2015]菜肴制作_拓扑排序+贪心 Description 知名美食家小 A被邀请至ATM 大酒店,为其品评菜肴. ATM 酒店为小 A 准备了 N 道菜肴,酒店按照为菜 ...

  4. ubuntu16.04 跑Apollo Demo

    1.安装docker(参考网址:https://docs.docker.com/install/linux/docker-ce/ubuntu/) Uninstall old versions Olde ...

  5. C++之友元机制(友元函数和友元类)

    一.为什么引入友元机制? 总的来说就是为了让非成员函数即普通函数或其他类可以访问类的私有成员,这确实破坏了类的封装性和数据的隐蔽性,但为什么要这么做呢? (c++ primer:尽管友元被授予从外部访 ...

  6. 错误 128 无法将类型“string”隐式转换为“System.Windows.Forms.DataGridViewTextBoxColumn”

    原因是DataGridView中列的Name属性值和DataPropertyName属性值一样,比如Name="CardID",DataPropertyName="Car ...

  7. bzoj1941

    KD-tree **了这道题 这个估价函数好鬼畜,把min打成max... 关于min的估价函数非常鬼畜,具体我也不知道为什么. #include<bits/stdc++.h> using ...

  8. javamail - 发件、收件(SSL连接)

    需要的包:mail.jar  jsse.jar(说明:jsse.jar是jre自带的,如果jdk1.5及以下需要Java Activation Framework框架的activation.jar) ...

  9. org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'bireportSqlSessionFactory' defined in URL

    报错如下: org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'birepo ...

  10. CSS动画的性能分析和浏览器GPU加速

    此文已由作者袁申授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 有数的数据大屏可以在一块屏幕上展示若干张不同的图表,以炫酷的方式展示各种业务数据.其中有些图表使用CSS实现了 ...