摘要: 样式填充 fillStyle = color 颜色值 gradient 渐变色 image 图片 canvas 画布 video 视频 strokeStyle也适用 1、fillStyle = color可以填充任何css承认的颜色值 2、fillStyle = gradient 渐变色(线性渐变| 阅读全文
posted @ 2017-02-07 17:07 crystalhuhu 阅读(518) 评论(0) 推荐(0) 编辑
摘要: 1、图形变换和保存 之前五角星用rot,计算旋转角度可以进行图形旋转,改变半径大小可以设置五角星的大小,下面介绍自带的函数进行图形变化 这是一个画出一片星空的例子 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> 阅读全文
posted @ 2017-02-07 16:20 crystalhuhu 阅读(496) 评论(0) 推荐(0) 编辑
摘要: 以上是线条的四个属性 1、lineWidth详解 先填充后描边,描边的宽度才是对的,如果先描边后填充,描边的宽度会有所减少 2、lineCap详解 解决方法①用closePath()来封闭路径 ②用lineCap = "square" 3、lineJoin详解 当设置了miter属性时,(默认mit 阅读全文
posted @ 2017-02-07 15:03 crystalhuhu 阅读(272) 评论(0) 推荐(0) 编辑
摘要: 先讲如何画一个正规的五角星 在五角星的内外画两个圆,五角星有五个角,360/5=72度 所以得出这两个角的度数 然后算出这两个点坐标 角度转弧度 角度/180*Math.PI 所以外顶点坐标 x: Math.cos( (18+72*i)/180*Math.PI) * R y: Math.sin((1 阅读全文
posted @ 2017-02-07 15:03 crystalhuhu 阅读(13927) 评论(0) 推荐(2) 编辑
摘要: 以上是快捷绘制矩形的函数,你可能要问有fillRect和strokeRect还要rect那个干吗? 下面是三种不同的方式绘制矩形 阅读全文
posted @ 2017-02-07 13:02 crystalhuhu 阅读(475) 评论(0) 推荐(0) 编辑