three实现一个盾牌三维效果代码-html代码-BFW代码库

three实现一个盾牌三维效果代码

代码语言：html

所属分类：三维

代码描述：three实现一个盾牌三维效果代码

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

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">

  
  
<style>

canvas {
  display: block; width: 100%; height: 100vh; cursor: -webkit-grab; cursor: grab;
}

a {
  position: fixed; top: 0; left: 0; z-index: 1;
  display: block; padding: 1rem;
  font: 1em 'Yomogi', cursive;
  color: inherit;
}
</style>




</head>

<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.5.2.js"></script>
  <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.126.js"></script>
  <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.126.js"></script>
      <script >
// ----
// main
// ----

const renderer = new THREE.WebGLRenderer({ antialias: true });
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, 2, .1, 100);
const controls = new THREE.OrbitControls(camera, renderer.domElement);

scene.background = new THREE.Color('gold');
camera.position.set(.5, -.75, .75);
controls.enableDamping = true;

const light = new THREE.DirectionalLight();
light.position.set(1, 2, 1);
scene.add(light);

const stone = new THREE.Group();
{
  const geom = new THREE.SphereGeometry(.9);
  con.........完整代码请登录后点击上方下载按钮下载查看