vue-gl提供了一组组件来使用three.js库渲染3D图形。

变更日志：

v0.23.1（03/06/2021）

• 修复：删除SphericalRefrectionMapping常量

v0.23.0（03/02/2021）

• 将Three.js版本更新为0.126.0
• 组件的标签名称
• 更新示例代码
• 更新caniuse-lite

v0.22.1（2020年8月29日）

• 修复了未定义材质道具时beforeDestroy挂钩的错误

v0.22.0（06/23/2020）

• 更新资料

安装和下载：

# Yarn
$ yarn add vue-gl

# NPM
$ npm install vue-gl --save

基本用法：

将必要的库导入文档。

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/three"></script>
<script src="https://unpkg.com/vue-gl"></script>

定义对象。

<vgl-renderer id="vgl-canvas" style="width: 300px; height: 150px;">
    <vgl-scene>
        <vgl-sphere-geometry></vgl-sphere-geometry>
        <vgl-mesh-standard-material></vgl-mesh-standard-material>
        <vgl-mesh></vgl-mesh>
        <vgl-ambient-light></vgl-ambient-light>
        <vgl-directional-light></vgl-directional-light>
    </vgl-scene>
    <vgl-perspective-camera orbit-position="200 1 1"></vgl-perspective-camera>
</vgl-renderer>

注册组件并启动vue。

Object.keys(VueGL).forEach(name => {
  Vue.component(name, VueGL[name]);
});
new Vue({
  el: "#vgl-canvas"
});