threejs实现360度天空中一只雄鹰三维模型fbx飞翔效果代码-html代码-BFW代码库

threejs实现360度天空中一只雄鹰三维模型fbx飞翔效果代码

代码语言：html

所属分类：三维

代码描述：threejs实现360度天空中一只雄鹰三维模型fbx飞翔效果代码

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

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

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
body { 
  margin: 0;
}

#c {
    width: 20%;
    height: 20%;
    display: block;  
}
</style>



</head>


	<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.126.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/inflate.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/FBXLoader.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.126.js"></script>

    
    <canvas id="c"></canvas>


  
      <script >
const canvas = document.querySelector('#c');
const renderer = new THREE.WebGLRenderer({ canvas });
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

const fov = 75;
const aspect = 2; // the canvas default
const near = 0.1;
const far = 100;
const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.z = 3;

const controls = new THREE.OrbitControls(camera, canvas);
controls.target.set(0, 0, 0);
controls.update();

const scene = new THREE.Scene();

{
  const color = 0xFFFFFF;
  const intensity = 2;
  const light = new THREE.DirectionalLight(color, intensity);
  light.position.set(10, 5, 5);
  light.castShadow = true;
  light.shadow.mapSize.width = 512; // default
  light.shadow.mapSize.height = 512; // default
  light.shadow.camera.near = 0.5; // default
  light.shadow.camera.far = 500; // default
  scene.add(light);
}

{
  const keylight = new THREE.DirectionalLight(0xFFFFFF, 0.5);
  keylight.position.set(0, 20, 0);
  keylight.castShadow = true;
  scene.add(keylight);
}

{
  const loader = new THREE.CubeTextureLoader();
  const texture = loader.load([
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_east_iq8cr6.bmp',
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_west_gwd0gs.bmp',
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_up_tnxqka.bmp',
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_down_p10z7n.bmp',
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_north_anykiq.bmp',
  '//repo.bfw.wiki/bfwrepo/images/360/img/sky/clouds1_south_bek22d.bmp']);

  scene.background = texture;
}
/*
{
  const planeSize = 40;
  const loader1 = new THREE.TextureLoader();
  const texture = loader1.load('https://threejsfundamentals.org/threejs/resources/images/checker.png');
  texture.wrapS = THREE.RepeatWrapping;
  texture.wrapT = THREE.RepeatWrapping;
  texture.mag.........完整代码请登录后点击上方下载按钮下载查看