HTML5 Canvas进行自定义变换语法
<script>
cntx.transform(val1,val2,val3,val4,val5,val6);
</script>
HTML5 Canvas进行自定义变换示例
<html>
<head>
<style>
body
{
margin: 0px;
padding: 0px;
}
</style>
<script>
window.onload = function () {
var cnv = document.getElementById("cnvx");
var cntx = cnv.getContext("2d");
var rectWidth = 200;
var rectHeight = 100;
var tx = cnv.width/4;
var ty = cnv.height/3;
//Fill hear custon tranform
cntx.transform(.5, 0, 0, 1, tx, ty);
cntx.fillStyle = "blue";
cntx.fillRect(-rectWidth/2, -rectHeight/2, rectWidth, rectHeight);
};
</script>
</head>
<body>
<canvas id="cnvx" width="578" height="200"></canvas>
</body>
</html>
在html5中Canvas自定义转换
自定义转换用于将元素设置为矩阵形式。
因为它需要六个以3 * 3形式的值。
对于自定义变换,我们使用变换()方法。
日期:2020-04-11 23:04:07 来源:oir作者:oir
