| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 1195 人关注过本帖
标题:FineReport中如何用JavaScript自定义地图标签
只看楼主 加入收藏
kaqima
Rank: 1
等 级:新手上路
帖 子:39
专家分:0
注 册:2016-3-15
结帖率:0
收藏
 问题点数:0 回复次数:0 
FineReport中如何用JavaScript自定义地图标签
在日常使用地图过程中,通常会遇到地图标签,提示点等显示不满足我们的需求,需要进行JavaScript代码编写。

例如:在使用地图过程中,会发现很多地名显示的位置偏离。这时候就需要使用JavaScript进行调控。以黑龙江和内蒙古为例,来介绍下如何在FineReport中利用JavaScript自定义地图标签。

新建地图

以区域地图为例,新建表单,拖入地图(新特性)组件,地图边界选择区域地图下的中国(省级):

图片附件: 游客没有浏览图片的权限,请 登录注册


数据准备

新建工作簿,添加数据集ds1,SELECT*FROM地图1,选中图表,选择图表属性表-数据,如下图所示:

图片附件: 游客没有浏览图片的权限,请 登录注册


选择图表属性表-样式>系列,如下图设置,边框设为蓝色:

图片附件: 游客没有浏览图片的权限,请 登录注册


自定义JS显示标签

选择图表属性表-样式>标签,内容选择自定义,JS如下:

图片附件: 游客没有浏览图片的权限,请 登录注册


程序代码:
function(){ var points = this.points; 
var total = '<div style="width:100%;height:100%;">';
if(this.name=="内蒙古自治区")
{total += '<div align=center style="margin-top:30px"><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">' +FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';}
else if(this.name=="黑龙江省")
{total += '<div align=center style="margin-top:100px;"><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+ FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';}
else{total += '<div align=center ><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';} 
for(var i = 0, len = points.length-2; i < len; i++)
{total += ('<div  align=center>'+FR.contentFormat(points[i].value, '#0.00')+'</div>');}
total+='</div>'; return total;}


div align=center style="margin-top当读取名字为内蒙古自治区时候,我们进行margin显示位置的调整,使其不显示偏离

FR.contentFormat(value, '#.##%')进行数值格式自定义,后面的'#.##%'可以根据实际需求进行更改;

this.points这个参数在地图中使用时表示同一个区域上的不同的系列的点

自定义JS显示提示点

选择图表属性表-样式>提示,内容选择自定义,JS如下:

图片附件: 游客没有浏览图片的权限,请 登录注册


程序代码:
function(){var points = this.points ;
var total = '<div style="width:100%;
background-color:#808080;color:white">';
total +='<div align=left style="font-size:16px">'+this.name+'</div>';
for(var i = 0, len = points.length-1; i < len; i++) 
{total +='<div align=left style="font-size:13px">●'+points[i].seriesName+':'+FR.contentFormat(points[i].value, '')+'</div>';} 
return total;}


此处做一个简单的循环,循环展示我们前端设置的参数,并对参数做单独的处理,包括控制字体大小,以及显示格式。

保存与预览

调整后效果如下,标签位置正确,提示采用了自定义格式:

图片附件: 游客没有浏览图片的权限,请 登录注册
搜索更多相关主题的帖子: 内蒙古 黑龙江 中国 标签 如何 
2017-02-22 10:59
快速回复:FineReport中如何用JavaScript自定义地图标签
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.015889 second(s), 9 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved