博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML5_Canvas(2)
阅读量:6449 次
发布时间:2019-06-23

本文共 1146 字,大约阅读时间需要 3 分钟。

context.drawImage(imageObj,destX,destY);

//为某个画布贴上图片

 

例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
window.onload =
function
(){
    
var 
canvas = document.getElementById(
"myCanvas"
);
    
var 
context = canvas.getContext(
"2d"
);
  
    
var 
destX = 69;
    
var 
destY = 50;
  
    
var 
imageObj =
new 
Image();
    
imageObj.onload =
function
(){
        
context.drawImage(imageObj, destX, destY);
    
};
    
imageObj.src =
"darth-vader.jpg"
;
};

 

context.drawImage(imageObj,destX,destY,destWidth,destHeight);

//同上,在某个矩形框内显示图片,原始图片等比缩放
 

context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight);

//截取原始图片的一个部分在矩形框内显示
 

context.font=[value];

//文字字体,例子:
context.font = "40pt Calibri";
 

context.fillStyle=[value];

//文字颜色
 

context.strokeStyle=[value];

context.strokeText("Hello World!", x, y);

//文字样式
 

context.textAlign=[value];

//文字显示在左边,中间还是右边
 

context.textBaseline=[value];

//文字显示在上面,中间还是下面(top, hanging, middle, alphabetic,ideographic, and bottom)
 

context.shadowOffsetX=[value];

context.shadowOffsetY=[value];

//增加阴影

 

context.globalAlpha=[value];

//设置透明度,从0到1

本文转自轩脉刃博客园博客,原文链接:http://www.cnblogs.com/yjf512/archive/2011/09/12/2173918.html,如需转载请自行联系原作者

你可能感兴趣的文章
linux关闭在线登录用户
查看>>
Linux系统之加密、解密、openssl的基本应用及CA的实现过程
查看>>
传苹果Siri中文版下月推出 支持更多国家语言
查看>>
Ubuntu 12.10 图形化界面登陆root用户,不显示登陆界面
查看>>
Python 网络爬虫单线程版
查看>>
Ubuntu 安装 .bundle 文件
查看>>
老师是怎么爬坑的-springCloud篇
查看>>
如何创建一个https的站点
查看>>
vim常用用法
查看>>
sqlmap命令
查看>>
13点建议,三个月,顺利搞定8千以上Java面试及笔试题
查看>>
shell练习-awk命令
查看>>
Canvas贝塞尔曲线
查看>>
看 nova-scheduler 如何选择计算节点 - 每天5分钟玩转 OpenStack(27)
查看>>
修改默认ssh端口
查看>>
使用CocoaPods管理iOS的第三方类库
查看>>
Go 性能优化技巧 6/10
查看>>
Spring @Async
查看>>
Python 函数
查看>>
制作自己的Winpe镜像(3):Wim镜像捕获及Wim镜像应用
查看>>