Webgl学习系列-认识Webgl

Webgl学习系列

第一章 认识Webgl


文章目录


一、什么是webgl?

webgl是一种3D绘图协议,衍生于 OpenGL ES2.0,可以结合 Html5 和 JavaScript 在网页上绘制和渲染二/三维图形。

二、为什么学webgl?

  • 数据可视化
  • 图形/游戏引擎
  • 交互演示、图形渲染
  • 地图
  • VR
  • 物品展示
  • 室内设计
  • 城市规划

三、webgl的优势?

  • 内嵌在浏览器中,不需要安装任何插件即可运⾏;
  • 只需要⼀个⽂本编辑器和浏览器,就可以编写三维图形程序;

四、webgl开源框架

  • Three.js:JavaScript 3D WebGL库
  • Babylon.js:Web3D图形引擎
  • KickJS:Web的开源图形和游戏引擎
  • ClayGL:构建可扩展的Web3D应⽤程序
  • PlayCanvas:网络游戏和3D图形引擎
  • WebGLStudio.js和Litescene.js:开源Web 3D图形编辑器和创建器
  • Luma:Uber的3D WebGL可视化库
  • A-Frame是用于构建VR(虚拟现实)体验的Web框架

五、canvas和webgl的区别

Canvas API

  • Canvas API 提供 二维 绘图的方式
  • 图形的绘制主要通过 CanvasRenderingContext2D 接口完成
  • canvas.getContext(' 2d')

WebGL API

  • WebGL API 提供 三维 绘图的方式
  • 图形的绘制主要通过 WebGLRenderingContext 接口完成
  • canvas.getContext('webgl ')
相关推荐
Yvonne爱编码6 分钟前
AJAX入门-AJAX 概念和 axios 使用
前端·javascript·ajax·html·js
在路上`22 分钟前
前端学习之后端java小白(三)-sql外键约束一对多
java·前端·学习
尚久龙1 小时前
安卓学习 之 用户登录界面的简单实现
android·运维·服务器·学习·手机·android studio·安卓
yb0os11 小时前
RPC实战和核心原理学习(一)----基础
java·开发语言·网络·数据结构·学习·计算机·rpc
Pu_Nine_91 小时前
10 分钟上手 ECharts:从“能跑”到“生产级”的完整踩坑之旅
前端·javascript·echarts·css3·html5
乱飞的秋天1 小时前
网络编程学习
网络·学习·php
2202_755744302 小时前
开学季技术指南:构建高效知识管理系统与学习工作流
学习
東雪蓮☆2 小时前
从零开始掌握 Web 与 Nginx:入门详解
运维·服务器·前端·nginx
脑子慢且灵2 小时前
【JavaWeb】一个简单的Web浏览服务程序
java·前端·后端·servlet·tomcat·web·javaee
柯南二号2 小时前
【大前端】 断点续传 + 分片上传(大文件上传优化) 的前端示例
前端