# 拼图进阶 Pro
下列拼图通常涉及开发中的一些高级操作，教程在《用户手册-拼图参考》基础上进一步扩展，结合案例讲解实用的开发技术。
# Scenes拼图
Scenes拼图用于控制场景的动态加载，控制场景的渲染，控制场景的环境；另外，在优化程序性能上，这些拼图有着特殊作用。
# 1.动态加载场景 18'17''
结合load_unload案例分析，介绍场景替换、附加、卸载及场景加载器的实现。拼图：load scene、append scene、unload scene、percentage
- 动态加载场景(1) 1'54''
- 动态加载场景(2) 2'40''
- 动态加载场景(3) 3'9''
- 动态加载场景(4) 4'54''
- 动态加载场景(5) 3'47''
- 动态加载场景(6) 1'53''
# 2.开启/禁用渲染 4'44''
临时禁用渲染可以节省性能和提高渲染质量。拼图：enable rendering、disable rendering
- 开启/禁用渲染 4'44''
# 3.动态创建环境 7'32''
创建环境拼图用于动态修改背景颜色、环境贴图、HDR照明，以及实现一个glTF查看器。拼图：create environment
- 动态创建环境(1) 2'14''
- 动态创建环境(2) 2'7''
- 动态创建环境(3) 3'11''
# 4.射线检测拼图 10'7''
射线检测是WebGL中重要的功能，Verge3D 3.4版中加入该拼图后可以实现很多高级功能。视频介绍了raycast拼图的基础用法和实现双击、右键等三维事件。
- raycast拼图(1) 5'55''
- raycast拼图(2) 4'12''
- raycast拼图(3) 3'19''
# HTML拼图
课程介绍了对于3D美术和设计人员如何学习HTML分类下涉及的前端知识；并将HTML分类下的拼图分为3类，分别通过案例演示介绍如何组合使用；最后介绍了动态操作DOM的典型应用场景。
# 1. HTML拼图介绍 4'44''
HTML类别的拼图可以分成三类：DOM操作拼图、2D和3D结合拼图、BOM操作拼图。对于HTML初学者可以现用现查，学习案例。
视频
# 2. 动态操作页面元素 13'5''
在拼图中动态创建一个按钮，用3种方式修改其样式，获取和修改其属性，最后实现通过按钮控制材质的功能。相关拼图：add HTML element,get attribute,set attribute,set style,set css rule,event,get event property,query selector...
# 3. 动态绑定页面元素 4'25''
相关拼图：draw line,remove line,bind element,add annotation(添加注释拼图，object分类)
# 4. 浏览器操作 8'56''
涉及全屏功能，操作URL参数，截屏功能，打开本地文件，相关拼图：init fullscreen,get URL data,set URL param,take screenshot,open file and opened file
# 5. 应用案例 7'24''
模拟从数据库获取数据，动态创建下拉菜单组件，实现通过菜单选项控制三维元素。 附案例源文件。
# Physics拼图
物理拼图用于实现游戏引擎的功能，可以模拟重力环境、碰撞检测、运动约束等功能，可用于游戏、VR/AR、仿真程序开发。本课程案例通过FPS相机结合物理模块实现了一个第一人称的小球发射场景，通过案例介绍物理模块拼图功能和用法，并介绍了v3d 3.1.1版新增的vector拼图、get dir拼图等新特性。
# 1. 物理拼图介绍 2'8''
课程介绍，学习方式及案例演示。
视频
# 2. 初始化和创建碰撞体 4'45''
介绍初始化物理引擎的参数和碰撞体的几种类型。
# 3. 应用矢量 4'8''
介绍在物理环境下如何控制碰撞体的运动。
# 4. 复杂矢量运算 5'
矢量用于为物理碰撞体施加力，这里介绍了通过矢量运算为物体添加一个相机水平方向的力。
# 5. 优化碰撞检测 6'8''
优化碰撞效果的设置。发射小球案例。
# 6. FPS相机与物理模块结合 1'48
第一人称的小球发射场景。
附演示案例2个
# System拼图
System分类下的拼图用于实现代码调试、性能调试、设备功能检测、系统信息、游戏外设支持等方面的功能。以下视频介绍这些功能的实际应用场景，包括移动端显示效果优化，HiDPI/Retina高清屏适配。
# 1. 代码调试和性能调试 5'7''
介绍Verge3D自带的测试工具。V3D 3.2更新有相关更新，详见更新日志。
# 2. 多设备支持和显示优化 4'29''
在不同型号的移动设备上优化渲染效果，包括移动端常见的抗锯齿问题。
# 3. 游戏手柄支持和游戏手柄检测工具 6'32''
Verge3D对游戏手柄的支持，相关拼图：detect gamepad device，gamepad index，get gamepad property。
# Advanced拼图
Advanced分类下的拼图用于实现一些高级操作，如向服务器发起AJAX请求，加载和解析TXT、HTML、JSON、CSV数据格式，在拼图中调用JS函数，undo功能，社交分享功能等。课程中结合实例演示了上述功能，重点讲解了get、post请求，顺带讲解了通过调用js函数实现雾效。本节课有助于深入理解拼图功能和应用场景。
verge3d 3.3版该分类由Misc改名为Advanced
# 1. 一键分享到微博
自带的社交分享功能。
视频
# 2. 从拼图调用JS函数 5'31''
拼图的功能毕竟有限，我们可以在拼图中调用JS中定义的函数，这样极大扩展了拼图的开发能力。
# 3. 从服务器和外部加载数据 9'26''
相关拼图：load data，loaded data，read JSON
# 4. 从CSV文件中读取数据 5'3''
相关拼图：read CSV
# 5. 向服务器发起POST请求 3'9''
相关拼图：send data
# 6. 实现撤消操作 5'21''
相关拼图：save state，undo state，all variable names，variable value by name。
# 7. exec script拼图 8'56''
exec script拼图提供了一种新的在Verge3D中使用JavaScript的方式，由于它既是一段代码又是一个拼图，在使用上非常灵活，模糊了拼图编程和代码编程的界线。
- exec script拼图(1) 5'50''
- rexec script拼图(2) 3'6''
# E-Commerce拼图
Verge3D有一个强大的功能，它能够不写代码就能实现一个wordpress (opens new window)的3D购物网站，本节课将通过实现一个3D座椅案例，介绍电商分类下拼图的使用，以及实现一个3D电商网站的完整步骤。
# 1. 电商拼图介绍和准备工作 2'31''
Verge3D的Wordpress插件和WooCommerce实现3D电商。
# 2. 新建商品和添加商品属性 3'45''
在Wordpress电商网站后台创建商品和添加用于Verge3D应用的商品属性。
# 3. 创建应用和接收商品属性 4'5''
相关拼图：connect to WooCommerce，product info，product attribute
# 4. 上传应用和嵌入商品页面 3'18''
介绍Verge3D插件如何在Wordpress后台上传和管理应用程序。
# 5. 手动生成表单 5'23''
不依赖WooCommerce，生成订单表单。
补充：关于搭建wordpress网站方面的知识，请在电商专题下学习。 本地开发环境使用PHP study (opens new window)搭建。
