一个自定义扇形图表,内部嵌套折线,点

2018-06-26
阅读 5 分钟
2.3k
直接复制粘贴就能看到效果。此图考察了svg的各种使用;其中包含了,绘制圆形、圆环,点,折线,多边形,水平居中文字,三角函数计算坐标。关于手机端适配方面,直接使用svg的viewbox来实现。因为svg是矢量图形,无论放大缩小都不失真,所以可以用适用各种设备且效果显示出众。公司给的设计稿是375宽度,我就用了375.你们...

canvas实际项目操作,包含:线条,圆形,扇形,图片绘制,图片圆角遮罩,矩形,弧形文字

2016-08-13
阅读 6 分钟
11.7k
上面的代码直接复制进你的html文件里打开就能看到效果。注意事项:开始时按240像素大小的画布写,最后发现放在分辨率高的手机上全是锯齿,所以最后采用960的宽高来写。绘制完图片(头像)会覆盖整个画布,所以图片得最后绘制。弧形文字需要一点一旦调整弧度。留言:如有疑问关注我给我留言,我们一起成为大牛!

小白上学のcanvas零基础

2016-08-03
阅读 7 分钟
2.6k
<canvas> 看起来和 <img> 元素很相像,唯一的不同就是它并没有 src 和 alt 属性。实际上,<canvas> 标签只有两个属性—— width和height。当没有设置宽度和高度的时候,canvas会初始化宽度为300像素和高度为150像素。该元素可以使用CSS来定义大小,但在绘制时图像会伸缩以适应它的框架尺寸:如果CSS的尺...

小白上学のWebpack零基础学习指导

2016-07-26
阅读 6 分钟
2.6k
前言: {代码...} 闲谈: {代码...} nodejs安装: {代码...} smart-npm优化下载速度: {代码...} webpack全局安装: {代码...} 新建项目: {代码...} 一直按回车;完成后现在项目里面就有一个package.json, 我们多加一点东西;建立以下文件: {代码...} 添加了两个js文件,添加了最重要的webpack->webpack.config.js...