下面我们来正式学习WebGL开发中的一些基本的概念和知识。
一、HTML画布
为了在 Web 上创建图形应用程序,HTML5 提供了一组丰富的功能,例如 2D Canvas、WebGL、SVG、3D CSS 转换和 SMIL。要编写 WebGL 应用程序,就需要用到 HTML5 的画布元素。
1.1 HTML5 画布
HTML5 的标签提供了一个简单而强大的选项来实现 JavaScript 的图形绘制,它不仅可以用于绘制图形、制作照片构图,还可以用它开发炫酷的动画。一个最简单的元素,只需要指定id、width、height等属性即可,如下所示。
<canvas id = "mycanvas" width = "100" height = "100"></canvas>
canvas 标签具有三个属性,即 id、width 和 height,这些属性决定画布的大小。如果程序员没有在 canvas 标签下指定它们,那么默认情况下,Firefox、Chrome 和 Web Kit 等浏览器会提供大小为 300 × 150 的 canvas 元素。文章来源:https://www.toymoban.com/news/detail-625741.html
下面是一个HTML画布的示例。文章来源地址https://www.toymoban.com/news/detail-625741.html
<html>
<head>
<style>
#mycanvas{border:1px solid red;}
</style>
</head>
<body>
<canvas id = "mycanvas" width = "100" height = "100"
到了这里,关于WebGL系列教程:WebGL基础知识的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!