返回介绍

一、Canvas 简介

发布于 2024-06-21 00:35:13 字数 1760 浏览 0 评论 0 收藏 0

1.1 什么是 canvas?(了解)

  • 是 HTML5 提供的一种新标签
<canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆布 画布
  • Canvas 是一个矩形区域的 画布 ,可以用 JavaScript 在上面绘画。控制其每一个像素。
  • canvas 标签使用 JavaScript 在网页上绘制图像,本身不具备绘图功能。
  • canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。
  • HTML5 之前的 web 页面只能用一些固定样式的标签:比如 p、div、h1 等

1.2 canvas 主要应用的领域(了解)

  1. 游戏:canvas 在基于 Web 的图像显示方面比 Flash 更加立体、更加精巧,canvas 游戏在流畅度和跨平台方面更牛。
    25 超棒的 HTML5 Canvas 游戏
  2. 可视化数据.数据图表话,比如: 百度的 echart
  3. banner 广告:Flash 曾经辉煌的时代,智能手机还未曾出现。现在以及未来的智能机时代,HTML5 技术能够在 banner 广告上发挥巨大作用,用 Canvas 实现动态的广告效果再合适不过。
  4. 未来=> 模拟器:无论从视觉效果还是核心功能方面来说,模拟器产品可以完全由 JavaScript 来实现。
  5. 未来=> 远程计算机控制:Canvas 可以让开发者更好地实现基于 Web 的数据传输,构建一个完美的可视化控制界面。
  6. 未来=> 图形编辑器:Photoshop 图形编辑器将能够 100%基于 Web 实现。
  7. 其他可嵌入网站的内容(多用于活动页面、特效):类似图表、音频、视频,还有许多元素能够更好地与 Web 融合,并且不需要任何插件。
  8. 完整的 canvas 移动化应用
  9. 我们课程的目标
    • 我们不是主要做游戏开发的
    • 要求必须会做基本的用 canvas 绘制的特效页面:比如,传智前端官网。
    • 会用 canvas 做一些简单的广告、活动页面
  10. 我们课程的案例和项目演示
  11. canvas 的标准:

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文