Canvas是什么

子凡 问答 2020-08-12 12:17:28 阅读(...)

画布(Canvas)元素是 HTML5 的一部分,允许脚本语言(scripting languages)动态渲染位图像。

Canvas API(画布)是在 HTML5 中新增的标签用于在网页实时生成图像,并且可以操作图像内容,基本上它是一个可以用 JavaScript 操作的位图(bitmap)。

画布 Canvas

画布(Canvas)元素是 HTML5 的一部分,允许脚本语言(scripting languages)动态渲染位图像。

它最初由苹果内部使用自己 Mac OS X WebKit 推出,供仪表盘的构件和 Safari 浏览器等应用程序使用。后来,它被 Gecko 内核的浏览器(尤其是 Mozilla Firefox),Opera 和 Chrome 实现,并被网页超文本应用技术工作小组提议为下一代的网络技术的标准元素。在介绍 Canvas 给不同的 Web 标准社区时,他们有不同的反应。有些人抱怨苹果公司建设了一个新的专有标准而不是支持未被网络开发商广泛接受的 SVG 标准。

Canvas 是由 HTML 代码配合高度和宽度属性而定义出的可绘制区域。JavaScript 代码可以访问该区域,类似于其他通用的二维 API,通過一套完整的绘图函数来动态生成图形。一些可能的用途,包括使用 Canvas 构造图形,动画,游戏和图片。如果您要在 HTML 中加入 canvas 元素,请将以下代码加入到部分中。

大多数 Canvas 绘图 API 都没有定义在 <canvas> 元素本身上,而是定义在通过画布的 getContext() 方法获得的一个“绘图环境”对象上。

Canvas API 也使用了路径的表示法。但是,路径由一系列的方法调用来定义,而不是描述为字母和数字的字符串,比如调用 beginPath() 和 arc() 方法。

一旦定义了路径,其他的方法,如 fill(),都是对此路径操作。绘图环境的各种属性,比如 fillStyle,说明了这些操作如何使用。

注释:Canvas API 非常紧凑的一个原因上它没有对绘制文本提供任何支持。要把文本加入到一个 <canvas> 图形,必须要么自己绘制它再用位图图像合并它,或者在 <canvas> 上方使用 CSS 定位来覆盖 HTML 文本。

Canvas 对象的属性

height 属性

画布的高度。和一幅图像一样,这个属性可以指定为一个整数像素值或者是窗口高度的百分比。当这个值改变的时候,在该画布上已经完成的任何绘图都会擦除掉。默认值是 150。

width 属性

画布的宽度。和一幅图像一样,这个属性可以指定为一个整数像素值或者是窗口宽度的百分比。当这个值改变的时候,在该画布上已经完成的任何绘图都会擦除掉。默认值是 300。

收藏 0个人收藏
走进科技生活方式

评论交流

泪雪默认头像 请「登录」后参与评论
  1. 加载中..

相关推荐

  • HTML5

    HTML5是H5吗

    H5是HTML5的缩写,是一种网页技术标准,包含网页展示、网页交互动画等等。 H5动画指的就是利用 HTML5 技术做出来的网页,行业内统称为网页。
  • jQuery

    jQuery Cropper是什么

    jQuery Cropper(Cropper.js)是一款使用简单且功能强大的图片剪裁 jQuery 插件。该图片剪裁插件支持图片放大缩小,支持图片旋转,支持触摸屏设备,支持 canvas,并且支持跨浏览器使用。
  • D3.js

    D3.js是什么

    D3.js是一个使用动态图形进行数据可视化的JavaScript程序库。与W3C标准兼容,并且利用广泛实现的SVG、JavaScript和CSS标准,改良自早期的Protovis程序库。与其他的程序库相比,D3对视图结果有很大的可控性。
  • Three.js

    Three.js是什么

    Three.js是一个跨浏览器的脚本,使用JavaScript函数库或API来在网页浏览器中创建和展示动画的三维计算机图形。Three.js使用WebGL。源代码托管在GitHub。
  • WebGL

    WebGL是什么

    WebGL是一种JavaScript API,用于在不使用插件的情况下在任何兼容的网页浏览器中呈现交互式2D和3D图形。WebGL完全集成到浏览器的所有网页标准中,可将影像处理和效果的GPU加速使用方式当做网页Canvas的一部分。
  • 微信小程序

    小程序开发用什么语言

    小程序开发使用JS+CSS+HTML5语言。小程序是基于微信平台的轻量级应用,它的开发是应用微信提供的小程序前端规范,结合企业自己开发的应用后端来制作的。