three+webgl实现鼠标交互互动滤镜渐变效果代码
代码语言:html
所属分类:其他
代码描述:three+webgl实现鼠标交互互动滤镜渐变效果代码
代码标签: three webgl 鼠标 交互 互动 滤镜 渐变
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
body {
margin: 0;
}
</style>
</head>
<body translate="no">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.128.js"></script>
<script type="module">
let scene, camera, renderer, planeMesh;
// -- 1) Set these to your normal map's actual dimensions:
const IMAGE_WIDTH = 1200; // e.g. 1200 px wide
const IMAGE_HEIGHT = 1000; // e.g. 1000 px high
const IMAGE_ASPECT = IMAGE_WIDTH / IMAGE_HEIGHT; // e.g. 1.2
init();
animate();
function init() {
scene = new THREE.Scene();
// ------------------------------------------------------
// 2) ORTHOGRAPHIC CAMERA: covers [-1..1] in Y, [-aspect..+aspect] in X
// ------------------------------------------------------
const viewAspect = window.innerWidth / window.innerHeight;
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0