美文网首页
html5(2)

html5(2)

作者: w_01 | 来源:发表于2017-06-25 23:32 被阅读0次
        canvas:画布
        getContext('2d'):绘图对象
        stroRect(x,y,width,height):不填充颜色,边框默认黑色
        fillRect(x,y,width,height):默认填充黑色,无边框
        clearRect(x,y,width,height):清除制定画布
        fillStyle:设置填充色,先设置颜色
        strokeStyle:设置边框颜色,先设置
        lineWidth:设置边框宽度,先设置
        line='round'设置边界连接样式  圆角
        line='bevel'设置边界连接样式  斜角
    
        画线
        moveTo(x,y):起始点
        lineTo(x,y):结束点
        stroke():绘制路径
        fill():填充路径
        beginPath():开始绘制路径
        closePath():结束绘制
    
        画圆
        arc(x,y,半径,起始弧度,结束弧度,旋转方向)
        x,y为圆心点
        弧度=角度*Math.PI/180
    
        drawImage()设置图片 三个属性img,x,y
            五个属性img,x,y,width,height
            九个属性img,sx,sy,swidth,sheight,x,y,width,height
        createPattern() 设置背景 两个属性img,平铺方式
        createLinearGradient(x,y,x2,y2)线性渐变
        createRadialGradient(x1,y1,r1,x2,y2,r2) 放射性渐变
        strokeText(文字,x,y,) 空心文本
        fillText(文字,x,y,) 实心文本
        font='大小 字体'
        textAlign左右对齐方式
        textBaseLine上下对齐方式
        measureText(文本) 文本宽度
        shadowOffsetX,shadowOffsetY 文本阴影X和Y轴偏移
        shadowBlur 高斯模糊
        shadowColor 阴影颜色

    相关文章

      网友评论

          本文标题:html5(2)

          本文链接:https://www.haomeiwen.com/subject/htqdcxtx.html