html5 canvas缩放变换
2024-09-04 10:14:40
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图像缩放</title>
<script src="js/modernizr.js"></script>
</head> <body>
<script type="text/javascript">
window.addEventListener('load',eventWindowLoaded,false);
function eventWindowLoaded(){
canvasApp();
}
function canvasSupport(){
return Modernizr.canvas;
}
function canvasApp(){
if(!canvasSupport()){
return;
}else{
var theCanvas = document.getElementById('canvas')
var context = theCanvas.getContext("2d") }
drawScreen();
function drawScreen(){ context.setTransform(1,0,0,1,0,0);
var x = 100;
var y = 100;
var width = 50;
var height = 50;
context.translate(x+.5*width,y+.5*height);
context.scale(2,2);//横,纵
context.fillStyle="red";
context.fillRect(-.5*width,-.5*height,width,height); } } </script>
<canvas id="canvas" width="500" height="500">
你的浏览器无法使用canvas
小白童鞋;你的支持是我最大的快乐!!
</canvas>
</body>
</html>
最新文章
- 初识Jsp,JavaBean,Servlet以及一个简单mvc模式的登录界面
- Radmin Server-3.5 完美绿色破解版(x32 x64通用) 第三版 + 单文件制作方法
- windows 安装 go语言
- http请求和http响应详细解析
- 【linux 命令】:查看系统开机,关机时间【转载】
- .net webapi项目中支持session
- 不要怂,就是GAN (生成式对抗网络) (六):Wasserstein GAN(WGAN) TensorFlow 代码
- mysql创建数据表时如何判断是否已经存在?
- instanceof 是如何工作的
- HDU 2296:Ring
- 帆软报表(finereport)决策平台笔记(持续更新)
- JAVA_maven 配置
- docker容器下mysql更改WordPress的site address和home(URL)------局域网
- iptables nat 技术转发
- OCP 12c考试题,062题库出现大量新题-第20道
- 621. Task Scheduler
- 《Java并发编程实战》笔记-Happens-Before规则
- Oracle服务无法启动,报:Windows无法启动OracleOraDb10g_home1TNSListener服务,错误 1067:进程意外终止。
- Transparent Huge Pages
- Oracle查询session连接数和inactive以及 概要文件IDLE_TIME限制用户最大空闲连接时间