canvas
z_healthy
这个作者很懒,什么都没留下…
展开
-
微信小程序 canvas实现手动签名
<canvas class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true" bindtouchstart="canvasStart" bindtouchmove="canvasMove" bindtouchend="canvasEnd" touchcancel="canvasEnd" binderror="canvasIdErrorCallback"></canvas>Pa原创 2021-06-17 14:58:57 · 169 阅读 · 0 评论 -
canvas基础知识(三)创建使用图片
由零开始创建图像var img = new Image(); // 创建img元素img.onload = function(){ // 执行drawImage语句 drawImage(image, x, y) //其中 image 是 image 或者 canvas 对象,x 和 y 是其在目标 canvas 里的起始坐标。}img.src = 'myImage.png'; // 设置图片源地址drawImagedrawImage(image, x, y)//其中 imag原创 2021-04-01 09:01:00 · 604 阅读 · 0 评论 -
canvas基础知识(二)画矩形、饼
<style type="text/css"> #myc{ width: 500px; height: 500px; } </style>const canvas = document.querySelector("#myc");canvas.style.border = '1px solid red';//此属性设置的是元素的样式;const ctx = canvas.getContext("2d");ctx.rect(100,50,100,100);ctx原创 2020-11-19 16:53:47 · 127 阅读 · 0 评论 -
canvas基础(一)划线、调整字间距
声明canvas标签<canvas id="can" width="500" height="500"> 如果不支持此标签的显示方式:</canvas>基础动作:划线 const canvas = document.querySelector("#can"); const ctx = canvas.getContext("2d");//3d为webgl ctx.moveTo(100,100);//首先移动到某个点; ctx.lineTo(200,100);原创 2020-11-18 19:41:31 · 1346 阅读 · 0 评论