全国热线:0536-8800925
新闻动态

初步了解什么是 Canvas

HTML5 的 canvas 元素使用 javaScript 在网页上绘制图像。
画布是一个矩形区域,您可以控制其每一像素。
canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。
不过,<canvas> 元素本身并没有绘制能力(它仅仅是图形的容器) - 您必须使用脚本来完成实际的绘图任务。
getContext() 方法可返回一个对象,该对象提供了用于在画布上绘图的方法和属性。
 
基本知识

    context:一直觉得这个翻译成“上下文”真够蛋疼的,context是一个封装了很多绘图功能的对象,获取这个对象的方法是  
        var context =canvas.getContext("2d");
        也许这个2d勾起了大家的无限遐想,但是很遗憾的告诉你html5还只是个少女,不提供3d服务。
   
    canvas元素绘制图像的时候有两种方法,分别是
        context.fill()//填充
        context.stroke()//绘制边框
   
    style:在进行图形绘制前,要设置好绘图的样式
        context.fillStyle//填充的样式
        context.strokeStyle//边框样式
   
    context.lineWidth//图形边框宽度
   
    颜色的表示方式:
         直接用颜色名称:"red" "green" "blue"
         十六进制颜色值: "#EEEEFF"
         rgb(1-255,1-255,1-255)
         rgba(1-255,1-255,1-255,透明度)
 
     和GDI是如此的相像,所以用过GDI的朋友应该很快就能上手
 
在线咨询
Tel

0536-8800925

关注我们微信