文档章节

移动端报表JS开发示例--获取定位

九月你好123
 九月你好123
发布于 2016/05/05 17:00
字数 1015
阅读 204
收藏 0

上次分享了移动端报表JS开发的系统概念,后来我又回去摸索了一些案例。之前接触到的FineReport的APP客户端可以用来打卡签到,就好奇研究了以下,这次就来聊一聊报表移动端开发如何实现定位功能。

1. 解决思路

在用FineReport设计模板的时候添加一个按钮控件,点击该按钮的时候,获取当前地理位置,并将该位置信息复制给某个单元格,最后在客户端填报当前模板即可。

2. 示例

实现如下图所示效果,点击地理位置按钮获取当前位置与当前时间,并显示在下方对应的单元格中:

2.1 模板制作


打开设计器,新建一张模板,按照如下图所示样式设计模板,其中E2单元格为按钮控件,控件名称为地理位置,C5为下拉框控件,E5为时间控件:

2.2 获取当前地理位置


获取当前地理位置有两种方式,一个是点击按钮获取地理位置,一个是直接打开模板的时候就获取位置,示例中,我们是想实现通过点击按钮获取地理位置。

通过点击按钮获取地理位置

打开按钮的控件设置,为该控件添加一个点击事件,如下图:

js如下:

1. FR.location(function(status, message){ //获取地理位置
2. if(status=="success") {
3. //定位成功,message返回经纬度值
4. FR.Msg.alert("当前位置是" + message);
5. contentPane.setCellValue(2, 3, message);
6. } else {
7. //定位失败,message返回对应的错误信息
8. FR.Msg.alert(message); //定位失败
9. }
10. });
  1. 但是该方法只在移动端有用,如果在web点击该按钮事件获取地理位置,则直接提示定位失败。

加载结束后获取当前位置

如果想在模板加载结束之后就获取到当前地理位置,那么只需要将上述代码添加到加载结束后事件中即可,打开模板,点击模板>模板web属性>填报页面设置,添加一个加载结束事件,如下图:

2.3 获取当前时间


在模板中还需要将当前签到时间也赋值过去,所以还需要在按钮的点击事件中获取到当前时间,并赋值给E4单元格,js如下:

11. var myDate = new Date();
12. var mytime=myDate.getFullYear()+"-"+myDate.getMonth()+1+"-"+myDate.getDate()+" "+myDate.getHours()+":"+myDate.getMinutes()+":"+myDate.getSeconds(); //获取当前时间
13. contentPane.setCellValue(4, 3, mytime);
  1. 按钮点击事件全部js如下:
14
.
 FR
.
location
(
function
(
status
,
 message
)
{
 
//获取地理位置

15. if(status=="success") {
16. //定位成功,message返回经纬度值
17. FR.Msg.alert("当前位置是" + message);
18. contentPane.setCellValue(2, 3, message);
19. var myDate = new Date();
20. var mytime=myDate.getFullYear()+"-"+myDate.getMonth()+1+"-"+myDate.getDate()+" "+myDate.getHours()+":"+myDate.getMinutes()+":"+myDate.getSeconds(); //获取当前时间
21. contentPane.setCellValue(4, 3, mytime);
22.
23. } else {
24. //定位失败,message返回对应的错误信息
25. FR.Msg.alert(message); //定位失败
26. }
27. });

2.4 效果查看


将该模板添加到数据决策系统的节点树上,其操作方法请查看添加模板,其中模板的预览方式为填报,如下图:


根据添加服务器章节介绍的操作步骤,用移动端登录该系统,访问该张模板,点击地理位置按钮获取当前地理位置和当前时间,如下图:


但是,FineReport获取到的地理位置是经纬度,如需要确定其具体位置,就需要另外转换。

移动端的开发还在持续学习中,感兴趣的朋友可以和我一起探讨研究。


© 著作权归作者所有

九月你好123
粉丝 10
博文 111
码字总数 112722
作品 0
杭州
私信 提问
如何把报表放到网页中显示(Web页面与报表简单集成例子)

1.问题描述 现在用户开发的系统基本上趋向于BS架构的浏览器/服务器模式,这些系统可能由不同的语言开发,如HTML、ASP、JSP、PHP等,因此需要将制作好的报表嵌入到这些页面中。 FineReport制作...

九月你好123
2015/08/03
818
0
H5获取用户位置API + 百度地图API介绍

一. Geolocaiton API 功能介绍 Geolocation接口是一个用来获取设备地理位置的可编程的对象,它可以让Web内容访问到设备的地理位置,这将允许Web应用基于用户的地理位置提供定制的信息. 出于安全...

大灰狼的小绵羊哥哥
2018/10/11
0
0
【高小爱课堂】_地图API开发者教程(全平台精华版)

一、使用须知 二、坐标相关问题 三、标注问题 四、定位相关问题 五、云图 六、地图API 1)Javascript API 2)Android API 3)iOS API 4)Windows Phone 及win8 API 5)URI API ▼使用须知 Q:...

高德LBS开放平台
2014/06/13
1K
0
关于报表在移动端展现需你需要知道哪些?

现在,企业或者电商平台的商家、业务方,每天都有大量的人需要在线查看大量的指标,用于监控、分析关键业务数据的发展趋势。而且,这些查看分析数据的诉求,对于随时随地、方便快捷的要求也越...

拾光石艺
2018/10/19
0
0
WebView动态注入JavaScript脚本

Demo地址:https://gitee.com/chenyangqi/YouMeDai 背景介绍 在Android与JavaScript交互一文中学习了原生和JS交互,但是如果我们想和别人开发好的web页面交互呢,很明显这个web端并没有为我们...

木头同学
2018/08/07
0
0

没有更多内容

加载失败,请刷新页面

加载更多

arcgis arcpy 克里金插值 掩膜 配置符号系统 自动生成图片

整体思路,最后要加载到mxd文件中,然后导出图片 首先加载mxd文件 mxd = mapping.MapDocument(r"./11.mxd") 然后读取数据 并加载到图层中 sr = arcpy.SpatialReference(4326) # 读取csv...

可达鸭Go
今天
4
0
漂亮有创意的思维导图模板分享

相信很多人使用在绘制思维导图时很喜欢使用模板进行编辑,它能够让你在短时间内快速创造出一个风格明显好看的思维导图,对绘制时间以及使用够感受影响都是较为深刻的,下面为大家分享几款漂亮...

干货趣分享
今天
4
0
使用js实现对cookie的增删改查

简单的操作cookie 存储cookie(key为test;value为testValue): document.cookie = "test=testValue"; 存储多个cookie: document.cookie = "test1=testValue1";document.cookie = "test2=te......

被毒打的程序猿_先瑞
今天
4
0
ApacheCN 公众号文章汇总 2019.9

ApacheCN 优质博文推荐计划正式启动 接受以下主题的博文: 人工智能(论文解读,比赛心得,面经,知识点讲解) 环材化生劝退 CS 留学申请,IT 外企求职 每日从所有投稿中精选两篇,在 Apache...

ApacheCN_飞龙
今天
5
0
Intellij Idea显示回退和前进按钮的方法

方法1:使用快捷键: 回到上一步 ctrl + alt + <-(左方向键) 回到下一步 ctrl + alt + ->(右方向键) 方法2:在界面显示: View -> 勾选ToolBar 方法3(推荐): (1)Preferences -> Ap...

孟飞阳
今天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部