统计图在浏览器端展现时,不同的使用人员对图形的展现形式会有不同的要求,有的需要柱形图、有的想看折线图等,报表支持用户在浏览器端动态的选择统计图类型,关注乾学院,查看具体实现方法动态切换 web 报表中的统计图类型

需求:

报表以图形方式,也就是我们常说的“图表”形式展示时,不同的用户对图形类型有不同的要求,希望能够动态切换统计图类型,例如实现柱形图、条形图、折线图等图形间的动态切换。

思路:

常见的做法是在报表中多个单元格中生成不同的统计图,然后通过参数动态隐藏行来实现图形类型切换,但此种方法需要制作大量的图形图表,工作量较大,而且大量隐藏单元格会耗用内存,在性能上也有一定影响。 当然,肯定还会有别的方式……我们在制作统计图时会发现,绝大多数统计图设置方式基本类似,只需要设置分类轴、系列即可生成统计图。而生成的统计图是通过单元格表达式中的 graph() 函数实现的,参考该函数的帮助文档发现,该函数可以传入一个整型参数来控制统计图类型,这样我们就可以通过该参数实现统计图类型间的动态切换。下面,我们具体介绍下该种方式的实现。

一:制作统计表

以订单表为例,按货主地区统计订单数量,报表设计界面如下:

二:增加统计图

A3、B3 单元格合并,并更改该行高度,在 A3 中设置统计图:

统计图类型可任选,分类轴以及系列中设置相应表达式 ,点击确定即可。这样该单元格就生成了一个柱形图。

三:动态更改类型

报表中增加一个整数型参数:type,用于控制统计图类型,默认值设成 7 表示默认图形类型是柱形图:

将 A3 单元格的值表达式更改成 graph(type) 这样预览报表给该参数传递不同的值该单元格就能展示不同的图形类型。

四:页面端控制

报表制作好后,可在页面端增加一个参数表单进行动态控制。如果用户只需要看图形,可将报表的前两行设置隐藏,然后将没用的行列删除,将报表保存为为 tu.rpx,并增加参数表单报表,设置如下:

C1 单元格变量名属性设置成:type,C1 可做为下拉框供用户选择,值如下:

将报表保存为 tu_arg.rpx,在浏览器端访问 tu.rpx,更改参数点击查询即可,如选择折线图:

选择柱形图:

附:各图形类型对照关系: 1:区域图 2:条形图 3:三维条形图 4:三维簇状条形图 5:堆积条形图 6:三维堆积条形图 7:柱形图 8:三维柱形图 9:三维簇状柱形图 10:堆积柱形图 11:三维堆积柱形图 12:折线图 13:饼型图 14:散列图 15:三维区域图 16:三维折线图 17:三维饼型图 18:时序状态图 19:时间走势图 20:双轴折线图 21:双轴柱线图 22:雷达图 23:甘特图 24:仪表盘 25:里程碑

动态切换 web 报表中的统计图类型的更多相关文章

  1. CS0234: 命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Html、Ajax”(是否缺少程序集引用?)

    从SVN上down下来的程序,编译报了一大堆的错,发现是缺少引用,但是明明引用了,后来打开引用,发现system.web.mvc这个引用打着叹号,如图: 后来重新引用了本机的system.web.mv ...

  2. (转) CS0234: 命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Ajax”(是否缺少程序集引用?)

    从SVN上down下来的程序,编译报了一大堆的错,发现是缺少引用,但是明明引用了,后来打开引用,发现system.web.mvc这个引用打着叹号,如图, 后来重新引用了本机的system.web.mv ...

  3. 解决命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Ajax”(是否缺少程序集引用?)

    解决命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Ajax”(是否缺少程序集引用?) 1.右击引用中的System.Web.MVC,点击“属性” 把"复制本地" ...

  4. 在OpenERP报表中使用selection 类型字段

    OpenERP 在报表的创作中始终有一个麻烦,那就是在报表中通过对象导航的方式获取的 selection 字段只能获取到该字段的 key 而不能获取对应的用户友好的描述文本. 举个具体的例子:销售单的 ...

  5. ASP.NET程序中动态修改web.config中的设置项目(后台CS代码)

    using System;using System.Collections;using System.ComponentModel;using System.Data;using System.Dra ...

  6. 命名空间“System.Web.Mvc”中不存在类型或命名空间“Ajax”(是否缺少程序集引用?)

    原文  http://www.cnblogs.com/LJP-JumpAndFly/p/4109602.html 好吧,非常激动的说,这个问题搞了我一个晚上,网上的帖子太少了,好像不超过2篇,而且说得 ...

  7. MVC-命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Html”(是否缺少程序集引用?)

    如上截图,明明引用了“System.web.mvc”,可是还出这样的错误. 解决方法: 1.右键引用的“System.Web.Mvc” 2.<复制本地>一样选择<True> 3 ...

  8. 命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Ajax”(是否缺少程序集引用?)

    解放方法 右键打开这个项目引用System.Web.Mvc,如图: 将复制本地的值改为True,英文的话应该是Copy Local,这样就解决了上面的报错问题.

  9. 解决方案命名空间“System.Web.Mvc”中不存在类型或命名空间名称“Ajax”(是否缺少程序集引用?)

    首先对System.Web.Mvc这个dll文件重新引用本地的,添加引用,搜索mvc就可以出来,选择相应的版本.如果还不能正常运行, 然后右键打开这个项目引用System.Web.Mvc, 将复制本地 ...

随机推荐

  1. Redis 分布式锁进化史(解读 + 缺陷分析)

    Redis分布式锁进化史 近两年来微服务变得越来越热门,越来越多的应用部署在分布式环境中,在分布式环境中,数据一致性是一直以来需要关注并且去解决的问题,分布式锁也就成为了一种广泛使用的技术,常用的分布 ...

  2. MySQL:索引

    索引的目的在于提高查询效率,它的作用就相当于一本书的目录: 1. 常见的索引模型 1.1 哈希表 优点:适用于等值查询的场景: 缺点:范围查询效率较低: 1.2 有序数组 优点:范围查询和等值查询效率 ...

  3. moment.js 学习笔记

    一.安装 / 使用 npm install moment 注:使用版本为 2.22.2 var moment = require('moment'); moment().format(); // 20 ...

  4. mysql升级8.0后项目不能连接问题

    转载简书:https://www.jianshu.com/p/a164d582e5d9 主要是因为驱动配置变了driver中得用com.mysql.cj.jdbc.Driver,多了个cj: url后 ...

  5. javascript 最全面的数组操作合集

    一.数组添加.删除.替换.截取操作 1.arr.unshift(1) 在数组头部添加一个元素 1 (直接改变原数组,返回值为添加元素后数组的length) 2.arr.shift() 在数组的头部删除 ...

  6. Consul内部分享ppt

    Consul 是一个支持多数据中心,分布式,高可用的服务发现和配置共享系统.由 HashiCorp 公司使用 Go 语言开发,基于Raft协议.部署起来非常容易,只需要极少的可执行程序和配置文件,具有 ...

  7. underscore.js源码解析【数组】

    // Array Functions // --------------- // Get the first element of an array. Passing **n** will retur ...

  8. 从零开始学 Web 之 CSS3(六)动画animation,Web字体

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  9. 协程及Python中的协程

    1 协程 1.1协程的概念 协程,又称微线程,纤程.英文名Coroutine.一句话说明什么是线程:协程是一种用户态的轻量级线程.(其实并没有说明白~) 我觉得单说协程,比较抽象,如果对线程有一定了解 ...

  10. 百度编辑器 UEditor setContent()

    给编辑器赋值的代码: var ue = UE.getEditor('content'); ue.ready(function (){      ue.setContent(data.data.cont ...