three实现一个三维唱片碟片旋转播放曲线乐章效果代码
代码语言:html
所属分类:三维
代码描述:three实现一个三维唱片碟片旋转播放曲线乐章效果代码
代码标签: three 三维 唱片 碟片 旋转 播放 曲线 乐章
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body{
overflow: hidden;
margin: 0;
}
</style>
</head>
<body >
<script async type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/es-module-shims.1.6.2.js"></script>
<script type="importmap">
{
"imports": {
"three": "//repo.bfw.wiki/bfwrepo/js/module/three/build/146/three.module.js",
"three/addons/": "//repo.bfw.wiki/bfwrepo/js/module/three/examples/jsm/"
}
}
</script>
<script type="module">
import * as THREE from "three";
import {OrbitControls} from "three/addons/controls/OrbitControls.js";
import {mergeBufferGeometries} from "three/addons/utils/BufferGeometryUtils.js";
import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
import { ShaderPass } from "three/addons/postprocessing/ShaderPass.js";
import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js';
console.clear();
class Postprocessing {
constructor(scene, camera, renderer) {
const renderScene = new RenderPass(scene, camera);
const bloomPass = new UnrealBloomPass(
new THREE.Vector2(window.innerWidth, window.innerHeight),
1.25,
0.25,
0
);
let samples = 4;
const target1 = new THREE.WebGLRenderTa.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0