在程序的世界中,可以让计算机按照指令做很多事情, 如进行数值计算、图像显示、语音对话、视频播放、天文计算、发送邮件、游戏绘图以及任何我们可以想象到的事情。 要完成这些任务,程序需要使用数据,即承载信息的数字与字符。 在计算机中,数据的性质和表示方式可能不同。 所以需要将相同性质的数据归类,并用一定数 ...
分类:
其他好文 时间:
2020-05-19 12:48:48
阅读次数:
52
上一篇给大家讲了一下canvas的一些概念性的东西,这一篇我们来讲一下canvas的最基础的应用: 定义一个canvas:?? var ctx =document.getElementById_x("canvas").getContext('2d'); (1)画图 ctx.fillStyle="rg ...
分类:
其他好文 时间:
2020-05-18 21:06:54
阅读次数:
63
如何实现小程序刮刮卡呢? 思路是: 1. 先将中奖的图片或者文字位置和大小确定 2. 开始画canvas,将位置和大小跟之前中奖的文案的位置保持一致。 3. 在canvas上覆盖一层灰色的蒙层,作出刮刮卡未刮之前的效果 具体代码如下 4. 开始做刮刮卡的动作,在canvas定义bindtouchst ...
分类:
微信 时间:
2020-05-18 18:43:50
阅读次数:
151
本篇主要讲述九宫格上传图片 图片编辑实现效果: 图片编辑实现原理: 实现九宫格编辑图片可以做成一个组件,使用原生的图片上传方式通过 input 标签上传图片 一般图片都挺大,避免用户等待时间过长,使用 canvas 将上传的图片进行压缩 每次成功上传一张图片 && 图片总量 < 9 就在图片数组后p ...
分类:
Web程序 时间:
2020-05-18 18:38:24
阅读次数:
65
欲实现的水印平铺的效果图如下: 从图上看,应该做到以下几点: 文字在X和Y方向上进行平铺; 文字进行了一定的角度的旋转; 水印作为背景,其z-index位置应位于页面内容底部, 即不能覆盖页面主内容; 平铺的水印应能随窗口大小改变进行自适应。 思路: 首先我们先在canvas上绘制如下图所示一小块画 ...
分类:
其他好文 时间:
2020-05-18 18:23:45
阅读次数:
67
写在之前 canvas 元素中提供了看似简单的绘图方法,但仔细挖掘,可以以此做出非常复杂而漂亮的图形。随着 API 的逐渐完善,我相信自己能进行更多有意思的尝试。 时钟的 canvas + js 实现主要是应用上下文的简单变换、文本添加及周期性调用方法 setInterval(func, delay ...
分类:
其他好文 时间:
2020-05-18 16:55:48
阅读次数:
52
计算机图像处理是一门很成熟的技术,任何一门可操作系统接口的语言都能很轻易的实现各种处理操作。但是前端限于浏览器环境和接口限制,处理起来会有诸多不便,这里所说的前端图像处理,是真的指不借助任何后端服务纯前端实现的图像处理。本文会介绍canvas位图处理,SVG矢量图和CSS3图像处理,重点是canva ...
分类:
其他好文 时间:
2020-05-18 14:21:53
阅读次数:
63
前端html部分 //canvas.html <!DOCTYPE html> <html manifest="/test.appcache"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <tit ...
分类:
Web程序 时间:
2020-05-18 12:03:32
阅读次数:
61
在日常使用中,难免发现默认的绘图不太符合我们的需求,这时就可以根据自己的需要通过自定义模板来实现自己想要的绘图效果。
分类:
移动开发 时间:
2020-05-18 09:32:07
阅读次数:
69
环形进度条的问题,网上有很多的demo,也有各种不同的实现方式,很棒的实现也有很多,我这自己做一下一方面是想开阔一下自己的思路,一方面好久没看SVG和Canvas的东西了,基础的拿来熟悉下。 DIV + CSS3 这个是最基本的实现方式,我在想怎样用尽量少的DOM结构来实现,最终还是用了三个div, ...
分类:
其他好文 时间:
2020-05-17 23:08:18
阅读次数:
98