three打造一个三维图片粒子分解转场效果幻灯片-html代码-BFW代码库

three打造一个三维图片粒子分解转场效果幻灯片

代码语言：html

所属分类：幻灯片

代码描述：three打造一个三维图片粒子分解转场效果幻灯片

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  margin: 0;
  width: 100%;
  height: 100%;  
}

canvas {
  display: block;
  cursor: pointer;
}
</style>

</head>
<body translate="no">
<canvas id="canvas"></canvas>
<p class="collection">

</p>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/gsap.3.3.1.js"></script>
<script type="module">
import {
BufferGeometry,
Color,
DoubleSide,
Face3,
Geometry,
InstancedBufferAttribute,
InstancedMesh,
MathUtils,
MeshBasicMaterial,
Object3D,
PerspectiveCamera,
Scene,
TextureLoader,
Vector2,
Vector3,
WebGLRenderer } from
'https://unpkg.com/three@0.119.0/build/three.module.js';

function App() {
  const conf = {
    size: 10,
    images: [
    { src: 'http://repo.bfw.wiki/bfwrepo/image/5e0c6f2cae508.png' },
    { src: 'http://repo.bfw.wiki/bfwrepo/image/5e0c6f962a0d0.png' },
] };



  let renderer, scene, camera, cameraCtrl;
  const screen = {
    width: 0, height: 0,
    wWidt.........完整代码请登录后点击上方下载按钮下载查看