[语音播放]-开启报表有声模式
最近偶见论坛有番薯们 发需求说想要实现的报表的语音播报功能。我仔细看一了一下,发现帮助文档里确实有类似文档,一个是通过条件属性中的新值,添加语音播放。
(https://help.fanruan.com/finereport/doc-view-1982.html)
一个是在查询数据后,播放报警提示音
(https://help.fanruan.com/finereport/doc-view-1982.html)
受此启发。我联想到有时候报表需求,需要播报一些内容,这些内容可能除了数字以外,还有其他信息,比如需要一段文字+数字的语音提示。
还有一种语音播报的需求,就是运用在图表中,当图表数据是动态刷新的,并且达到预警值时,希望立即播报预警声音,以达到及时提醒的效果。
接下来我们就来看看第一情况实现方法.
场景一:报表伴随文字+数字的语音播报(例如业绩播报,事件处理播报,消息提醒等)
1. 1假设现在有一个需求,需要提醒目前有几条消息待处理,普通的数字,并不能达到有效提醒效果。但是语音循环播报能有效实现。
为了模拟数据,我们可以在报表中用公式创建随机整数,加上文字。
"您有" + RANDBETWEEN(1, 10) + "条消息,请注意查收."
139994 接下来,只需配上一段代码,就可以实现我们想要的循环播报效果,在模板web属性中的分页预览设置中,添加加载结束事件:function playAudio(text) {
const url = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&per=1&text=" + encodeURI(text);//lan=zh:语言是中文,如果改为lan=en,则语言是英文,ie=UTF-8:文字格式,spd=2:语速,可以是1-9的数字,数字越大,语速越快,text=**:这个就是你要转换的文字。
const audio = new Audio(url);
audio.src = url;
audio.play();
return audio;
}
setTimeout(function() {
setInterval(function() {
var wb=FR.remoteEvaluate('=A1')//数据在哪个单元格,就指定哪个单元格
playAudio(wb)
}, 8000);//8秒循环播报一次,时间可以自己改.
}, 100);//稍微延时一下,附上代码抛错。
预览报表,当看到页面标签上有小喇叭时,代表语音开始播报了。
139995 1.2:对上述的提醒 觉得还不够,我们可能会遇到这样的情况,就是当浏览器上的页面标签闪动的情况下,我们常常会不自觉的优先点击一下,或者刷新一下页面。这就是提醒 的效果。140011
下面我们就在原来 的基础上实现它:
更改上述代码:
function playAudio(text) {
const url = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&per=1&text=" + encodeURI(text);//lan=zh:语言是中文,如果改为lan=en,则语言是英文,ie=UTF-8:文字格式,spd=2:语速,可以是1-9的数字,数字越大,语速越快,text=**:这个就是你要转换的文字。
const audio = new Audio(url);
audio.src = url;
audio.play();
return audio;
}
var timer;
var title=document.head.getElementsByTagName("title").innerHTML
setTimeout(function() {
setInterval(function() {
var wb=FR.remoteEvaluate('=A1')//数据在哪个单元格,就指定哪个单元格
playAudio(wb)
function tixing(timer){//定义页面标签提醒函数
var index = 0;
clearInterval(timer);
timer = setInterval(function() {
if(index%2) {
document.head.getElementsByTagName("title").innerHTML = '【 】'+ title;
}else {
document.head.getElementsByTagName("title").innerHTML = '【'+wb+'】'+ title;
}
index++;
if(index > 20) {
clearInterval(timer);
}
}, 500);
}
tixing (timer); //执行页面提醒
}, 8000);//8秒循环播报一次,时间可以自己改.
}, 100);//稍微延时一下,附上代码抛错。
更改代码后效果:
140012
1.3 :上述只是实现了语音播报的第一步,其实你会发现,上面的代码,语音会一直播报,如果在不关闭页面的情况下,想取消语音播报,或暂停一会再播报怎么办呢?,接下来,就来实现它:
同样在报表单元格中模拟一下数据,在A1单元格中添加公式:"您有" + RANDBETWEEN(1, 10) + "条消息,请注意查收." 然后在B1单元格中添加一个按钮,按钮名称定义为:暂停139996
此时对这个按钮,添加两个事件, 1.初始化后事件:function playAudio(text) {
const url = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&per=1&text=" + encodeURI(text);//lan=zh:语言是中文,如果改为lan=en,则语言是英文,ie=UTF-8:文字格式,spd=2:语速,可以是1-9的数字,数字越大,语速越快,text=**:这个就是你要转换的文字。
const audio = new Audio(url);
audio.src = url;
audio.play();
return audio;
}
setTimeout(function() {
setInterval(function() {
var wb=FR.remoteEvaluate('=A1')
var bf=contentPane.getWidgetByCell(FR.columnRow2CellStr({
col:1,//按钮在第二列,这里数值为1
row:0//按钮在第一行,这里数值为0
}))
var bf1=bf.getText()
if(bf1=='暂停'){
playAudio(wb)
}
else{ }
}, 5000);
}, 500);
2.按钮点击事件:if (this.getText() == "播放") {
this.setText("暂停")
}
else if (this.getText() == "暂停") {
this.setText("播放")
} 模板web属性不再需要任何js代码,此时用填报预览,预览一下效果(填报预览在单元格中才能使用按钮控件),发现页面加载后,声音就开始播报了。点击一个按钮试一下::
139997
发现按钮的名字变了。页面标签上的小喇叭 也不见了。此时页面停止播报。再次点击按钮后,发现页面又开始继续播报了。
139998
1.4 :上述代码同样可以添加页面标签闪烁提醒,修改原代码如下:
function playAudio(text) {
const url = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&per=1&text=" + encodeURI(text);//lan=zh:语言是中文,如果改为lan=en,则语言是英文,ie=UTF-8:文字格式,spd=2:语速,可以是1-9的数字,数字越大,语速越快,text=**:这个就是你要转换的文字。
const audio = new Audio(url);
audio.src = url;
audio.play();
return audio;
}
var timer;
var title=document.head.getElementsByTagName("title").innerHTML
setTimeout(function() {
setInterval(function() {
var wb=FR.remoteEvaluate('=A1')
var bf=contentPane.getWidgetByCell(FR.columnRow2CellStr({
col:1,//按钮在第二列,这里数值为1
row:0//按钮在第一行,这里数值为0
}))
var bf1=bf.getText()
if(bf1=='暂停'){
playAudio(wb)
function tixing(timer){//定义页面标签提醒函数
var index = 0;
clearInterval(timer);
timer = setInterval(function() {
if(index%2) {
document.head.getElementsByTagName("title").innerHTML = '【 】'+ title;
}else {
document.head.getElementsByTagName("title").innerHTML = '【'+wb+'】'+ title;
}
index++;
if(index > 20) {
clearInterval(timer);
}
}, 500);
}
tixing (timer);//执行页面标签提醒
}
else{
document.head.getElementsByTagName("title").innerHTML = title;//还原页面标题
}
}, 5000);
}, 500);
预览后效果:140013
场景二:大屏数据图表中,数据动态刷新,当图表中的数据,达到预定值时,立即播放语音提醒。(适用于生产数据监控,车间设备监控等)我们在决策报表中添加一个绝对画布块,然后 新建一个报表块,在A1单元格中模拟一个随机数据:
RANDBETWEEN(110,999)139999
接下来,添加一个180度仪表盘,数据来源指定报表块中的数据:
140000
并对仪表盘设置一个区间颜色:
140001
对图表添加一个初始化后事件:
var form = this.options.form;
var mm=800//设定预警值,此处也可通过参数传递预警值。
var $alramDiv;
setInterval(function() {
form.getWidgetByName("report0").gotoPage(1,"{}",true);//刷新报表块
var num=FR.remoteEvaluate("=report0~A1");//监测值,并读取
//判断报警提示alarmDiv是否存在,如果不存在,则初始化
if($("#alarmDiv").length>0){
$alramDiv=$("#alarmDiv");
} else{
$alramDiv=$('').appendTo($(document.body));
}
//清空报警对象,防止多次刷新后造成多次播放
$alramDiv.empty();
if(num>=mm){
if(FR.Browser.isIE()){//如果是IE浏览器,执行下面这句
//loop="-1"表示声音无限循环,可以指定数字来控制循环次数
$('').appendTo($alramDiv);
} else {//如果不是IE浏览器,执行下面这句
//loop="true"表示声音无限循环,去掉则播放一次
$('' ).appendTo($alramDiv);
}
}
}, 5000); 此时可以对报表块,设置不可见: 140003
预览后效果:
(未达到预警)
140004
(达到预警)
140005
预警声音文件放在 webapps\webroot\scripts 目录下
编辑于 2020-12-10 17:58