案例:Three 非位置音频     状态:可编辑再运行    进入竖版
 运行结果 
x
 
1
<!DOCTYPE html>
2
<html lang="en">
3
4
<head>
5
  <meta charset="UTF-8">
6
  <title>Three 非位置音频</title>
7
  <style>
8
    body {
9
      margin: 0;
10
      overflow: hidden;
11
      /* 隐藏body窗口区域滚动条 */
12
    }
13
  </style>
14
  <script src="/js/threejs/threer92.js"></script>
15
  <script src="/example/threejs/solarsystem/files/OrbitControls.js"></script>
16
</head>
17
18
<body>
19
      <div id="app">
20
    <div class="block" style="display:inline;width:500px">
21
      <el-slider v-model="time" show-input :max=1 :step=0.01></el-slider>
22
    </div>
23
  </div>
24
    
25
  <script>
26
    /**
27
     * 创建场景对象Scene
28
     */
29
    var scene = new THREE.Scene();
30
    
31
    
32
// 非位置音频可用于不考虑位置的背景音乐
33
// 创建一个监听者
34
var listener = new THREE.AudioListener();
35
// camera.add( listener );
36
// 创建一个非位置音频对象  用来控制播放
37
var audio = new THREE.Audio(listener);
38
// 创建一个音频加载器对象
39
var audioLoader = new THREE.AudioLoader();
40
// 加载音频文件,返回一个音频缓冲区对象作为回调函数参数
41
audioLoader.load('/img/song.mp3', function(AudioBuffer) {
42
  // console.log(AudioBuffer)
43
  // 音频缓冲区对象关联到音频对象audio
44
  audio.setBuffer(AudioBuffer);
45
  audio.setLoop(true); //是否循环
46
  audio.setVolume(0.5); //音量
47
  // 播放缓冲区中的音频数据
48
  audio.play(); //play播放、stop停止、pause暂停