HTML 5中的Canvas画布是什么？

时间:2017-08-31 18:10酷播

画布是一个可以在其上绘制图形的HTML区域。

访问画布区域

要在画布区域上绘制图形，我们首先需要获取上下文的引用部分。下面就是用于画布部分的代码。

var c=document.getElementById("mycanvas"); var ctx=c.getContext("2d");

绘制图形

一旦你可以使用上下文对象，就可以开始上下文绘制。所以首先调用“move”方法，从一个点开始，使用线方法画线，然后敲击键盘应用结束。

    
            <a name="WhatisthedifferencebetweenCanvasandSVGgraphics">What is the difference between Canvas and SVG graphics? </a>
        

注：从前面的两个问题中我们可以看到画布和SVG都可以在浏览器上绘制图形。所以在这个问题上面试官可能会要你回答什么时候用哪个。

SVG	Canvas
绘制并记忆。换句话说就是，通过使用SVG绘制的任意形状都可以被记住和操作，并且浏览器可以再次渲染它。 SVG可以很好地用于创建如CAD软件的图形，绘制之后允许用户操作。这是一个缓慢的过程，因为它需要记住坐标以便于后续操作。我们可以有与图形对象相关联的事件处理程序。分辨率独立。	画布则是绘制然后遗忘。一旦绘制完成，你就不能访问和处理像素。 Canvas则用于绘制和遗忘类似动漫和游戏的场画。它就快多了，因为没有必要记住后面的东西。我们不需要将事件处理程序与图形对象关联，因为我们不需要引用它们。分辨率依赖。

首页