基于工业互联网的数图联动显示方法、装置、设备及介质与流程

1.本发明涉及数据显示技术领域，尤其涉及一种基于工业互联网的数图联动显示方法、装置、设备及介质。


背景技术：

2.现如今，工业生产离不开设备采集数据，为了在生产过程中能更直观更方便地看到设备的各项数据指标，需要对生产设备进行监控以获取相应参数信息，而传统技术中对设备进行监控的功能十分单一，仅仅能够获取监控得到的设备数据进行察看，当需要察看生产工艺数据时，则需要调取其它设备中独立存储的生产工艺数据，由于生产工艺数据和设备数据相互分离，导致对相关数据显示缺乏了关联性和直观性，导致数据显示效率较低。因此，现有技术中对与设备相关联的数据进行显示时存在显示效率较低的问题。


技术实现要素：

3.本发明实施例提供了一种基于工业互联网的数图联动显示方法、装置、设备及介质，旨在解决现有技术中对与设备相关联的数据进行显示时所存在的显示效率较低的问题。
4.第一方面，本发明实施例提供了一种基于工业互联网的数图联动显示方法，该方法应用于终端设备中，方法包括：
5.获取至少一个生产步骤；
6.从数据库中获取与每一所述生产步骤相关联的运行参数值并生成第一显示视图，所述运行参数值包括传感器从工业生产设备中采集的至少一种参数对应的数值和/或所述工业生产设备的状态信息；
7.获取每一种参数的连续变化信息并生成第二显示视图；所述连续变化信息为参数的数值随时间进行连续性变化的信息；
8.将所述第一显示视图与所述第二显示视图组合得到联动视图并进行显示；
9.若监听到用户的操作信息为点击所述联动视图中的任一显示视图，获取所述操作信息对应的时间特征信息；
10.根据所述时间特征信息对所述联动视图的另一显示视图中与所述时间特征信息对应的显示信息进行变换显示。
11.第二方面，本发明实施例提供了一种基于工业互联网的数图联动显示装置，该装置配置于终端设备中，装置包括：
12.生产步骤获取单元，用于获取至少一个生产步骤；
13.第一显示视图生成单元，用于从数据库中获取与每一所述生产步骤相关联的运行参数值并生成第一显示视图，所述运行参数值包括传感器从工业生产设备中采集的至少一种参数对应的数值和/或所述工业生产设备的状态信息；
14.第二显示视图生成单元，用于获取每一种参数的连续变化信息并生成第二显示视
图；所述连续变化信息为参数的数值随时间进行连续性变化的信息；
15.视图显示单元，用于将所述第一显示视图与所述第二显示视图组合得到联动视图并进行显示；
16.时间特征信息获取单元，用于若监听到用户的操作信息为点击所述联动视图中的任一显示视图，获取所述操作信息对应的时间特征信息；
17.变换显示单元，用于根据所述时间特征信息对所述联动视图的另一显示视图中与所述时间特征信息对应的显示信息进行变换显示。
18.第三方面，本发明实施例又提供了一种计算机设备，其包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述第一方面所述的基于工业互联网的数图联动显示方法。
19.第四方面，本发明实施例还提供了一种计算机可读存储介质，其中所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行上述第一方面所述的基于工业互联网的数图联动显示方法。
20.本发明实施例提供了一种基于工业互联网的数图联动显示方法、装置、设备及介质。获取至少一个生产步骤，并从数据库中获取与生成步骤相关联的运行参数值生成第一显示视图，获取每一种参数的连续变化信息生成第二显示视图，将第一显示视图与第二显示视图组合为联动视图并进行显示；若监听到用户的操作信息为点击联动视图中的任一显示视图，获取对应的时间特征信息并对另一显示视图中与时间特征信息对应的显示信息进行变换显示。通过上述方法，可生成由第一显示视图及第二显示视图组合形成的联动视图进行显示，并根据用户输入的操作信息对另一未操作的显示视图进行显示信息的变换显示，可对生产数据与设备数据进行关联并在同一显示视图中对显示信息进行联动变换显示，大幅提高了对设备相关联的数据进行显示的效率。
附图说明
21.为了更清楚地说明本发明实施例技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
22.图1为本发明实施例提供的基于工业互联网的数图联动显示方法的流程示意图；
23.图2为本发明实施例提供的基于工业互联网的数图联动显示方法的应用场景示意图；
24.图3为本发明实施例提供的基于工业互联网的数图联动显示方法的效果示意图；
25.图4为本发明实施例提供的基于工业互联网的数图联动显示方法的子流程示意图；
26.图5为本发明实施例提供的基于工业互联网的数图联动显示方法的另一子流程示意图；
27.图6为本发明实施例提供的基于工业互联网的数图联动显示方法的又一子流程示意图；
28.图7为本发明实施例提供的基于工业互联网的数图联动显示方法的再一子流程示意图；
29.图8为本发明实施例提供的基于工业互联网的数图联动显示方法的后一子流程示意图；
30.图9为本发明实施例提供的基于工业互联网的数图联动显示方法的其后一子流程示意图；
31.图10为本发明实施例提供的基于工业互联网的数图联动显示装置的示意性框图；
32.图11为本发明实施例提供的计算机设备的示意性框图。
具体实施方式
33.下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
34.应当理解，当在本说明书和所附权利要求书中使用时，术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在，但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。
35.还应当理解，在此本发明说明书中所使用的术语仅仅是出于描述特定实施例的目的而并不意在限制本发明。如在本发明说明书和所附权利要求书中所使用的那样，除非上下文清楚地指明其它情况，否则单数形式的“一”、“一个”及“该”意在包括复数形式。
36.还应当进一步理解，在本发明说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合，并且包括这些组合。
37.请参阅图1及图2，图1为本发明实施例提供的基于工业互联网的数图联动显示方法的流程示意图；图2为本发明实施例提供的基于工业互联网的数图联动显示方法的应用场景示意图；该基于工业互联网的数图联动显示方法应用于基于工业互联网的数图联动显示系统100的终端设备2000中，该基于工业互联网的数图联动显示方法通过安装于终端设备2000中的应用软件进行执行，终端设备2000在执行上述方法的过程中，终端设备2000与服务器1000之间建立网络连接以实现数据信息的传输，获取服务器1000中存储的数据库的数据，数据库中的数据来源于工业生产设备4000的控制器3000，传感器采集工业生产设备4000的数据并通过plc3000(可编程逻辑控制器，programmable logic controller)输出至控制器。终端设备2000即是用于执行基于工业互联网的数图联动显示方法以对与工业生产设备向关联的各项信息进行显示的终端设备，终端设备2000可以是台式电脑、笔记本电脑、平板电脑或手机等可进行数据处理及显示的终端设备，服务器1000即是用于与终端设备2000建立网络连接以进行数据传输的服务器端，具体可以是服务器群组1001，传感器4001即是将从工业生产设备所采集的初始参数信息传输至plc并进一步传输至控制器的感应装置，如温度传感器、水位传感器、流速传感器等，控制器可基于以太网、4g或5g等无线网络技术与服务器1000建立网络连接，以对数据信息进行无线传输，从而将控制器获取的数据传输至服务器1000的数据库中进行存储。如图1所示，该方法包括步骤s110～s160。
38.s110、获取至少一个生产步骤。
39.工业生产设备上配置的传感器可采集工业生产设备的各项参数对应的数值，并将所采集的数值作为初始参数信息发送至控制器，服务器采集控制器中的数值并存储至服务
器内配置的数据库中，终端设备可获取数据库中的数据并进行后续处理。具体的，数据库中还存储有预先设置的一个或多个生产步骤，则终端设备可从服务器内配置的数据库中获取至少一个生产步骤。
40.例如，本技术示例中的工业生产设备为用于印染生产的染色机，服务器可与一台或多台染色机建立网络连接，则服务器的数据库中存储有一台或多台染色机对应的数值，服务器可依次通过生产步骤的控制信息对各染色机进行染程工艺控制，或将生产步骤的控制信息下发至智能控制器，通过智能控制器对各染色机进行染程工艺控制；染色机中的传感器可对染色机进行监控以获取初始参数信息，并将获取的初始参数信息传输至服务器。
41.在实际应用过程中，可接收工业生产设备在完整工艺流程中对应的初始参数信息，终端设备在工艺流程结束后对初始参数信息进行后续显示。还可以是，服务器实时接收工业生产设备中传感器的初始参数信息，终端设备结合各生产步骤对实时接收的初始参数信息进行实时显示。
42.每一传感器可单独将采集得到的参数数值作为初始参数信息发送至服务器，此时一份初始参数信息中仅包含一种参数对应的数值。也可以是每一传感器对采集得到的初始参数信息进行整合形成多个参数对应数值的初始参数信息并发送至服务器；则一份初始参数信息中包含多个参数在同一采集时间所对应的数值。
43.例如，在设备生产过程中，每个生产步骤在进行执行过程中均会记录生产过程中的各项运行参数值，如温度、水位等，用户可以直观地看到当前正在执行的步骤。采集得到的初始参数则可对应在右部区域中以曲线图形式进行显示，可根据所采集得到的初始参数在曲线图中进行对数据进行实时追加来体现实时性。
44.s120、从数据库中获取与每一所述生产步骤相关联的运行参数值并生成第一显示视图。
45.从数据库中获取与每一所述生产步骤相关联的运行参数值并生成第一显示视图，所述运行参数值包括传感器从工业生产设备中采集的至少一种参数对应的数值和/或所述工业生产设备的状态信息。
46.服务器中配置有数据库，数据库中存储有由多个生产步骤组成的生产步骤列表及初始参数信息，则生产步骤列表中包含多个生产步骤，生产步骤中包含所设定的控制信息，通过各生产步骤中的控制信息即可对工业生产设备的整个生产流程进行控制；初始参数信息中包括多个参数对应的数值，初始参数信息可对工业生产设备在各时间点的设备工作状态进行直观体现。
47.可获取数据库中每一生产步骤相关联的运行参数值，运行参数值至少包括控制信息所设定的参数值，运行参数值还可以包括初始参数信息中的部分数值。如图3所示，所得到的第一显示视图为图3中左侧视图。
48.在一实施例中，如图4所示，步骤s120包括子步骤s121、s122和s123。
49.s121、确定每一所述生产步骤中主功能步骤及并行功能步骤分别对应的运行参数；s122、从所述数据库中获取每一所述生产步骤的运行参数对应的运行参数值。
50.具体的，生产步骤中包含主功能步骤以及与主功能步骤并行执行的并行功能步骤，可根据生产步骤中所包含的主功能步骤与并行功能步骤确定生产步骤对应的运行参数。
51.例如，如图3所示，步骤10中的主功能步骤为呼叫助剂，主功能步骤的运行参数为“助剂”，并行功能步骤为料桶1入水，并行功能步骤的运行参数包括“料桶1水源”、“料桶1水位”、“料桶1搅拌时间”、“料桶1温度”。
52.数据库包含各项参数对应的数值，即可从数据库中获取与生产步骤的运行参数对应的运行参数值。
53.在一实施例中，如图5所示，步骤s120中从所述数据库中获取每一所述生产步骤的运行参数对应的运行参数值的步骤，包括子步骤s1221、s1222和s1223。
54.s1221、确定每一所述生产步骤对应的步骤时区。
55.可先确定每一生产步骤对应的步骤时区。在实际应用过程中，只有通过各生产步骤开始实现对工业生产设备进行生产工艺控制，才能从传感器获取有效的参数信息，当工业生产设备的工艺流程结束之后(例如，生产步骤列表中所有生产步骤均执行完毕)，即可根据各生产步骤的实际执行时间确定对应的步骤时区，步骤时区包含生产步骤的开始执行时间及结束执行时间。当工业生产设备的工艺流程启动后(例如，生产步骤列表中第一个生产步骤至少开始执行)，即可根据各生产步骤的预设执行时长及第一个生产步骤的开始执行时间确定每一生产步骤对应的步骤时区，则此时，当生产步骤执行完毕时，步骤时区包含生产步骤的开始执行时间及结束执行时间；当生产步骤开始执行但并未执行完毕时，步骤时区包含生产步骤的开始执行时间及预计结束执行时间；当生产步骤未开始执行时，步骤时区包含生产步骤的预计开始执行时间及预计结束执行时间。
56.s1222、根据所述数据库中每一数值的采集时间确定所述数值对应的步骤时区，并获取每一所述生产步骤的步骤时区对应的数值作为目标数值。
57.初始参数信息中每一数值均对应包含一个采集时间，可根据采集时间确定数值对应所属的步骤时区，也即是判断数值的采集时间是否位于某一生产步骤的步骤时区内，从而确定数值所属的步骤时区，获取各生产步骤的步骤时区包含的数值作为目标数值。
58.s1223、获取每一所述生产步骤的目标数值中与所述生产步骤的运行参数对应的数值作为相关联的运行参数值。
59.可根据生产步骤的目标数值，从每一生产步骤的目标数值中获取与该生产步骤的运行参数对应的数值，作为需展示的运行参数值。
60.s123、根据所述生产步骤的排序及每一所述生产步骤的运行参数值，生成包含每一所述生产步骤对应运行参数值的第一显示视图。
61.可根据数据库中生产步骤的排序及每一生产步骤的运行参数值，对每一生产步骤对应的运行参数值进行排序整理，并生成对应的第一显示视图。具体的，可采用div标签渲染的方式生成第一显示视图，使用vue的v-for指令基于一个数组来渲染生成，同时将生产步骤的主功能步骤和并行功能步骤也采用v-for指令进行循环渲染，并结合icon图标对进行标识关联，提高辨认度。第一显示视图中的运行参数值可对每一生产步骤中步骤的详细运行信息进行记录，包括执行步骤名词、开始执行时间(或预计开始执行时间)和结束执行时间(或预计结束执行时间)、持续时间、主功能步骤和并行功能步骤及各项运行参数对应的运行参数值。
62.s130、获取每一种参数的连续变化信息并生成第二显示视图。
63.获取每一种参数的连续变化信息并生成第二显示视图；所述连续变化信息为参数
的数值随时间进行连续性变化的信息。数据库中还包含存在连续变化的参数，可从数据库中获取每一参数的连续变化信息，并根据连续变化信息生成对应的第二显示视图。
64.如图3所示，所生成的第二显示视图如图3中的右侧视图，第二显示视图中包含主图、附图及堆叠图。第二显示视图的上半部分包含参数曲线图，可采用采用canvas绘画标签实现，第二显示视图可使用echarts图表进行可视化渲染，各参数的连续变化信息以折线图方式展示，达到实时监控效果和数据分析对比效果。例如，主图及附图中的参数曲线可基于相同时间轴进行显示，还可以是主图、副图及堆叠图基于相同时间轴进行显示；三种设备状态以堆叠图方式展示，分别对应设备运行状态、设备告警数据、设备操作模式。
65.在一实施例中，如图6所示，步骤s130包括子步骤s131、s132、s133和s134。
66.s131、获取各参数的数值得到各参数的连续变化信息。
67.具体的，可判断数据库中各参数的数值是否随时间进行连续性变化，若参数的数值随时间进行连续性变化，则获取该参数所对应的所有数值作为对应的连续变化信息。若参数的数值并未随时间进行连续性变化，则该参数不存在对应的连续变化信息，也即无需获取该参数的连续变化信息。
68.s132、根据所述各参数的连续变化信息生成各参数对应的参数曲线。
69.可根据各参数的连续变化信息生成各参数对应的参数曲线，具体的，将参数的连续变化信息在平面坐标系上以时间轴进行排序，并对连续变化信息中各数值进行连线，即可得到对应的参数曲线，则每一存在连续性变化的参数可对应生成一条参数曲线，参数曲线的横轴(x轴)即对应时间，纵轴(y轴)对应相应数值。
70.s133、根据所述数据库中预存的设备状态参数值生成对应的堆叠图。
71.可从数据库中获取对应的设备状态参数值，设备状态参数值可用于对工业生产设备在每时刻的状态进行记录，其中，设备状态参数值包含设备运行状态、设备告警数据、设备操作模式所对应的参数值，三种设备状态以堆叠图方式展示。
72.例如，在本技术的一具体实施例中，在堆叠图中(设备运行状态部分：运行或告警)使用分段变色的方式进行显示，配置每段的设备状态颜色和告警颜色。
73.s134、选择至少一条所述参数曲线与所述堆叠图组合，以生成第二显示视图。
74.在实际应用过程中，可选择至少一条参数曲线并生成对应的第二显示视图，则第二显示视图可对参数的连续性变化进行直观展示。例如，可一条参数曲线添加至主图中，或选择四条参数曲线并将其中两条添加至主图、两条添加至副图，将参数曲线与堆叠图进行组合，从而生成第二显示视图。所生成的第二显示视图中各参数曲线、堆叠图中的线段颜色均不相同。所生成的第二显示视图使用组件化嵌入页面的设计思路，实现区域独立引入，组件间相互联动的属性，进而可以与所生成的第一显示视图进行联动，以实现生产和设备数图联动显示的目的。
75.例如，如图3所示，在本技术的一种具体实施例中，第二显示视图中包含四条参数曲线，两条参数曲线对应生成主图、另两条参数曲线对应生成附图，主图和副图均使用曲线图配置实现，由图例、提示框、x轴和y轴组成，其中，副图的x轴坐标值可继承主图x轴的坐标值，也即主图与附图在x轴维度上的横向维度相同。还可以是，副图的x轴坐标值及堆叠图的横坐标均继承主图x轴的坐标值。
76.在一实施例中，如图7所示，步骤s130之后还包括子步骤s1301、s1302、s1303及
s1304。
77.s1301、若监听到用户的第一操作信息为光标落入所述第二显示视图的所述参数曲线所在区域，生成提示框并添加至所述第二显示视图中进行显示。
78.终端设备可对用户的操作信息进行监听，若监听到用户的第一操作信息为光标落入第二显示视图的参数曲线所在区域，则可生成对应的提示框并添加至第二显示视图中进行显示。其中，该光标可以是鼠标的光标。具体的，可获取数据库中与所述第二显示视图中参数曲线对应的设备提示参数值，并生成对应的提示框添加至第二显示视图中，具体的，在初始状态下，可获取数据库中与第二显示视图所显示的对应参数的第一组数值作为设备提示参数值，并根据所得到的设备提示参数值生成提示框并添加至第二显示视图中。
79.例如，第二显示视图中主图包含“喷嘴温度”这一参数对应的参数曲线及“升降温比例阀”这一参数对应的参数曲线，副图中包含“主缸水位”这一参数对应的参数曲线及“料桶1水位”这一参数对应的参数曲线，堆叠图中包含“状态”、“告警”两种参数对应的线段。即可从数据库中分别获取喷嘴温度、升降温比例阀、主缸水位、料桶1水位、状态及告警这六个参数分别对应的第一组数值(第一个采集时间对于的数值)作为设备提示参数值，并根据设备提示参数值生成对应的提示框在第二显示视图中进行显示，例如，最终显示的提示框如图3中右上侧的方向框所示。
80.s1302、若监听到用户的第二操作信息为所述光标在所述参数曲线所在区域进行滑动，生成与所述第二操作信息对应的时间标记线。
81.在具体实施例中，提示框内所显示的信息还可随用户的操作进行调整。具体的，还可根据用户的第二操作信息生成相应时间标记线，以获取与用户第二操作信息对应的信息进行对应显示，可根据用户的第二操作信息，在进行滑动的参数曲线中生成与第二操作信息对应的时间标记线，时间标记线在横轴上的坐标即为参数曲线的时间信息。
82.在一实施例中，如图8所示，步骤s1302包括子步骤s1321、s1322、s1323及s1324。
83.s1321、获取所述第二操作信息中光标位置相对于所述第二显示视图左上角像素的坐标位置；
84.s1322、计算所述坐标位置与x轴起始位置之间的横向间距；
85.s1323、根据所述横向间距及x轴起始位置的时间值确定所述坐标位置在x轴上相对于x轴起始位置所对应的逻辑坐标值；
86.s1324、以所述逻辑坐标值作与x轴垂直的垂线，得到与所述第二操作信息对应的时间标记线。
87.例如，在具体实施方式中，可在第二显示视图的曲线图(曲线图包括主图、附图及堆叠图)中配置鼠标点击事件并进行监听，当用户点击曲线图中任意位置时，即可监听到触发点击鼠标事件，获取当前鼠标位置相对应曲线图左上角像素的坐标位置，通过计算当前鼠标位置对应的坐标位置与x轴起始位置之间的间距，x轴起始位置的时间值已知，即可确定当前鼠标位置在x轴上相对于x轴起始位置所对应的具体时间值，也即可实现将当前鼠标位置的像素坐标转换为x轴上的逻辑坐标值，以当前鼠标位置的具体时间值作与x轴垂直的垂线，即可得到时间标记线。可将与当前鼠标位置对应的具体时间值存放在公共状态信息池中，以便后续获取其它参数的数值时进行使用。
88.与此同时，还可实现通过键盘控制时间标记线的左右移动，可在全局定义一个监
听事件，当用户点击曲线图生成时间标记线后，才允许键盘的控制。若向左移动，则将当前的时间标记线索引减一(沿x轴向左移动至前一时间点)；若向右移动，则加一(沿x轴向右移动至后一时间点)；同时设置边界值，不允许超出x轴的数据范围。
89.s1303、从所述数据库中获取包含于第二显示视图且时间点与所述时间标记线对应参数曲线的数值为目标设备提示参数值。
90.可从数据库中获取包含于第二显示视图且时间点与时间标记线对应参数曲线的数值，作为与第二显示视图及时间标记线对应的目标设备提示参数值。
91.s1304、根据所述目标设备提示参数值对所述第二显示视图的提示框中包含的信息进行更新显示。
92.由于第二显示视图中已生成提示框，则可根据目标设备提示参数值对提示框中所包含的信息进行更新显示，也即是将目标设备提示参数值替换提示框中原有数值并进行显示。
93.在一实施例中，如图9所示，步骤s1302之后，还包括步骤s1311及s1312。
94.s1311、若监听到用户的第三操作信息为点击所述第二显示视图中的参数曲线，从所述数据库中获取采集时间与所述时间标记线对应的数值作为目标参数值；s1312、将所述目标参数值填充至所述第二显示视图中的参数显示面板中进行显示。
95.为在第二显示视图中更展示更完整的数值信息，可在第二显示视图中配置参数显示面板；根据用户的点击操作，从数据库中获取采集时间点与时间标记线所对应的具体时间值相同的数值作为目标参数值，目标参数值中包含多个参数对应的数值，可将所得到的目标参数值填充至参数显示面板中，从而实现在第二显示视图中对目标参数值进行显示。当用户的第三操作信息为点击操作时，即可获取用户点击位置的时间标记线对应的数值作为目标参数值。
96.例如，如3中右下侧即为所配置的参数显示面板，参数显示面板中可对应分为多个显示区域，图3中对应包含“模拟量”、“数字量输入”及“数字量输出”三个显示区域，每一显示区域可显示相应类型的参数所对应的数值。
97.s140、将所述第一显示视图与所述第二显示视图组合得到联动视图并进行显示。
98.可将第一显示视图与第二显示视图进行组合，得到联动视图并进行显示。例如，在本技术的一种具体实施例中，将第一显示视图置于左边、第二显示视图置于右边，组合得到联动视图。
99.s150、若监听到用户的操作信息为点击所述联动视图中的任一显示视图，获取所述操作信息对应的时间特征信息。
100.可对用户的操作信息进行监听，若监听到用户的操作信息为点击联动视图中的第一显示视图或第二显示视图，则可获取与操作信息对应的时间特征信息。
101.具体而言，当用户的操作信息为点击第二显示视图的曲线图时，即可获取与用户操作信息对应的时间标记线，并获取与时间标记线；通过步骤记录组件监听时间标记线的变化，获取与时间标记线对应的具体时间值作为时间特征信息。
102.第一显示视图中各生产步骤对应占据一定的步骤区域，当用户的操作信息为点击第一显示视图时，可获取用户在第一显示视图中所点击的区域所对应的生产步骤作为目标生产步骤，获取目标生产步骤的开始执行时间和结束执行时间作为时间特征信息，此时得
到的时间特征信息可存放于公共状态信息池中。
103.s160、根据所述时间特征信息对所述联动视图的另一显示视图中与所述时间特征信息对应的显示信息进行变换显示。
104.可根据时间特征信息在联动视图的另一显示视图中对与时间特征信息对应的显示信息进行变换显示，以实现联动视图中数图双向联动的效果。
105.若从第二显示视图中获取时间特征信息，则通过循环判断对数据库中各生产步骤是否包含时间标记线对应的具体时间值进行判断，以确定步骤时区包含该具体时间点的生产步骤为目标生产步骤，该目标生产步骤也即是与时间特征信息对应的显示信息，进行变换显示也即可在第一显示视图对目标生产步骤的信息标记为高亮显示，如图3中在步骤12外围添加方框，从而将步骤12标记为高亮显示。此外，由于第一显示视图中的滚动条是默认在最顶部的，标记为高亮显示后用户可能无法在可视区域内看到当前标记的高亮生产步骤，因此可对第一显示视图中所显示的生产步骤进行滚动，以将当前标记的高亮生产步骤滚动至可视区域内进行显示。具体实施过程中，可使用原生js方法获取每个生产步骤在第一显示视图中相应的占位高度，触发标签对象的内置api函数scrollintoview，传入对应的dom对象和占位高度，即可获取到滚动条的滚动距离并滚动到当前标记的高亮生产步骤的可视范围内。
106.若从第一显示视图中获取时间特征信息，则通过循环判断在x轴中确定与时间特征信息中开始执行时间最接近的一个开始时间值、并确定与结束执行时间最接近的一个结束时间值，根据开始时间值及结束时间值确定高亮显示区域，该高亮显示区域也即与时间特征信息对应的显示信息，此时对与时间特征信息对应的显示信息进行变换显示可以包括：在高亮显示区域内添加背景显示色。并对位于高亮显示区域内的参数曲线的颜色进行高亮显示。
107.例如，当用户点击图3中左侧区域内第一显示视图的生产步骤12时，该生产步骤12用于控制染色机的温度，如主缸温度40，终端设备确定用户点击的生产步骤12，由于生产步骤12在时间维度上是以一时间段(9:24:56-9:45:38)的形式，因此计算机确定该生产步骤12的时间段，并将该时间段与图3中右上侧区域内第二显示视图的曲线图的时间进行匹配，以确定图3右上侧区域内第二显示视图中与该时间段相匹配的目标时间段(9:24:56-9:45:38)作为时间特征信息，并对曲线图中落入该目标时间段(9:24:56-9:45:38)的显示区域进行标记显示，如高亮显示或灰度显示(如图3第二显示视图中的灰度部分)，此时用户可快速且准确地找到与生产步骤对应时间段的设备数据，即第二显示视图的曲线图中已灰度显示的设备数据，包括喷嘴温度、升降温比例阀、主缸水位以及料桶1水位；此外，当用户点击第二显示视图的曲线图中灰度显示的任一位置时，还可以提示框的形式显示这些设备数据的具体数值，以实现生产步骤12与生产数据的可视化联动。
108.当用户点击图3中右上侧区域内第二显示视图的曲线图的任一个位置时，终端设备确定用户点击的位置的坐标，根据坐标确定用户在曲线图点击的时间节点作为时间特征信息，将该时间节点与图3中第一显示视图中各生产步骤的时间段进行匹配，以确定图3中第一显示视图中含有该时间节点的步骤时区作为目标时间段，将当前显示区域跳转至该目标时间段对应的生产步骤或将该目标时间段对应的生产步骤进行标记显示(如图3中第一显示视图中所显示的方框)，以实现生产数据与生产步骤的反向联动。同时，当用户点击图3
中右上侧区域内第二显示视图的曲线图的任一个位置时，终端设备确定用户点击的位置的坐标，根据坐标确定曲线图的时间节点，从数据库中获取与该时间节点对应的数值作为目标参数值，并将目标参数值更新至图3中右下侧区域的参数显示面板中进行显示，以实现生产数据与详细数值信息的联动。
109.本技术方案通过数图双向联动，实现了将生产数据与其同一时间的设备数据进行精准关联，用户可以更直观更方便地实时查看生产和设备的数据状态，实时展示数据分析和汇总，降低了故障频率，进一步提升产品质量和设备运维效率，降低企业人工和设备成本，真正意义上实现生产与设备的数据互联互通。
110.此外，本技术方案基于用户点击的位置生成时间标记线，向后台请求该时间标记线的具体数值，一方面可以清楚了解模拟量输入输出、数字量输入输出等信息，另一方面则循环判断左区域的步骤记录，判断当前时间标记线的时间点位于某一生产步骤的步骤时区内时，找到对应的滚动条索引，并自动将显示区域滚动显示至所对应的生产步骤进行显示，同时为该生产步骤对应的运行参数值及参数曲线区域赋予高亮显示效果，用户可直观、清楚地查看当前的时间点所对应的具体生产步骤，让该生产步骤的生产信息和设备信息一览无余，提高了信息的连通性；并通过实时监听设备的设备信息(如损耗和温度)并进行实时显示，保证生产的安全性和合理性。
111.本技术中的技术方法可应用于对印染生产设备相关联的数据进行联动显示的场景中，还可以应用于对其它类似生产设备相关联的数据进行联动显示的场景中。
112.在本发明实施例所提供的基于工业互联网的数图联动显示方法中，获取至少一个生产步骤，并从数据库中获取与生成步骤相关联的运行参数值生成第一显示视图，获取每一种参数的连续变化信息生成第二显示视图，将第一显示视图与第二显示视图组合为联动视图并进行显示；若监听到用户的操作信息为点击联动视图中的任一显示视图，获取对应的时间特征信息并对另一显示视图中与时间特征信息对应的显示信息进行变换显示。通过上述方法，可生成由第一显示视图及第二显示视图组合形成的联动视图进行显示，并根据用户输入的操作信息对另一未操作的显示视图进行显示信息的变换显示，可对生产数据与设备数据进行关联并在同一显示视图中对显示信息进行联动变换显示，大幅提高了对设备相关联的数据进行显示的效率。
113.本发明实施例还提供一种基于工业互联网的数图联动显示装置，该基于工业互联网的数图联动显示装置可配置于终端设备2000中，该基于工业互联网的数图联动显示装置用于执行前述的基于工业互联网的数图联动显示方法的任一实施例。具体地，请参阅图10，图10为本发明实施例提供的基于工业互联网的数图联动显示装置的示意性框图。
114.如图10所示，基于工业互联网的数图联动显示装置100包括生产步骤获取单元110、第一显示视图生成单元120、第二显示视图生成单元130、视图显示单元140、时间特征信息获取单元150及变换显示单元160。
115.生产步骤获取单元110，用于获取至少一个生产步骤。
116.第一显示视图生成单元120，用于从数据库中获取与每一所述生产步骤相关联的运行参数值并生成第一显示视图，所述运行参数值包括传感器从工业生产设备中采集的至少一种参数对应的数值和/或所述工业生产设备的状态信息。
117.在一具体实施例中，所述第一显示视图生成单元120包括子单元：运行参数确定单
元，用于确定每一所述生产步骤中主功能步骤及并行功能步骤分别对应的运行参数；运行参数值获取单元，用于从所述数据库中获取每一所述生产步骤的运行参数对应的运行参数值；显示视图生成单元，用于根据所述生产步骤的排序及每一所述生产步骤的运行参数值，生成包含每一所述生产步骤对应运行参数值的第一显示视图。
118.在一具体实施例中，所述第一显示视图生成单元120还包括子单元：步骤时区确定单元，用于确定每一所述生产步骤对应的步骤时区；目标数值获取单元，用于根据所述数据库中每一数值的采集时间确定所述数值对应的步骤时区，并获取每一所述生产步骤的步骤时区对应的数值作为目标数值；获取单元，用于获取每一所述生产步骤的目标数值中与所述生产步骤的运行参数对应的数值作为相关联的运行参数值。
119.第二显示视图生成单元130，用于获取每一种参数的连续变化信息并生成第二显示视图；所述连续变化信息为参数的数值随时间进行连续性变化的信息。
120.在一具体实施例中，所述第二显示视图生成单元130包括子单元：连续变化信息获取单元，用于获取各参数的数值得到各参数的连续变化信息；参数曲线生成单元，用于根据所述各参数的连续变化信息生成各参数对应的参数曲线；堆叠图生成单元，用于根据所述数据库中预存的设备状态参数值生成对应的堆叠图；视图生成单元，用于选择至少一条所述参数曲线与所述堆叠图组合，以生成第二显示视图。
121.在一具体实施例中，所述第二显示视图生成单元130还包括子单元：提示框生成单元，用于若监听到用户的第一操作信息为光标落入所述第二显示视图的所述参数曲线所在区域，生成提示框并添加至所述第二显示视图中进行显示；时间标记线生成单元，用于若监听到用户的第二操作信息为所述光标在所述参数曲线所在区域进行滑动，生成与所述第二操作信息对应的时间标记线；目标设备提示参数值获取单元，用于从所述数据库中获取包含于第二显示视图且时间点与所述时间标记线对应参数曲线的数值为目标设备提示参数值；更新显示单元，用于根据所述目标设备提示参数值对所述第二显示视图的提示框中包含的信息进行更新显示。
122.在一具体实施例中，所述时间标记线生成单元还包括子单元：坐标位置获取单元，用于获取所述第二操作信息中光标位置相对于所述第二显示视图左上角像素的坐标位置；计算单元，用于计算所述坐标位置与x轴起始位置之间的横向间距；逻辑坐标值确定单元，用于根据所述横向间距及x轴起始位置的时间值确定所述坐标位置在x轴上相对于x轴起始位置所对应的逻辑坐标值；时间标记线获取单元，用于以所述逻辑坐标值作与x轴垂直的垂线，得到与所述第二操作信息对应的时间标记线。
123.在一具体实施例中，所述第二显示视图生成单元130还包括子单元：目标参数值获取单元，用于若监听到用户的第三操作信息为点击所述第二显示视图中的参数曲线，从所述数据库中获取采集时间与所述时间标记线对应的数值作为目标参数值；目标参数值显示单元，用于将所述目标参数值填充至所述第二显示视图中的参数显示面板中进行显示。
124.视图显示单元140，用于将所述第一显示视图与所述第二显示视图组合得到联动视图并进行显示。
125.时间特征信息获取单元150，用于若监听到用户的操作信息为点击所述联动视图中的任一显示视图，获取所述操作信息对应的时间特征信息。
126.变换显示单元160，用于根据所述时间特征信息对所述联动视图的另一显示视图
中与所述时间特征信息对应的显示信息进行变换显示。
127.在本发明实施例所提供的基于工业互联网的数图联动显示装置应用上述基于工业互联网的数图联动显示方法，获取至少一个生产步骤，并从数据库中获取与生成步骤相关联的运行参数值生成第一显示视图，获取每一种参数的连续变化信息生成第二显示视图，将第一显示视图与第二显示视图组合为联动视图并进行显示；若监听到用户的操作信息为点击联动视图中的任一显示视图，获取对应的时间特征信息并对另一显示视图中与时间特征信息对应的显示信息进行变换显示。通过上述方法，可生成由第一显示视图及第二显示视图组合形成的联动视图进行显示，并根据用户输入的操作信息对另一未操作的显示视图进行显示信息的变换显示，可对生产数据与设备数据进行关联并在同一显示视图中对显示信息进行联动变换显示，大幅提高了对设备相关联的数据进行显示的效率。
128.上述基于工业互联网的数图联动显示装置可以实现为计算机程序的形式，该计算机程序可以在如图11所示的计算机设备上运行。
129.请参阅图11，图11是本发明实施例提供的计算机设备的示意性框图。该计算机设备可以是用于执行基于工业互联网的数图联动显示方法以对与工业生产设备向关联的各项信息进行显示的终端设备2000。
130.参阅图11，该计算机设备500包括通过系统总线501连接的处理器502、存储器和网络接口505，其中，存储器可以包括存储介质503和内存储器504。
131.该存储介质503可存储操作系统5031和计算机程序5032。该计算机程序5032被执行时，可使得处理器502执行基于工业互联网的数图联动显示方法，其中，存储介质503可以为易失性的存储介质或非易失性的存储介质。
132.该处理器502用于提供计算和控制能力，支撑整个计算机设备500的运行。
133.该内存储器504为存储介质503中的计算机程序5032的运行提供环境，该计算机程序5032被处理器502执行时，可使得处理器502执行基于工业互联网的数图联动显示方法。
134.该网络接口505用于进行网络通信，如提供数据信息的传输等。本领域技术人员可以理解，图11中示出的结构，仅仅是与本发明方案相关的部分结构的框图，并不构成对本发明方案所应用于其上的计算机设备500的限定，具体的计算机设备500可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。
135.其中，所述处理器502用于运行存储在存储器中的计算机程序5032，以实现上述的基于工业互联网的数图联动显示方法中对应的功能。
136.本领域技术人员可以理解，图11中示出的计算机设备的实施例并不构成对计算机设备具体构成的限定，在其他实施例中，计算机设备可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。例如，在一些实施例中，计算机设备可以仅包括存储器及处理器，在这样的实施例中，存储器及处理器的结构及功能与图11所示实施例一致，在此不再赘述。
137.应当理解，在本发明实施例中，处理器502可以是中央处理单元(central processing unit，cpu)，该处理器502还可以是其他通用处理器、数字信号处理器(digital signal processor，dsp)、专用集成电路(application specific integrated circuit，asic)、现成可编程门阵列(field-programmable gate array，fpga)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。其中，通用处理器可以是微处理器或
者该处理器也可以是任何常规的处理器等。
138.在本发明的另一实施例中提供计算机可读存储介质。该计算机可读存储介质可以为易失性或非易失性的计算机可读存储介质。该计算机可读存储介质存储有计算机程序，其中计算机程序被处理器执行时实现上述的基于工业互联网的数图联动显示方法中所包含的步骤。
139.所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，上述描述的设备、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。
140.在本发明所提供的几个实施例中，应该理解到，所揭露的设备、装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为逻辑功能划分，实际实现时可以有另外的划分方式，也可以将具有相同功能的单元集合成一个单元，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另外，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口、装置或单元的间接耦合或通信连接，也可以是电的，机械的或其它的形式连接。
141.所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本发明实施例方案的目的。
142.另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以是两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。
143.所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分，或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个计算机可读存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的计算机可读存储介质包括：u盘、移动硬盘、只读存储器(rom，read-only memory)、磁碟或者光盘等各种可以存储程序代码的介质。
144.以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。