[]
        
在线Demo 免费试用
(Showing Draft Content)

图片

1. 功能概述

报表中有很多需要使用图片的场景,比如报表顶部的Logo图片,又如产品清单类报表中的产品图片。

图片组件就是用于在报表中显示图片。图片组件可以直接在报表中使用,也可以在表格单元格内使用。并且图片允许您使用系统内部的共享图片、外部图片资源、数据库中的图片资源。

image2020-11-2_10-49-22.png


本节为您介绍图片的常用设置及操作方法。

2. 操作步骤

2.1 前提条件

  1. 数据要求: 已完成数据连接与数据准备,本文将以本地Excel文件直连数据集为例演示操作流程。

  2. 界面要求: 已进入报表设计界面,且报表至少已绑定一个数据集(如“直连数据集测试图片”)。

2.2 操作步骤

2.2.1 添加组件

  1. 在报表设计器界面,单击左侧组件工具箱,选择图片组件,按住鼠标左键将其拖拽至报表设计区域,成功添加一个图片组件。也可以将其拖拽到表格单元格中。

    PixPin_2025-06-30_13-59-12

2.2.2 绑定数据

  1. 选中图片组件,在属性设置中找到图片属性,可设置图片的来源。

    PixPin_2025-06-30_13-59-48

    图片来源

    说明

    系统图示

    共享图片

    指系统门户页面中的图片

    PixPin_2025-06-30_14-03-50

    内嵌图片

    指上传的图片文件,仅供本报表自己使用

    单击加载,可选择本地图片文件,上传后再单击选择,即可在图片元素内显示上传的图片

    此处可以使用在报表全局设置中上传的内嵌图片

    PixPin_2025-06-30_14-06-09

    外部数据和数据库图片(二进制图片/Base64 data URL/外部URL)

    如使用数据库图片或外部图片,则需先展开图片设置项目

    PixPin_2025-06-30_14-08-49

  • 属性介绍: 我们首先来看来源 属性。

    • 单击下拉箭头可以看到图片的来源有三种,分别是:外部内嵌数据库

      PixPin_2025-06-30_14-10-03

    • 使用数据库二进制图片数据: 数据库图片是指数据集的 Image 类型字段所保存的二进制图片。如需使用数据库中的 Image 类型字段,则需绑定图片字段。

      PixPin_2025-06-30_14-12-02

    • Base 64 data URL 与外部URL: 如数据集字段不是 Image 类型,而是字符型,内容是图片的 URL 地址,那么应将图片来源设置为外部,然后绑定图片字段(Base 64 data URL 与外部URL)。

      PixPin_2025-06-30_14-12-44

  1. 图片来源设置完成后,预览可查看图片效果。

    PixPin_2025-06-30_14-14-15

  2. 在预览界面,很明显图片没有显示完整,这是因为图片大小属性导致的。接下来设置图片的显示属性,使其居中对齐,等比缩放即可。

    type=info

    提示:

    1)任意一个图片的 URL 地址,都可以作为图片元素的图片源,设置来源外部;设置图片为一个图片的 URL 网址,如下图:

    PixPin_2025-06-30_14-20-24

    2)图片 URL 可以是一个固定网址(如 https://example.com/image.jpg),也可以使用字符串动态拼接(如 https://xx.com/images/.../{xxx.ToString()}),以便在数据库中仅存储文件名,而域名和路径通过表达式自动补全。

2.2.3 图片属性设置

  1. 选中图片组件,在右侧属性面板设置,大小,对齐属性,如下示:

    PixPin_2025-06-30_14-22-01

  2. 设置完成后,预览效果。

    PixPin_2025-06-30_14-23-46

  3. 图片组件常用属性说明:

    选项组

    选项名称

    说明

    常规选项

    名称

    设置当前图片的名称,如“图片1”

    钻取操作

    钻取类型

    设置图片的钻取操作类型。钻取操作是指查看报表时,单击图片之后,报表系统所做的操作。钻取操作类型包括四种:

    • 应用到报表参数: 与参数配合实现动态效果,应用方法请参考图表联动

    • 跳转至报表: 此选项用于设置从当前报表跳转到另一个报表。请选择需要跳转的目的报表,并根据需要设置跳转时传递给目的报表的参数。具体的应用场景及其操作方法,请参见钻取报表

    • 跳转至书签: 此选项用于当前报表范围内的跳转。对于多页报表,可通过书签定义以及跳转至书签的设置,使得报表内容之间的跳转更为方便。报表中的每个元素都可以设置一个书签,用作跳转的目的锚点。

    • 跳转至URL: 用于跳转到一个外部网页。实际应用中,此选项可以用于跳转到事先部署好的某个网页,以便报表用户更好地解读报表内容。

    外观

    图片

    设置图片,单击下拉箭头可选择共享图片、内嵌图片和数据库图片,单击image2019-3-14_19-8-27.png设置图片来源、数据及格式

    大小

    设置图片的大小,可设置自动、缩放、等比例缩放、剪切

    水平对齐

    设置水平对齐,可选择居左、居中或居右

    垂直对齐

    设置垂直对齐,可选择顶端对齐、垂直居中或底端对齐

    边框选项

    粗细

    设置图片边框的粗细

    线型

    设置图片边框的线型样式

    颜色

    设置图片边框的颜色

    位置&大小

    设置图片左上角的横向位置

    设置图片左上角的竖向位置

    宽度

    设置图片的总宽度

    高度

    设置图片的总高度

    页面布局

    内部间距

    设置图片内部的间距,单击image2018-6-14_14-58-21.png分别设置四个方向的间距

    显示选项

    隐藏

    设置是否隐藏该组件

    可以设置为IIF表达式,在某些条件下隐藏,以便根据用户身份或者其他信息决定是否显示,从而达到保护敏感信息的目的

    切换元素

    设置另一个元素,比如一个文本框,作为是否显示当前组件的开关

    其他选项

    鼠标提示

    设置鼠标移动到图片上方时的提示文本内容

    标签

    设置一个文本内容,用作报表目录项的显示文字

    报表目录是用是用左侧组件工具箱中的目录组件制作,目录用于多页报表中的快速定位跳转

    书签

    输入文本或表达式,用作跳转到本元素的定位标识

    在其他元素处设置钻取操作并选择跳转到书签为这个书签,就可以在查看报表单点击其他元素跳转到本元素