上一篇博文中,初步介绍了MyVoix.js的基本功能,这次我们将演示一个完整的实例。

  先上代码

 <!DOCTYPE HTML>
<html>
<head>
<title>MyVoix</title>
<script type="text/javascript" src='js/myvoix.js'></script>
<script type="text/javascript">
window.onload=function(){
var _myVoix = new MyVoix(undefined,undefined,true),
_title=document.getElementsByTagName('H1')[0],
_colors=['red','black','blue','green','yellow'];
_myVoix.start();
for(var i=0,l=_colors.length;i<l;i++){
(function(i){
_myVoix.bind(_colors[i],function(){
_title.style.color=_colors[i];
});
})(i);
}
};
</script>
</head>
<body>
<h1>Hello My Voix</h1>
</body>
</html>

  为了读者方便,代码都写在一个文档中。大家只需要注意引用myvoix.js的位置即可。

  用Chrome打开网页(必须把文件放在服务器上,用url地址打开,如http://localhost/myvoix.html)。浏览器首先会提示你‘想要使用您的麦克风’,这个时候当然是‘允许’了。

  值得一提的是,如果你不小心选择了‘拒绝’,下次打开网页的时候Chrome是会默认禁止该站点访问麦克风,不会再出现提示。挽救的方法就是在 设置->高级设置->内容设置->媒体->例外情况管理中 进行设置。

  配置完毕,开始测试我们的网页。这段代码的功能很简单,就是当侦测到你说'red','black','blue','green','yellow'的时候,把Hello My Voix的颜色做对应的变化。当然谷歌服务器的反应可能不是特别快。这里有个小技巧:打开你的控制台,myvoix.js会在控制台输出每一个解析出的单词。需要注意单词都是小写的。

  当然,每个人的发音不可能都很标准,chrome可能会检测到一些出乎你意料的结果,如下图。

  说了那么多次’red‘才被解析出,是不是很有挫败感? 这里我们可以事先统计一些发音相近的单词,通过myvoix的数组绑定功能,为这些单词都绑定同一个事件。

_myVoix.bind(['reddit','rad','reddit','red'],function(){
_title.style.color='red';
});

  再试试,解析成功率是不是变高了?

  当然,这只是权益之计,开发程序的时候,我们不可能统计所有人的发音,下一章,我们将介绍如何利用myvoix中的smart learning模块,实现定制化的语音识别。

  myvoix源码地址

  转发请注明出处:http://www.cnblogs.com/Arthus/p/3687942.html

Chrome下的语音控制框架MyVoix.js使用篇(二)的更多相关文章

  1. Chrome下的语音控制框架MyVoix.js使用篇(四)

    在上一篇博文中,我为大家介绍了myvoix.js中的smart learning模块,以及何如使用该功能.(myvoix.js的源码地址会在每一篇文章末尾放出) 文本将拓展 Chrome下的语音控制框 ...

  2. Chrome下的语音控制框架MyVoix.js使用篇(三)

    上篇文末已经提及,google分析出的单词可能和大家预想的输入有差别.上文我们通过预先绑定多个语音指令,权益地解决了这个问题.在这一章,我将介绍myvoix.js框架自带的smart learning ...

  3. Chrome下的语音控制框架MyVoix.js使用篇(一)

    日前因工作需求,着手研究了语音识别技术,发现github上有网友发布了一款叫做voix.js的javascript框架.在拜读voix.js的源码后发现了不少问题,于是自己写了一款语音识别框架MyVo ...

  4. 关于 IE firefox Chrome下的通过用js 关闭窗口的一些问题

    首先IE是可以通过window.close()来关闭浏览器窗口的,但是在firefox和Chrome下是无效的,原因在于: ~~~ie可直接<button onclick="windo ...

  5. 语音控制的tab选项卡

    前端开发whqet,csdn,王海庆,whqet,前端开发专家 ladies and 乡亲们,程序猿同志们,周末仍然坚守工作岗位,或者学习不辍的童鞋们,福音来了. 语音识别高不高端.难不难? 今天给大 ...

  6. H5案例分享:JS手势框架 —— Hammer.js

    JS手势框架 -- Hammer.js 一.hammer.js简介 hammerJS是一个开源的,轻量级的触屏设备javascript手势库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件.允许 ...

  7. OMCS ——卓尔不群的网络语音视频框架

    作为.NET平台上的开发人员,要开发出一个像样视频聊天系统或视频会议系统,非常艰难,这不仅仅是因为.NET对多媒体的支持比较有限,还因为网络语音视频这块涉及到了很多专业方面的技术,而.NET在这些方面 ...

  8. js架构设计模式——前端MVVM框架设计及实现(二)

    前端MVVM框架设计及实现(二) 在前端MVVM框架设计及实现(一)中有一个博友提出一个看法: “html中使用mvvm徒增开发成本” 我想这位朋友要表达的意思应该是HTML定义了大量的语法标记,HT ...

  9. 一款很便捷很实用的框架——vue.js

    Hello,大家好!今天给大家带来一款十分好用的框架--vue.js! Vue.js是一套构建用户界面的渐进式框架.它 只关注视图层, 采用自底向上增量开发的设计. Vue 的目标是通过尽可能简单的 ...

随机推荐

  1. 使用ntfs的磁盘映射功能

    当年95极受欢迎,是作为一个还算真正的32位系统.之前的3.1都是16位为基础的,很多api支持有限.相应的对于硬件性能的发掘还是值得肯定的 98对于95的取代是成功的,我想重要原因是图形尤其是游戏的 ...

  2. Linux read语法及浅析

    read命令 -n(不换行) -p(提示语句) -n(字符个数) -t(等待时间) -s(不回显) 1.基本读取read命令接收标准输入(键盘)的输入,或其他文件描述符的输入(后面在说).得到输入后, ...

  3. 2014-07-29 浅谈MVC框架中Razor与ASPX视图引擎

    今天是在吾索实习的第15天.随着准备工作的完善,我们小组将逐步开始手机端BBS的开发,而且我们将计划使用MVC框架进行该系统的开发.虽然我们对MVC框架并不是非常熟悉,或许这会降低我们开发该系统的效率 ...

  4. Android中几种常用的话框

    1.普通对话框: Builder alert=new AlertDialog.Builder(MainActivity.this); alert.setTitle("提示"); a ...

  5. PHP中数组转换为XML格式

    最近公司要做一个API接口,输出格式要有JSON与XML格式, 在PHP中,输入JSON直接json_encode就可以,但输出XML没有提供函数,于是决定自己写一个. <?php /** * ...

  6. CoreText学习(一)Base Objects of Core Text

    最近要做一个读入Word,PDF格式等的文件并且加以编辑的程序,本来以为使用Text Kit结合Text View来打开doc文件是完全没问题的,结果用了各种方法打开要么是数据是nil,要么打开的文字 ...

  7. DVP

    债券结算方式是指在债券结算业务中,债券的所有权转移或权利质押与相应结算款项的交收这两者执行过程中的不同制约形式.中央债券簿记系统中所设计的结算方式有:纯券过户.见券付款.见款付券.券款对付(DVP)四 ...

  8. maven+spring mvc初尝试

    只是一个可以运行的例子,俺们来看看. 目录结构: pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xml ...

  9. hand第四次考核

    使用Spring与Mybatis技术实现下要求: (2分)1,Spring的配置文件名称为ApplicationContext.xml (2分)2,在ApplicationContext.xml中配置 ...

  10. 一款豪华绚丽的移动端图册(zepto.js+photoswipe.js)

    应公司要求,开发一款移动端杂志(等同于移动端幻灯片相册,iOS上能轻松滑动缩放,android上也能滑动缩放).网上找了很久没有符合需求的插件,无意间找到了photoswipe,进行改造之后就成了符合 ...