基于ECharts 的高校实验室使用效益评估系统设计

遇炳昕，任光辉，吴金栋，曹正标

（1.中国民航大学 空中交通管理学院，天津 300300；2.中国民航大学 国有资产及实验室管理处，天津 300300；3.中国民航大学 招标采购中心，天津 300300；4.北京润尼尔网络科技有限公司，北京 100088）

实验室管理水平是决定高校建设和发展的重要因素，而实验室使用效益能直接反映实验室的管理水平[1]。近几年，部分高校已开始探索和实践实验室效益评估工作并开发了一些评估系统，如西南石油大学刘琴的经济管理类实验室绩效考核系统[2]、江苏大学马汉达的实验室管理绩效考核系统[3]等。这些系统虽能实现评估的基本流程，在一定程度上提高了工作效率，但无法对评估产生的大量数据进行有效统计和分析，导致评估参与者无法获取直观全面的结果反馈，评估管理者也难以做出有针对性的管理决策，造成了评估数据的闲置和浪费，现有系统并没有完全发挥出评估工作的重要作用，实用价值不高。

作为国内较早开展实验室使用效益评估工作的高校，中国民航大学于2016 年开展了全校第1 次实验室使用效益评估工作[4]，采集了大量实验室相关数据，推动了实验室建设和管理，但由于缺少线上评估系统，从组织专家现场考核到核算分数、公布结果共持续一个月，效率不高、人力消耗大，且面对大量评估数据难以进行有效的归纳和统计，无法深层挖掘评估结果，没有完全发挥实验室使用效益评估工作的作用。然而，国家教育委员会要求高校每5 年开展一次实验室使用效益评估[5]，我校将评估周期缩短为4 年一次，面对即将到来的2020 年第2 次评估，以上问题亟待解决。

为进一步发挥实验室使用效益评估工作的重要作用，提高工作效率，充分挖掘评估数据的价值，参考现有实验室使用效益评估系统，结合我校制定的《实验室使用效益评估指标体系》和《实验室使用效益评估标准》[6]，设计开发了高校实验室使用效益评估系统，利用ECharts（enterprise charts）图表库[7-9]实现评估数据的可视化分析，以多种图表的形式为评估参与者提供有效的结果反馈，为评估管理者提供准确的管理决策，为高校开展实验室使用效益评估工作提供了一个有效实例，同时对高校开发符合自身需求的实验室使用效益评估系统有很好的参考价值。

1 评估指标

我校《实验室使用效益评估指标体系》包含4 个一级指标、13 个二级指标和36 个三级指标，并按照功能和特点将实验室分为基础实验、专业实验和民航实训三类实验室，这三类实验室的一级指标权重对比见表1。

表1 三类实验室一级指标的权重对比

民航实训类实验室的评估指标权重如图1 所示。我校《实验室使用效益评估标准》包含36 个三级指标的详细分值标准，评估参与者在系统中填写数据并提交支撑材料，系统根据该标准自动计算各级指标得分和总分。

2 系统设计

2.1 整体架构设计

系统基于B/S 模式，浏览器端遵循W3C 标准[10]，服务器端使用Hibernate+Spring+ Struts2+Freemarker架构[11]，数据库使用MySQL，利用ECharts 图表库在浏览器端实现评估数据的可视化分析，采用面向切面编程（AOP）[12-14]思想，使系统结构清晰、易扩展，降低了系统的耦合度，提高了系统的易维护性。系统整体架构如图2 所示。

图1 民航实训类实验室的评估指标及权重

2.2 功能模块设计

系统主要包括实验室管理、评估标准管理、评估流程管理、评估数据可视化分析、系统管理5 个模块，如图3 所示。

图2 系统整体架构

实验室管理模块用于管理全校所有实验室的信息，包括名称、地点、面积、责任人和实验室编号等；评估标准管理模块用于自定义评估等级和查看评估指标体系；评估流程管理模块用于实现评估的基本工作流程，即评估任务发布、评估指标表填写、评估数据审核和评估结果生成；评估数据可视化分析模块用于统计评估数据和生成可视化分析图表；系统管理模块用于管理不同类型用户的信息和权限，并提供对后台数据的查询功能。

图3 系统功能模块

2.3 数据库结构设计

系统采用MySQL 管理数据信息，在MySQL 中采用InnoDB[15]存储引擎进行数据存储，系统的数据库主要包含5 个数据表：用户数据表（见表2）、实验室数据表（见表3）、评估标准数据表（见表4）、评估结果数据表（见表5）和评估数据关系数据表（见表6）。

表2 用户数据表

表3 实验室数据表

表4 评估标准数据表

表5 评估结果数据表

表6 评估数据关系数据表

3 基于ECharts 的可视化分析

ECharts 是一个纯Javascript 图表库，提供多达12类的数据可视化图表，赋予用户挖掘和整合数据的能力[7-9]。利用ECharts 图表库实现评估数据可视化分析，能够极大提升后台的数据处理速度和前端的体验效果。

3.1 工作流程

评估数据可视化分析功能的工作流程分为数据统计和可视化分析图表生成两部分，可视化分析的工作流程见图4。

图4 可视化分析的工作流程

首先进行数据统计，从数据库读取36 个三级指标得分；然后依次计算出13 个二级指标得分、4 个一级指标得分和总分，将得到的数据存储至数据库；最后ECharts 利用已统计的数据完成可视化分析图表的生成，共包含6 个步骤。

3.2 雷达图的生成

雷达图常用于多项指标的全面分析，具有完整、清晰和直观的优点。评估系统中的各级评估指标得分是典型的多变量数据，故选择用雷达图展示评估指标的得分情况。下面以评估体系中一级指标的雷达图为例，对生成可视化分析图表的6 个步骤进行详细介绍。

3.2.1 准备DOM 实例容器

DOM 实例容器是一个具有高宽的div 元素，id 是div 的唯一标识符，如果div 是隐藏的，ECharts 可能会获取不到div 的高宽导致初始化失败，故需明确指定div 的style.width 和style.height，单位为像素。

3.2.2 初始化ECharts 实例

函数initECharts 用于接收数据，包含4 个参数：id 是div 的唯一标识符；indicator 是实现雷达图多个维度的指示器；value 是单个数据项的数值；labName是实验室名称。用ECharts API 中的函数echarts.init创建一个ECharts 实例，并返回echartsInstance 实例，函数echartsInstance.setOption 用于最后一步生成雷达图。

3.2.3 读取评估数据

采用AJAX（asynchronous javascript and XML）技术[16-17]读取评估数据，以POST 方式从指定的url地址向服务器发送异步请求，url 为http://系统域名/项目名称/analysis/eResult/!searchSheet。由于返回的数据量较大，故需先对数据进行序列化处理，然后转换为JSON 格式，JSON 格式的数据传输快速、读取方便。回调函数success 中的data 就是序列化后的JSON 格式数据，即评估指标表中每一个指标的数据，将其传递给数组SheetVos，其中index 是数组下标，obj 是对应下标数组值，即一个指标的数据。通过遍历数组得到 labName、 fQuotaName、 fQuotaAScore 和fQuotaSScore，将这四个数据分别添加到对应的数组中，即存储实验室名称的数组labNameC、存储一级指标名称的数组fQuotaNameC、存储一级指标得分的数组 fQuotaAScoreC、存储一级指标满分的数组fQuotaSScoreC。

3.2.4 接收评估数据

循环读取每个实验室的相关数据，每调用一次initECharts(id,indicator,value,labName)函数则生成一张一级指标雷达图。indicator 是一个数组，用来指定雷达图中的多个维度，数组里的每一列代表一个维度，它有4 个可选的参数：name 是维度的名称、max 是维度的最大值、min 是维度的最小值、color 是维度名称的颜色。由于指标的最低得分是0，故不设置min，默认为0。一级指标共有4 个，分别为综合效能、实验教学、综合管理和创新服务能力。

在一级指标雷达图的实现中，indicator[i].name 对应一级指标名称，即数组fQuotaNameC 中存储的数据；value 对应一级指标得分，即数组fQuotaASChart中存储的数据；indicator[i].max 对应一级指标满分，即数组fQuotaSScoreC 中存储的数据。

3.2.5 配置图表参数

option 是一个用于设定图表配置项和数据的参数，在实现一级指标雷达图中使用了三个组件：tooltip提示框组件、radar 雷达图坐标系组件、series 参数配置组件。在tooltip 组件中，设置触发类型为item，即当鼠标移动到图标上会有包含数据的提示框出现。在radar 组件中，将在上一小节中获得的数组indicator传递给radar.indicator，用radar.center 设定雷达图中心坐标在容器的正中心，用radar.radius 设定雷达图外半径为80。在series 组件中，用series[i]-radar.itemStyle设定图样形式，用series[i]-radar.areaStyle 设定区域填充样式，用series[i]-radar.lineStyle 设定线条样式，均采用默认样式；将在上一小节中获得的参数value 和labName 分别传递给 series[i]radar.data[i].value 和series[i]radar.data[i].name，value 和name 分别代表一级指标得分和实验室名称，与radar.indicator[i]一一对应，代表同一个实验室的数据。

3.2.6 生成图表

setOption 函数通过执行在上一小节配置好的option 参数来生成雷达图，setOption 函数有4 个参数，option 是必选项，后三个是可选项，在缺省的情况下，当参数发生变更时ECharts 会立即合并新的数据并刷新图表。

4 系统测试与实例分析

将若干个同类别的实验室整合为一个实验中心，评估标准对实验中心仍然适用。为验证系统可靠性和有效性，采用2016 年中国民航大学第1 次实验室使用效益评估的历史数据对系统进行运行效果测试，评估单位与历史数据保持一致，同样以全校各二级学院共35 个实验中心为评估单位。

4.1 可靠性测试

测试完全按照评估任务发布、评估指标表填写、评估数据审核和评估结果生成的评估基本流程进行，整个过程仅用一周时间，相比线下评估所需时间，评估效率明显提升。测试所得的全校各实验中心在系统上的评估得分见表7，其中A、B、C 分别代表基础实验类、专业实验类和民航实训类，三类实验室使用各自的评估指标体系。

表7 全校各实验中心在系统上的评估得分

图5 将测试所得的评估得分与历史评估得分进行了对比，图中两条得分走势线基本重叠，说明使用系统评估与线下评估得到的结果是基本一致的，系统的可靠性良好。

图5 测试数据与历史数据对比

4.2 有效性测试

系统的评估结果可视化分析总览如图6 所示，所展示的信息包括评估得分、所属学院、实验室类型、当前排名、提交时间、一级指标雷达图等，并可根据所属学院、实验室类型和当前审核状态为条件进行筛选。图6 中的4 个实验中心分别对应表8 中的25 号、26 号、27 号和33 号，其中27 号是民航实训类实验室，说明系统能够将此类实验室纳入评估范围。

图6 评估结果可视化分析总览

系统的评估数据可视化分析功能提供等级分布图和得分雷达图两种评估结果展示方式。

等级分布图能够从宏观上整合出全校的整体情况及学院之间的对比，系统可以通过自定义得分区间来划分实验室使用效益评估得分的等级，本次测试设置共4 个评估等级：85 分≤优≤100 分，70 分≤良＜85分，50 分≤中＜70 分，0≤差＜50 分。评估结果等级分布见图7，全校有19 个实验中心的评估等级为“中”，占比54.3%，反映出目前我校整体的实验室使用效益不高，还有很大的整改提升空间。

得分雷达图能够从微观上挖掘一些不易通过数字展现的信息，如图8 上半部分所示，实验中心在一级指标“实验教学”“综合管理”和“综合效能”上表现较好，但在“创新服务能力”上表现较差，需重点整改这个方面。鼠标左键点击一级指标雷达图，则进入该实验中心的二级指标评估得分雷达图界面。由图8下半部分可以看出，该实验中心虽然在一级指标“实验教学”上表现较好，但在一级指标下的二级指标“实验研究”上表现较差。

图7 评估结果等级分布图

图8 评估得分雷达图

通过对等级分布图和得分雷达图的分析可知，系统能够从宏观和微观上为评估参与者提供直观全面的结果反馈，为评估管理者提供有针对性的管理决策，具有良好的有效性。

5 结语

本文对高校实验室使用效益评估系统进行了详细设计，包括整体架构、功能模块和数据库结构，以一级指标雷达图为例详细介绍了利用ECharts 图表库生成评估数据可视化分析图表的方法，并以历史评估数据对系统进行了测试和实例分析。测试与效果分析表明，系统设计合理，操作便捷，运行流畅，评估数据可视化分析功能可靠有效。通过等级分布图和得分雷达图从宏观和微观上帮助评估参与者和管理者制定实验室整改方向。

目前系统已成功申请软件著作权，并顺利部署在我校信息网络中心，预计于2020 年我校第2 次实验室使用效益评估工作中投入使用。希望通过对系统的使用能够促进学校实验室使用效益的提升，更好地发挥评估工作的重要作用，实现“以评促建”的评估目的，最终达到管理上的“闭环”。系统在其他高校研究和探索实验室效益评估工作上，具有一定的实用价值和参考意义。