(19)国家知识产权局 (12)发明 专利申请 (10)申请公布号 (43)申请公布日 (21)申请 号 202210720295.4 (22)申请日 2022.06.23 (71)申请人 西安热工 研究院有限公司 地址 710048 陕西省西安市碑林区兴庆路 136号 (72)发明人 曾卫东　刘鹏飞　王毅　 (74)专利代理 机构 西安通大专利代理有限责任 公司 6120 0 专利代理师 贺小停 (51)Int.Cl. G06F 8/38(2018.01) G06F 9/451(2018.01) (54)发明名称 实现双向仪表图的方法、 系统、 设备及可读 存储介质 (57)摘要 本发明公开了一种实现双向仪表图的方法、 系统、 设备及可读存储介质， 方法包括： 创建一个 HTML页面， 并且 通过script标签将javascrip t脚 本echarts.js、 echarts ‑twoWayGauge.js嵌入到 页面中； 在HTML页面中加入DIV元素， 并且通过 echarts将DIV元素创建为echarts实例； 创 建双 向仪表图所需要的配置项， 并且将配置项赋值到 echarts实例， 通过基于 echarts的双向仪表图的 插件在HTML界面上生成对应的双向仪表图。 本发 明可以对火电机组中， 如耗差、 汽轮机真 空值、 排 烟氧量、 发电利润等双向指标进行形象的展示， 用户可以通过双向仪表一目了然的了解指标与 中心基准为的正方向和负方向的偏 差， 对生产决 策提供形象的数据依据。 对echarts的仪表图进 行了补充， 丰富ec harts的数据展示方式。 权利要求书2页 说明书10页 附图5页 CN 114995815 A 2022.09.02 CN 114995815 A 1.实现双向仪表图的方法， 其特 征在于， 包括： 创建一个HTML页面， 并通过script标签将javascript脚本echarts.js、 echarts ‑ twoWayGauge.js嵌入到页面中； 在HTML页面中加入DIV元 素， 并且通过 echarts将DIV元 素创建为ec harts实例； 读取火电机组相关双向指标的原 始值， 并且将双向指标的值进行 标准化处理； 创建双向仪表图所需要的配置项， 配置项中双 向仪表图的值为双 向指标的标准值， 并 且将配置项赋值到echarts实例， 通过基于echarts的双向仪表图的插件在HTML界面上生 成 对应的双向仪表图。 2.根据权利要求1所述的实现双向仪表图的方法， 其特 征在于， 所述基于ec harts的双向仪表图的插 件的创建过程具体为： 通过script标签将javascript脚本echarts.js和echarts ‑twoWayGauge.js嵌入到新 的HTML页面中； 创建echarts ‑twoWayGauge.js， 并完成初始化的处理； 通过render函数中传入的ap i参 数获取到具体的DIV元 素， 然后在这个DIV元 素上创建ec harts实例； 利用配置项创建双向仪表图生成器， 得到背景圆弧的图形配置和数值圆弧的图形配 置； 将背景圆弧的图形配置和数值圆弧的图形配置添加到echarts总体配置中并通过 setOption方法将配置赋值给 echarts实例， 基于ec harts的双向仪表图的插 件创建完毕。 3.根据权利要求2所述的实现双向仪表图的方法， 其特 征在于， 所述echarts ‑twoWayGauge.js文件实现用于扩展echarts组件的两个必要接口： 用于 创建双向仪表图界面的echarts.extendChartView及用于处理双向仪表图数据配置的 echarts.extendSeriesModel； 所述echarts.extendChartView包括用于绘制具体双向仪表 图图形的render函数， 所述ech arts.extendSeriesModel包括用于双向仪表图图形数据的 标准化处理的getInitialData函数、 用于返回双向仪表图的默认配置项的defaultOption 函数以及用于在配置项发生变更后进行图形数据处理的optionUpdated函数； 所述配置项 包括双向仪表图的弧度arc和双向仪表图的宽度w idth。 4.根据权利要求3所述的实现双向仪表图的方法， 其特 征在于， 所述echarts ‑twoWayGauge.js的echarts .extendSeriesModel方法中的 defaultOption函数用于返回双向仪表图的默认配置项， 默认配置项中value为双向仪表图 的值； endValue为双向仪表图的最大值； width为双向仪表图的宽度； arc为双向仪表图的弧 度； positiveColor为双向仪表图当value为正值的颜色； negativeColor为双向仪表图当 value为负值的颜色。 5.根据权利要求2所述的实现双向仪表图的方法， 其特 征在于， 所述利用配置项创建双向仪表图生成器， 得到背景圆弧的图形配置和数值圆弧的图形 配置， 具体包括： 在render函数中创建echarts的实例， 然后根据双向仪表图的弧度arc和双向仪表图的 宽度width生 成双向仪表图的背 景圆弧图形配置， 背 景圆弧的起始角度为90+ arc， 结束角度 为90‑arc， 背景圆弧的宽度为 width； 所述配置项还包括双向仪表图的限值endValue、 双向仪表图的值value； 当value< ‑权　利　要　求　书 1/2 页 2 CN 114995815 A 2endValue时， 将 ‑endValue的值赋值给value， 当value>endValue时， 将endValue的值赋值给 value； 通过arc、 value、 endValue来计算出双向仪表图数值圆弧的开始角度和结束角度； 最终通过双向仪表图的值value、 双向仪表图正值 的颜色positiveColor、 双向仪表图 负值的颜色negativeColor、 数值圆弧的开始角度startAngle、 数值圆弧的结束角度 endAngle生成数值圆弧的图形配置 。 6.根据权利要求5所述的实现双向仪表图的方法， 其特 征在于， 通过arc、 value、 endValue来计算出双向仪表图数值圆弧的开始角度和结束角度， 具体 的公式如下： 当value≥0时： startAngle＝90 endAngle＝90 ‑(value÷endValue ×arc)\360 当value< 0时： startAngle＝90+|(value ÷ebdVakye) ×arc|\360 endAngle＝90 其中star tAngle为数值圆弧的开始角度， endAngle为数值圆弧的结束角度。 7.根据权利要求5所述的实现双向仪表图的方法， 其特 征在于， 所述配置项中双向仪表图正值的颜色positiveColor、 双向仪表图负值的颜色 negativeColor满足： 当value≥0时， 双向仪表图的数值圆弧的颜色为positiveColor， 当 value<0时， 双向仪表图的数值圆弧的颜色为 negativeColor。 8.一种实现双向仪表图的系统， 其特 征在于， 创建及嵌入模块： 用于创建一个HTML页面， 并且通过script标签将javascript脚本 echarts.js、 ec harts‑twoWayGauge.js嵌入到页面中； echarts实例创建模块： 用于在HTML页面中加入DIV元素， 并且通过echarts将DIV元素 创建为ec harts实例； 读取原始值模块： 用于读取火电机组相关双 向指标的原始值， 并且将双 向指标的值进 行标准化处理； 双向仪表图生成模块： 用于创建双 向仪表图所需要的配置项， 配置项中双 向仪表图的 值为双向指标的标准值， 并且将配置项赋值到echarts实例， 通过基于echarts的双向仪表 图的插件在HTML界面上生成对应的双向仪表图。 9.一种计算机设备， 包括存储器、 处理器以及存储在所述存储器中并可在所述处理器 上运行的计算机程序， 所述处理器执行所述计算机程序时实现权利要求 1至7任一项 所述实 现双向仪表图的方法的步骤。 10.一种计算机可读存储介质， 所述计算机可读存储介质存储有计算机程序， 所述计算 机程序被处 理器执行时实现权利要求1至7任一项所述实现双向仪表图的方法的步骤。权　利　要　求　书 2/2 页 3 CN 114995815 A 3