内容简介:我试图从Three.js中的AudioContext api映射顶点.现在,我已成功完成了飞机(非着色器),但遇到了试图将其应用于气缸的问题.由于圆柱顶点是全矢量,而不是平面的0,我不知道如何将它们映射到frequencyData.我为寻找音频上下文的未来观众提供了一些额外的功能.
我试图从Three.js中的AudioContext api映射顶点.
现在,我已成功完成了飞机(非着色器),但遇到了试图将其应用于气缸的问题.由于圆柱顶点是全矢量,而不是平面的0,我不知道如何将它们映射到frequencyData.
我为寻找音频上下文的未来观众提供了一些额外的功能.
音频背景
function audioLink(){ player = document.getElementById('musicPlayer'), context = new (window.AudioContext || window.webkitAudioContext), analyser = context.createAnalyser(), source = context.createMediaElementSource(player); source.connect(analyser); analyser.connect(context.destination); analyser.fftSize = 256; frequencyData = new Uint8Array(analyser.frequencyBinCount); analyser.getByteTimeDomainData(frequencyData); }
这是我的顶部和底部平面的代码……
function updateVertWave(){ for (var i = 0, len = waveBottom.geometry.vertices.length; i < len; i++) { waveBottomVert[i].z = frequencyData[i]*6; waveTopVert[i].z = frequencyData[i]*-6; } waveBottom.geometry.verticesNeedUpdate = true; waveTop.geometry.verticesNeedUpdate = true; }
在这里
function updateVertCylinder(){ for (var i = 0, len = cylinder.geometry.vertices.length; i < len; i++) { (STUCK) } cylinder.geometry.verticesNeedUpdate = true; cylinder.geometry.computeFaceNormals(); cylinder.geometry.computeVertexNormals(); scene.getObjectByName("cylinder").rotation.y += 0.004; }
给予
function render() { renderFrame = requestAnimationFrame(render); analyser.getByteFrequencyData(frequencyData); if (planeViz) { updateVertWave(); } else { updateVertCylinder(); } renderer.render(scene, camera); };
我理解使用着色器这样做更有意义,但我还不知道.我想你会把频率数据作为一个统一传递但是我回到我原来的矢量操作freq问题.
以上所述就是小编给大家介绍的《javascript – 具有音频上下文的顶点位移(THREE.JS R76)》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- 位移密码算法(JavaScript)
- RocketMQ 位移提交源码分析
- Kafka入门(2):消费与位移
- 在线图表编辑工具 draw.io 8.9.6 发布,修复垂直位移
- DDD:识别限界上下文以及理解上下文映射
- DDD:识别限界上下文以及理解上下文映射
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Rails Cookbook
奥西尼 / 江苏东南大学 / 2007-6 / 68.00元
Rails是业界领先的新一代Web 2.0应用程序开发框架,而这本《Rails Cookbook》里充满了为了让你成为Rails开发专家而准备的各种解决方案。讨论范围覆盖了从基本概念,如安装Rails及设置开发环境,到最新的各种技巧,如开发符合REST协议规范的Web服务等。 Rails可提供更轻量级的代码、更丰富的功能和更快捷的量身定制过程,由此带来了一场Web开发革命。《Rails Co......一起来看看 《Rails Cookbook》 这本书的介绍吧!