《工业可视化》课件 任务4.1 设计设备租赁数据页面 -任务实施

项目四：设备营销租赁的可视化设计任务4.1设计设备租赁数据页面>>※任务实施《工业可视化》/工业互联网系列课程湖南三一工业职业技术学院《工业可视化》/工业互联网系列课程目录1.任务分析2.导入项目3.设计累计租赁数据4.设计租户信用排名5.设计租赁设备分布6.设计租金数据统计7.预览验证页面效果1.任务分析（1）

任务分析本任务的主要目的是设计租赁经营分析大屏，展示今年累计经营指标，租赁计划统计，企业积分排名TOP10，租赁设备分布，客户风险等级等，具体展示数据和显示组件分析结果如表所示：展示模块具体内容使用组件数据源今年累计经营指标本月出租设备数、本月租金收入、今年累计租户、今年累计租金文本组件、图片组件MYSQL数据库-本年度累计租赁指标租户信用排名租户信用排名柱状图组件MYSQL数据库-租户信用排名租赁设备分布租赁设备分布统计柱状图组件、数据下钻、数据关联MYSQL数据库-租赁设备分布设备出租详情表格组件、数据关联MYSQL数据库-租赁设备分布租金数据统计新增合同额、已逾期租金饼图MYSQL数据库-租赁数据统计应收金额、已收金额饼图MYSQL数据库-租赁数据统计任务分析2.导入项目（1）登录云视界，在云视界首页，单击“创建项目”，在弹出来的对话框中，通过“导入项目ID”新建项目，打开之后会弹出编辑界面。如图所示：创建项目3.设计累计租赁数据本任务设计的今年累计租赁指标，主要是使用文本和图片组件的形式来根据数据源的数据进行展示；使得信息更直观。设置文本（1）先把文本组件拖拽到本年度累计租赁指标区域，使本文显示“本月出租设备数”，属性可根据审美偏好进行设置；之后从“材库→素材库→图标→行业”素中拖拽合适的图标到页面如图所示的位置。（2）在基础组件中将文本组件拖拽到容器中，自定义设置其属性，单击数据源，类型选择“数据源”，数据源选择“本年度累计租赁指标”，取值选择“本月出租设备数”，最后单击保存当前页标签。设置数据源3.设计累计租赁数据（3）重复前两步的操作，分别完成“本月租金收入”“今年累计租户”“今年累计租金”的文本设置，其对应的数据源都是“本年度累计租赁指标”，取值分别对应如图所示。设置其他文本3.设计累计租赁数据（1）在基础组件-图表中将柱状图拖拽至租户信用积分排名区域的合适位置，本示例选择“横向柱状图”。设置其他文本4.设计租户信用排名柱状图属性的图表选项和非实时数据处理的设置如下图所示。其中非实时数据处理的“倒序”为否，“正序”为是，“数目”为6，即为至显示正序的前6条数据。其他属性可无需调整。4.设计租户信用排名4.设计租户信用排名（2）配置横向柱状图的数据源。选中柱状图时，切换到数据源栏，数据源选择“租户信用排名”，维度选择“租户简称”，度量选择“信用积分”。设置数据源5.设计租赁设备分布（1）添加柱状图组件。在基础组件-图表中将柱状图拖拽至租赁设备分布统计区域的合适位置，组件的属性设置可自定义。添加柱状图5.设计租赁设备分布（2）设置下钻目录。选中柱状图时，切换到数据源栏。①数据源选择“租赁设备分布”，②单击“配置数据源”标签会展开配置框，③选中“省份”后单击右键，在右键菜单中创建下钻目录1。设置下钻目录5.设计租赁设备分布（3）设置维度和度量。①依次将“城市”“租户简称”加入到创建的“下钻目录1”，②通过选中并拖拽的方式将“下钻目录1”拖拽到维度下，③将维度中的“分组开关”开启，④度量选择“租赁设备数”，如图所示，最后记得保存。设置维度度量当在维度开启了分组功能后，此度量默认的汇总方式为“求和”，如果需要设置其它汇总方式可以通过单击度量内的设置图标进行设置。5.设计租赁设备分布（4）添加表格组件。在基础组件-基础中将表格拖拽到容器的合适位置，属性可自定义，切换到数据源栏中，数据源选择“租赁设备分布”，维度依次选择“省份”“城市”“租户简称”“租赁设备数”，将表格翻页勾选上。添加表格组件5.设计租赁设备分布（5）开启数据关联功能。单击可视化编辑器导航栏的“图层”标签，在左边的导航栏中看到图层结构，单击“租赁经营分析大屏，在右边属性栏中将“数据关联”的开关打开，最后保存。开启数据关联5.设计租赁设备分布（6）①单击柱状图右上角的组件联动图标，②在弹出的右边框中将“组件联动”的开关开启，③单击勾选设备出租详情区域的表格的左上角选中表格，④单击右下角的“确定”按钮，完成柱状图与表格的组件联动设置。设置组件联动6.设计租金数据统计（1）添加饼图组件。在图表组件中，找到“饼图”将其拖拽到租赁收入统计区域中，图表主题选择“主题2”，数值样式选择“数值”，字号选择“18”，环形大小选择“60”，其他参数自定义设置。添加饼图6.设计租金数据统计（2）设置饼图数据源。切换到数据源标签，数据源选择“租赁数据统计”，度量依次选择“已逾期金额”“新增合同额”，完成后保存并刷新。设置数据源6.设计租金数据统计（3）按照前2步的操作，添加另一个饼图，其数据源选择“租金应收统计”，度量选择“应收金额”“已收金额”。设置其他饼图7.预览验证页面效果（1）保存后单击预览标签，会出现预览效果，单击全屏预览，在全屏预览模式下，单击租赁设备分布统计的柱状图。预览效果7.预览验证页面效果（2）如果前面的设置没有问题的话，那么此时柱状