SpeechRecognition+aframe实现语音指令控制webvr场景运动效果代码
代码语言:html
所属分类:三维
代码描述:SpeechRecognition+aframe实现语音指令控制webvr场景运动效果代码
代码标签: SpeechRecognition aframe 语音 指令 控制 webvr 场景 运动
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/aframe.0.2.0.js"></script> </head> <body> <a-scene light="defaultLightsEnabled: false " background="color: lightblue" shadow="autoUpdate: true"> <a-assets> <img id="texture-metal" src="//repo.bfw.wiki/bfwrepo/icon/638ffc15de137.png"> <img id="texture-plaster" src="//repo.bfw.wiki/bfwrepo/icon/63c68f9ad5e62.png"> </a-assets> <a-entity id="player" collider-listener raycaster-emitter camera look-controls wasd-controls="acceleration:100" position="0 1.8 5" > <a-entity raycaster="objects: .collidable; showLine:true; lineColor:red; far:100; near:0.01;" position="0 1.8 0" rotation="0 90 0"> </a-entity> <a-cursor cursor-listener></a-cursor> <!--<a-entity camera look-controls position="0 1.6 0"></a-entity>--> </a-entity> <a-light type="directional" position="10 10 10" rotation="-90 0 0" target="#directionaltarget" shadow="cast:true"> <a-entity id="directionaltarget" position="0 0 -1"></a-entity> </a-light> <a-plane position="0 0 0" rotation="-90 0 0" height="40" width="40" material="shader: flat; color:grey; " shadow="receive: true"></a-plane> <!-- <a-box class="collidable" position="0 0 -10" rotation="0 0 0" depth="0.1" height="2" width="20" material="shader: flat; color:red;" ></a-box> <a-box class="collidable" position="0 0 -20" rotation="0 0 0" depth="0.1" height="4" width="40" material="shader: flat; color:black;" ></a-box> <a-box class="collidable" position="0 0 10" rotation="0 0 0" depth="0.1" height="2" width="20" material="shader: flat; color:blue;" ></a-box> <a-box class="collidable" position="10 0 0" rotation="0 90 0" depth="0.1" height="2" width="20" material="shader: flat; color:pink;" ></a-box> <a-box class="collidable" position="-10 0 0" rotation="0 90 0" depth="0.1" height="2" width="20" material="shader: flat; color:yellow;" ></a-box> --> <a-box id="box1" position="-15 1 -10" depth="2" width="2" height="2" material="shader: flat; color:green " animation="property:rotation; from:0 360 0; to: 0 0 0; duration: 10000; easing: linear; loop:true;"></a-box> <a-box id="box2" position="18 1 -16" depth="2" width="2" height="2" material="shader: flat; color:gold " animation="property:rotation; from:0 360 0; to: 0 0 0; duration: 10000; easing: linear; loop:true;"></a-box> <a-box id="box3" position="0 1 15" depth="2" width="2" height="2" material="shader: flat; color:red " animation="property:rotation; from:0 360 0; to: 0 0 0; duration: 10000; easing: linear; loop:true;"></a-box> </a-scene> <script > var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition; var SpeechGrammarList = SpeechGramma.........完整代码请登录后点击上方下载按钮下载查看
网友评论0