之前按照例子,加载图像,发现加载图像,加载不上去,代码也没有错误,经过几次的尝试:发现需要重复调用下drawImage才可以。

<script type="text/javascript">
var c=document.getElementById("Canvas");
var cxt=c.getContext("2d");
var img=new Image()
img.src="1.png"
cxt.drawImage(img,0,0);
</script>

​后来,发现应该是加载的问题,大多数支持 canvas 标记的浏览器的当前版本中,当图片还没有加载完成时,如果你要去画它,结果是什么事情都不会发生。也就是说,如果你想画一个图片,你需要等它完全加载。你可以使用图片对象的 onload 函数来进行判断。

<script type="text/javascript">

var c=document.getElementById("Canvas");
var cxt=c.getContext("2d");
var img=new Image()
img.src="1.png"
image.onload = function()
{
cxt.drawImage(img,0,0)
}
</script>

canvas加载图像的更多相关文章

  1. Android异步加载图像(含线程池,缓存方法)

    研究了android从网络上异步加载图像: (1)由于android UI更新支持单一线程原则,所以从网络上取数据并更新到界面上,为了不阻塞主线程首先可能会想到以下方法. 在主线程中new 一个Han ...

  2. Android 多种方式正确的加载图像,有效避免oom

    图像加载的方式: Android开发中消耗内存较多一般都是在图像上面,本文就主要介绍怎样正确的展现图像减少对内存的开销,有效的避免oom现象.首先我们知道我的获取图像的来源一般有三种源头:1.从网络加 ...

  3. 转: Android异步加载图像小结

    转:http://blog.csdn.net/sgl870927/article/details/6285535 研究了android从网络上异步加载图像,现总结如下: (1)由于android UI ...

  4. 使用js加载图像和setDataXML()加载数据

    使用js加载图像和setDataXML()加载数据 前面一篇对FusionCharts进行了一个简单的介绍,而且建立了我们第一个图形,但是那个是在HTML中使用<OBJECT>和<E ...

  5. canvas加载图片需要二次刷新的问题

    如题:此问题我也经在百度问问上进行了解答.https://zhidao.baidu.com/question/1048045241465845579.html 好吧,难怪现在百度那么坑人,理论水军专家 ...

  6. [Flutter] Image.File 加载图像时文件内容变化显示不变解决

    在Flutter中,我们可以用下面的代码从文件中加载图像: Image.file(File(_fileName)); 这个时候,当_fileName这个文件名称和路径不变,文件内容变化时,Flutte ...

  7. touchweb手机网站图片加载方法(canvas加载和延迟加载)

    一.canvas图片加载 关于canvas加载,我的方法是,将文章中所有用到图片的地方,都用canvas代替,给canvas一个data-src,里面存放img的路径,通过canvas方法渲染图片.因 ...

  8. canvas加载进度条

    <!DOCTYPE html> <html><head><meta http-equiv="Content-Type" content=& ...

  9. 学习笔记TF016:CNN实现、数据集、TFRecord、加载图像、模型、训练、调试

    AlexNet(Alex Krizhevsky,ILSVRC2012冠军)适合做图像分类.层自左向右.自上向下读取,关联层分为一组,高度.宽度减小,深度增加.深度增加减少网络计算量. 训练模型数据集 ...

随机推荐

  1. 如何获取网站icon

    获取网站icon,常用最简单的方法就是通过website/favicon.ico来获取,不过由于很多网站都是在页面里面设置favicon(<link rel="shortcut ico ...

  2. android EditText内嵌图片

    如下所示: 主要用到的属性:android:drawableLeft <EditText android:layout_width="match_parent" androi ...

  3. PHP 中的数组

    PHP中的数组是指一个键/值对的集合.PHP中的数组是使用哈系表构建的,这意味着访问每一个值都会有一个平均的O(1)复杂度. $arr=array([key=>]value,....); 在这里 ...

  4. 磁盘IO单线程顺序写时最快的,如果多线程写,磁盘的磁头要不断重新寻址,所以写入速度反而会慢

    (1) 读写最好还是不要多线程,硬盘读写的速度有限,单线程时已经满负荷了,多线程又会增加线程之间的切换,会增加时间. 如果想增加读写速度,应该增加硬盘,做raid (2)首先是硬盘的写入是串行的,CP ...

  5. COJ 0244 HDNOIP201404最短路径

    HDNOIP201404最短路径 难度级别: A: 编程语言:不限:运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述 a.b.c是3个互不相等的1 ...

  6. SQL with as 替代临时表的用法

    原文地址:http://www.cnblogs.com/zerocc/archive/2011/11/28/2266180.html SQL中 WITH AS 的用法和注意事项 1.为什么使用with ...

  7. 设置MyEclipse的右击新建后面的选项

    转自:http://blog.sina.com.cn/s/blog_929b09ac010197g6.html,做了修改 最近发现在MyEclipse右击后,新建后面的菜单选项太少了,新建一个文件,还 ...

  8. (转)pem, cer, p12 and the pains of iOS Push Notifications encryption

    转自:http://cloudfields.net/blog/ios-push-notifications-encryption/ The serious pains of setting up a ...

  9. 现代的新语言--Swift初探

    新的语言 WWDC简短的介绍,新的语言Swift就问世了,尽管新语言的名字导致贴吧下歌手粉丝和开发人员们争抢地盘- -,只是雨燕就是这么来了. WWDC keynote里给Swift打上了非常多标签: ...

  10. IIS7 常用模块介绍说明

    1.1.0   IIS常用的功能模块介绍: 1)         静态内容:可发布静态 Web 文件格式,比如 HTML 页面和图像文件. 2)         默认文档:允许您配置当用户未在 URL ...