CN114780005A - 图形绘制方法、装置、电子设备以及存储介质 - Google Patents

图形绘制方法、装置、电子设备以及存储介质 Download PDF

Info

Publication number
CN114780005A
CN114780005A CN202210677670.1A CN202210677670A CN114780005A CN 114780005 A CN114780005 A CN 114780005A CN 202210677670 A CN202210677670 A CN 202210677670A CN 114780005 A CN114780005 A CN 114780005A
Authority
CN
China
Prior art keywords
component
data
binding
components
determining
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202210677670.1A
Other languages
English (en)
Inventor
雍正
尚明璇
姚宁坡
毕云天
高宝强
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Sprixin Technology Co ltd
Original Assignee
Sprixin Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Sprixin Technology Co ltd filed Critical Sprixin Technology Co ltd
Priority to CN202210677670.1A priority Critical patent/CN114780005A/zh
Publication of CN114780005A publication Critical patent/CN114780005A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/00—2D [Two Dimensional] image generation
    • G06T11/20—Drawing from basic elements, e.g. lines or circles
    • G06T11/206—Drawing of charts or graphs
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00—Animation
    • G06T13/80—2D [Two Dimensional] animation, e.g. using sprites

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Human Computer Interaction (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本发明涉及计算机技术领域，提供一种图形绘制方法、装置、电子设备以及存储介质，所述图形绘制方法包括：根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；接收所述后端服务器发送的各所述组件的绑定数据；根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。本发明通过使用Canvas+ECharts+WebSocket组合完成在线图形绘制，提高了图形绘制的开发效率。

Description

图形绘制方法、装置、电子设备以及存储介质
技术领域
本发明涉及计算机技术领域，尤其涉及一种图形绘制方法、装置、电子设备以及存储介质。
背景技术
随着电力系统的发展，越来越多的项目中需要绘制与现场实时相关的业务电路关系图，目前，电路关系图的绘制方式主要是两种，第一种方式，通过在线绘制工具简单绘制出电路关系表，并下载图片嵌入项目中引用；第二种方式，由产品经理或者UI设计人员设计绘制电路关系图，然后由前端人员通过H5+CSS3+JS技术，完成前端界面开发，再交由java人员完成后端开发，绑定数据通过接口完成每次的数据实时交互任务。但是第一种方式不能实时展示各组件的数据，第二种方式虽然可以实时展示各组件的数据，但开发时间成本高，需要协调UI，前端，java人员，动态效果有一定局限性，不方便实现，且不利于后期数据维护和重复利用。由此可知，现有的图形绘制存在开发效率低的问题。
发明内容
本发明提供一种图形绘制方法、装置、电子设备以及存储介质，用以解决图形绘制开发效率低的问题，通过使用Canvas+ECharts+WebSocket组合完成在线图形绘制，提高了图形绘制的开发效率。
本发明提供一种图形绘制方法，包括：
根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收所述后端服务器发送的各所述组件的绑定数据；
根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
在一个实施例中，所述将所述图纸中各所述组件与设定数据绑定，包括：
确定各所述组件对接的后端接口；
将各所述组件与所述对接的后端接口的设定数据绑定。
在一个实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之前，还包括：
根据拖拽指令将各所述组件从组件库中拖拽至画布，并确定各所述组件的连接关系。
在一个实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
确定待绘制的图纸，以及所述待绘制图纸的图纸类型；
根据所述图纸类型在图纸列表中确定模板图纸，对所述模板图纸进行修改得到所述待绘制的图纸。
在一个实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
确定各所述组件的设定事件以及待设置的动画特效；
根据所述待设置的动画特效设置各所述组件的动画特效，并将各所述组件与所述设定事件绑定。
在一个实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之前，还包括：
根据业务需求绘制组件，并将绘制的组件存储至组件库。
在一个实施例中，所述方法，还包括：
获取所述图纸的地址信息；
将所述图纸的地址信息发送至第三方终端，其中，所述第三方终端根据接收到的所述图纸的地址信息显示所述图纸。
本发明还提供一种图形绘制装置，包括：
确定模块，用于根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
发送模块，用于根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收模块，用于接收所述后端服务器发送的各所述组件的绑定数据；
更新模块，用于根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
本发明还提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现如上述任一种所述图形绘制方法。
本发明还提供一种非暂态计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时实现如上述任一种所述图形绘制方法。
本发明提供的图形绘制方法、装置、电子设备以及存储介质，通过根据各组件以及各组件的连接关系确定图纸，并将图纸中各组件与设定数据绑定；根据图纸的图纸标识向后端服务器发送各组件的绑定数据的数据请求信息；接收后端服务器发送的各组件的绑定数据；根据各组件的绑定数据以及各组件标识更新各组件的数据。本发明实施例通过使用Canvas+ECharts+WebSocket组合完成在线图形绘制，提高了图形绘制的开发效率。
附图说明
为了更清楚地说明本发明或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1是本发明提供的图形绘制方法的流程示意图之一；
图2是本发明提供的图形绘制方法的流程示意图之二；
图3是本发明提供的图形绘制方法的流程示意图之三；
图4是本发明提供的一次接线图的绘制流程示意图；
图5是本发明提供的可视化大屏实时数据展示效果的示意图；
图6是本发明提供的获取各组件的绑定数据的流程示意图；
图7是本发明提供的图形绘制装置的结构示意图；
图8是本发明提供的电子设备的结构示意图。
具体实施方式
为使本发明的目的、技术方案和优点更加清楚，下面将结合本发明中的附图，对本发明中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
下面结合图1-图8描述本发明的图形绘制方法、装置、电子设备以及存储介质。
具体地，本发明提供了一种图形绘制方法，参照图1，图1是本发明提供的图形绘制方法的流程示意图之一。
本发明实施例提供的图形绘制方法，包括：
步骤S10，根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
需要说明的是，本发明提供的在线图形绘制器是一个集动态交互、丰富展示、数据管理等一体的全功能可视化引擎，为电力能源、水利工程、等智能可视化场景而生，同时支持拓扑图、流程图、折线图、饼图、仪表盘、web组态、SCADA等场景。具体地，在线图形绘制器通过Canvas+ECharts+WebSocket组合完成在线图形绘制，以数据为核心、数据驱动显示，多状态呈现，进度、动效多角度动态展示，支持WebSocket动态数据监听，提供了丰富的交互事件，例如：移动、缩放、旋转等事件，网络消息事件，动画效果，文本输入事件，并且提供可自由可扩展的组件库，可定制化开发组件库，可直接在线绘画自定义图形，支持 SVG PATH图形。此外，本发明可应用于丰富的应用场景，例如：架构图、拓扑图、流程图，电力能源、水利等，大屏展示、IT 运维等，功能丰富，且具有高性能，突破了传统的手动绘制图形的局限性，可直接关联实时数据，调用后台接口，给用户带实时的最佳体验效果，极大的丰富了外部应用的使用方式，提高了开发的效率，增强了产品的易用性，使设计，前端，后台开发整体解耦，大大提高了产品的易用性和灵活性。
可以理解的是，Canvas是一个可以使用Javascript绘制图像的HTML5元素（行内元素），<canvas> 元素本身并没有绘制能力（它仅是图形的容器），需要使用脚本来完成实际的绘图任务。JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。
ECharts是一个使用JavaScript实现的开源可视化库，提供了常规的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图，用于地理数据可视化的地图、热力图、线图，用于关系数据可视化的关系图、treemap、旭日图，多维数据可视化的平行坐标，还有用于BI的漏斗图，仪表盘，并且支持图与图之间的混搭。
WebSocket是一种在单个TCP连接上进行全双工通信的协议，WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。
在本发明实施例中，在线图形绘制器根据拖拽指令将各组件从组件库中拖拽至画布，并确定各组件的连接关系，然后按照该连接关系将各组件连接起来得到所需的图纸，并保存该图纸。通过拖拽指令将组件拖拽至画布中，实现手动拖拽即可完成图形绘制，从而节约图形绘制时间，继而提高图形绘制的效率。
通过组件与连线组合成图纸后，将图纸中各组件与设定数据绑定，具体地，将图纸中各组件与设定数据绑定的步骤包括：
步骤S13，确定各所述组件对接的后端接口；
步骤S14，将各所述组件与所述对接的后端接口的设定数据绑定。
需要说明的是，设定数据包括电力系统中的遥测、遥信、遥控、遥调等数据、水利工程数据等，其中，遥测：远程测量，是指采集并传送运行参数，包括各种电气量(线路上的电压、电流、功率等量值) 和负荷潮流等。遥信：远程信号，是指采集并传送各种保护和开关量信息。遥控：远程控制，是指接受并执行遥控命令，主要是分合闸，对远程的一些开关控制设备进行远程控制。遥调：远程调节，接受并执行遥调命令，对远程的控制量设备进行远程调试，如调节发电机输出功率。
在发明实施例中，在为各组件绑定实时数据之前，需要确定各组件对接的后端接口，然后将各组件与对接的后端接口的设定数据绑定，例如，参考图6，后端服务器与实时库连接，该实时库中存储有实时测点数据，即设定数据，可以理解的是，每种测点数据对接的后端接口不同，即采集测点数据的端口不同，因此，组件与后端接口的数据绑定后，即可通过调用该后端接口实时获取该后端接口采集的数据。
通过确定各组件对接的后端接口，然后将各组件与对接的后端接口的设定数据绑定，使得各组件通过调用对接的后端接口即可实时获取后端接口采集的数据，从而提高数据交互的实时性。
在一个实施例中，本发明提供的在线图形绘制器设有自定义组件功能，在绘制图纸之前，需要预先自定义各种类型的组件，具体地，
根据业务需求绘制组件，并将绘制的组件存储至组件库，可以理解的是，该业务需求包括电力业务需求、水利工程业务需求等。例如，基于电力业务需求确定不同的图纸类型，以及不同图纸类型对应的组件，然后绘制组件，并将绘制好的组件存储至组件库。通过预先绘制组件存储至组件库中，使得在线绘制图形时，可以直接手动从组件库中拖拽组件，避免从新自定义组件，从而提高图形的绘制效率。
在一个实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
步骤S15，确定各所述组件的设定事件以及待设置的动画特效；
步骤S16，根据所述待设置的动画特效设置各所述组件的动画特效，并将各所述组件与所述设定事件绑定。
需要说明的是，本发明实施例中的设定事件可包括单击、双击、移动、缩放、旋转等事件；动画特效包括闪烁、转动、缩放等。
具体地，确定各组件的设定事件以及待设置的动画特效，然后根据待设置的动画特效设置各组件的动画特效，并将各组件与设定事件绑定，例如，将组件1绑定“单击”事件，并设置“转动”特效。可以理解的是，并不是所有的组件都需要绑定事件或者设置动画特征，具体可根据需求确定。通过为各组件设置动画效果，可以提升视觉体验，同时，通过为各组件绑定事件，使得可以丰富事件交互。
可以理解的是，在确定图纸后，还需要设置图纸中各组件的属性，其中，该属性包括位置和大小、样式设置以及文字设置等，例如，位置和大小需要设置组件的X轴、Y轴以及宽高等信息；样式设置包括设置组件的圆角、旋转、背景样式、背景颜色、边框样式、边框渐变、边框颜色等；文字设置包括设置文字内容、字体颜色、文字大小等。
步骤S20，根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
在绘制图纸后，确定图纸的图纸标识，如图纸ID，图纸编号等，然后向后端服务器发送携带图纸ID的数据请求信息，该数据请求信息用于请求获取各组件的绑定数据，如遥控数据、遥测数据、遥信数据等。例如，参考图6，通过WebSocket通信协议与后端服务器建立通信连接，然后向后端服务器发送携带图纸ID的数据请求信息，如请求链接。
步骤S30，接收所述后端服务器发送的各所述组件的绑定数据；
在本发明实施例中，后端服务器在接收到数据请求信息后，向在线图形绘制器发送的各组件的绑定数据，具体地，参考图6，后端服务器根据接收到的数据请求信息获取图纸标识，根据图纸标识查询各组件关联的容器类型，确定容器类型与量测表的绑定ID，通过该绑定ID查询redis实时库中组件的相关数据，然后将各组件的绑定数据组合成json数据列表的形式，通过Websocket通信协议将绑定数据发送至前端预览页面。
步骤S40，根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
在线图形绘制器在接收到后端服务器发送的json数据列表后，根据图纸标识以及各组件标识（如组件ID，组件编号）的树状结构关系对json数据列表进行解析得到各组件的绑定数据，然后根据各组件标识以及绑定数据更新各组件的数据，例如，根据各组件标识将各组件的绑定数据渲染至页面。
本发明实施例提供了一种图形绘制方法，通过根据各组件以及各组件的连接关系确定图纸，并将图纸中各组件与设定数据绑定；根据图纸的图纸标识向后端服务器发送各组件的绑定数据的数据请求信息；接收后端服务器发送的各组件的绑定数据；根据各组件的绑定数据以及各组件标识更新各组件的数据。本发明实施例通过使用Canvas+ECharts+WebSocket组合完成在线图形绘制，提高了图形绘制的开发效率。
参考图2，图2是本发明提供的图形绘制方法的流程示意图之二，在本发明实施例中，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
步骤S11，确定待绘制的图纸，以及所述待绘制图纸的图纸类型；
步骤S12，根据所述图纸类型在图纸列表中确定模板图纸，对所述模板图纸进行修改得到所述待绘制的图纸。
在本发明实施例中，为提高图纸的绘制效率，可基于模板图纸的基础上进行修改得到新的图纸，具体地，确定待绘制的图纸，以及待绘制图纸的图纸类型，然后根据图纸类型在图纸列表中确定模板图纸，对模板图纸进行修改得到待绘制的图纸。可以理解的是，模板图纸是指之前保存的图纸，即每次完成图纸绘制后，可将图纸保存至图纸列表，其中，图纸列表中存储有各种类型的图纸，例如，一次接线图演示、人力资源看板、管理层看板、流程图演示等。因此，如果图纸列表中存在与待绘制图纸相同的图纸类型的模板图纸，则直接复制模板图纸，然后将模板图纸粘贴在新的画布中，再基于该模板图纸进行修改，如删除组件、增加组件、修改组件间的连接关系等，从而得到所需的待绘制图纸。
本发明实施例通过将绘制好的图纸复制作为模板再次修改引用，从而提高开发效率，便于维护。
参考图3，图3是本发明提供的图形绘制方法的流程示意图之三，
所述方法，还包括：
步骤S50，获取所述图纸的地址信息；
步骤S60，将所述图纸的地址信息发送至第三方终端，其中，所述第三方终端根据接收到的所述图纸的地址信息显示所述图纸。
在本发明实施例中，通过获取图纸的地址信息，然后将图纸的地址信息发送至第三方终端，其中，第三方终端根据接收到的图纸的地址信息显示图纸。例如，在集成系统中，当预览图纸时，可以直接从预览界面中的地址栏获取图纸的地址信息，然后将该地址信息复制添加至第三方终端中引用使用，即第三方终端可以基于该地址信息直接显示图纸。
本发明实施例通过将图纸的地址信息复制添加至第三方终端中引用使用，使得提高了图纸的复用率。
参考图4，图4是本发明提供的一次接线图的绘制流程示意图。
在本发明实施例中，基于在线图形绘制器完成一次接线图绘制的步骤如下：
1、新建图纸，命名并保存；
2、从组件库中选取组件引用到画布中，完成组件排列，完成连接关系；
3、为组件或者连接线设置动画效果；
4、为组件绑定实时数据，例如可绑定遥测或者遥信状态值；
5、保存图纸并进行预览查看。
本发明实施例通过手动拖拽即可完成图形绘制，从而节约图形绘制时间，继而提高图形绘制的效率。
参考图5，图5是本发明提供的可视化大屏实时数据展示效果的示意图。
在本发明实施例中，基于在线图形绘制器完成可视化大屏实时数据展示效果的步骤如下：
1、新建图纸，命名并保存；
2、从组件库中选取图表组件引用到画布中，完成界面排版布局；
3、为echart组件绑定实时数据，调用后台接口，获取实时数据；
4、保存图纸并进行预览查看。
本发明实施例通过手动拖拽图表组件即可完成绘制可视化大屏数据的展示，突破了传统的手动绘制图形的局限性，同时可直接关联实时数据，调用后台接口，给用户带实时的最佳体验效果，极大的丰富了外部应用的使用方式，提高了开发的效率。
图7是本发明提供的图形绘制装置的结构示意图，参照图7，本发明的实施例提供了一种图形绘制装置，包括确定模块701，发送模块702、接收模块703和更新模块704。
所述确定模块701，用于根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
所述发送模块702，用于根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
所述接收模块703，用于接收所述后端服务器发送的各所述组件的绑定数据；
所述更新模块704，用于根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
本发明实施例提供了一种图形绘制装置，通过根据各组件以及各组件的连接关系确定图纸，并将图纸中各组件与设定数据绑定；根据图纸的图纸标识向后端服务器发送各组件的绑定数据的数据请求信息；接收后端服务器发送的各组件的绑定数据；根据各组件的绑定数据以及各组件标识更新各组件的数据。本发明实施例通过使用Canvas+ECharts+WebSocket组合完成在线图形绘制，提高了图形绘制的开发效率。
在一个实施例中，所述确定模块701具体用于：
确定各所述组件对接的后端接口；
将各所述组件与所述对接的后端接口的设定数据绑定。
在一个实施例中，所述确定模块701具体用于：
根据拖拽指令将各所述组件从组件库中拖拽至画布，并确定各所述组件的连接关系。
在一个实施例中，所述确定模块701具体用于：
确定待绘制的图纸，以及所述待绘制图纸的图纸类型；
根据所述图纸类型在图纸列表中确定模板图纸，对所述模板图纸进行修改得到所述待绘制的图纸。
在一个实施例中，所述确定模块701具体用于：
确定各所述组件的设定事件以及待设置的动画特效；
根据所述待设置的动画特效设置各所述组件的动画特效，并将各所述组件与所述设定事件绑定。
在一个实施例中，所述确定模块701具体用于：
根据业务需求绘制组件，并将绘制的组件存储至组件库。
在一个实施例中，所述方法，还包括：
获取模块，用于获取所述图纸的地址信息；
地址信息发送模块，用于将所述图纸的地址信息发送至第三方终端，其中，所述第三方终端根据接收到的所述图纸的地址信息显示所述图纸。
图8示例了一种电子设备的实体结构示意图，如图8所示，该电子设备可以包括：处理器(processor)810、通信接口(Communications Interface)820、存储器(memory)830和通信总线840，其中，处理器810，通信接口820，存储器830通过通信总线840完成相互间的通信。处理器810可以调用存储器830中的逻辑指令，以执行图形绘制方法，该方法包括：
根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收所述后端服务器发送的各所述组件的绑定数据；
根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
此外，上述的存储器830中的逻辑指令可以通过软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备（可以是个人计算机，服务器，或者网络设备等）执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器（ROM，Read-Only Memory）、随机存取存储器（RAM，Random Access Memory）、磁碟或者光盘等各种可以存储程序代码的介质。
另一方面，本发明还提供一种非暂态计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时实现以执行上述各方法提供的图形绘制方法，该方法包括：
根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收所述后端服务器发送的各所述组件的绑定数据；
根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
以上所描述的装置实施例仅仅是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性的劳动的情况下，即可以理解并实施。
通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到各实施方式可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件。基于这样的理解，上述技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如ROM/RAM、磁碟、光盘等，包括若干指令用以使得一台计算机设备（可以是个人计算机，服务器，或者网络设备等）执行各个实施例或者实施例的某些部分所述的方法。
最后应说明的是：以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。

Claims (10)

1.一种图形绘制方法，其特征在于，包括：
根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收所述后端服务器发送的各所述组件的绑定数据；
根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
2.根据权利要求1所述的图形绘制方法，其特征在于，所述将所述图纸中各所述组件与设定数据绑定，包括：
确定各所述组件对接的后端接口；
将各所述组件与所述对接的后端接口的设定数据绑定。
3.根据权利要求1所述的图形绘制方法，其特征在于，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之前，还包括：
根据拖拽指令将各所述组件从组件库中拖拽至画布，并确定各所述组件的连接关系。
4.根据权利要求1所述的图形绘制方法，其特征在于，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
确定待绘制的图纸，以及所述待绘制图纸的图纸类型；
根据所述图纸类型在图纸列表中确定模板图纸，对所述模板图纸进行修改得到所述待绘制的图纸。
5.根据权利要求1所述的图形绘制方法，其特征在于，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之后，还包括：
确定各所述组件的设定事件以及待设置的动画特效；
根据所述待设置的动画特效设置各所述组件的动画特效，并将各所述组件与所述设定事件绑定。
6.根据权利要求1所述的图形绘制方法，其特征在于，所述根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定之前，还包括：
根据业务需求绘制组件，并将绘制的组件存储至组件库。
7.根据权利要求1所述的图形绘制方法，其特征在于，所述方法，还包括：
获取所述图纸的地址信息；
将所述图纸的地址信息发送至第三方终端，其中，所述第三方终端根据接收到的所述图纸的地址信息显示所述图纸。
8.一种图形绘制装置，其特征在于，包括：
确定模块，用于根据各组件以及各所述组件的连接关系确定图纸，并将所述图纸中各所述组件与设定数据绑定；
发送模块，用于根据所述图纸的图纸标识向后端服务器发送各所述组件的绑定数据的数据请求信息；
接收模块，用于接收所述后端服务器发送的各所述组件的绑定数据；
更新模块，用于根据各所述组件的绑定数据以及各组件标识更新各所述组件的数据。
9.一种电子设备，包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现如权利要求1至7任一项所述图形绘制方法。
10.一种非暂态计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1至7任一项所述图形绘制方法。
CN202210677670.1A 2022-06-16 2022-06-16 图形绘制方法、装置、电子设备以及存储介质 Pending CN114780005A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210677670.1A CN114780005A (zh) 2022-06-16 2022-06-16 图形绘制方法、装置、电子设备以及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210677670.1A CN114780005A (zh) 2022-06-16 2022-06-16 图形绘制方法、装置、电子设备以及存储介质

Publications (1)

Publication Number Publication Date
CN114780005A true CN114780005A (zh) 2022-07-22

Family

ID=82421278

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210677670.1A Pending CN114780005A (zh) 2022-06-16 2022-06-16 图形绘制方法、装置、电子设备以及存储介质

Country Status (1)

Country Link
CN (1) CN114780005A (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN116137045A (zh) * 2023-04-04 2023-05-19 深圳前海硬之城信息技术有限公司 焊盘图纸的调整方法、装置、设备及存储介质
CN116610683A (zh) * 2023-07-21 2023-08-18 国能日新科技股份有限公司 数据绑定方法及装置

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2003058585A (ja) * 2001-08-21 2003-02-28 Canon Inc 図面出力システム、図面出力方法
CN107239266A (zh) * 2016-03-29 2017-10-10 罗森伯格技术（昆山）有限公司 一种在web前端无插件展示cad图纸的方法及装置
CN112799736A (zh) * 2021-01-19 2021-05-14 江苏智源自动化技术有限公司 电气一次图模式识别动态绑定加载方法
CN114443577A (zh) * 2021-12-29 2022-05-06 万翼科技有限公司 图纸处理方法、装置、设备及存储介质

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2003058585A (ja) * 2001-08-21 2003-02-28 Canon Inc 図面出力システム、図面出力方法
CN107239266A (zh) * 2016-03-29 2017-10-10 罗森伯格技术（昆山）有限公司 一种在web前端无插件展示cad图纸的方法及装置
CN112799736A (zh) * 2021-01-19 2021-05-14 江苏智源自动化技术有限公司 电气一次图模式识别动态绑定加载方法
CN114443577A (zh) * 2021-12-29 2022-05-06 万翼科技有限公司 图纸处理方法、装置、设备及存储介质

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN116137045A (zh) * 2023-04-04 2023-05-19 深圳前海硬之城信息技术有限公司 焊盘图纸的调整方法、装置、设备及存储介质
CN116137045B (zh) * 2023-04-04 2023-09-12 深圳前海硬之城信息技术有限公司 焊盘图纸的调整方法、装置、设备及存储介质
CN116610683A (zh) * 2023-07-21 2023-08-18 国能日新科技股份有限公司 数据绑定方法及装置
CN116610683B (zh) * 2023-07-21 2023-11-03 国能日新科技股份有限公司 数据绑定方法及装置

Similar Documents

Publication Publication Date Title
CN114780005A (zh) 图形绘制方法、装置、电子设备以及存储介质
CN104484189B (zh) 一种应用界面的构建及设计方法
CN109117138B (zh) 一种组态方法及装置、计算机可读存储介质
CN107832108A (zh) 3D canvas网页元素的渲染方法、装置及电子设备
WO2015188626A1 (zh) 在移动终端上实时查看电力系统单线图的方法
CN103312814B (zh) 云管理平台和虚拟机终端用户间vnc隐通道的建立方法
CN103077239A (zh) 基于云渲染的iFrame 嵌入式Web3D系统
US20210247967A1 (en) Design interface object manipulation based on aggregated property values
CN109671147B (zh) 基于三维模型的纹理贴图生成方法及装置
CN108182102A (zh) 图表管理方法、装置及可读存储介质
CN114816189A (zh) 一种基于云端的工业智能装备远程组态方法
CN111639239A (zh) 一种设备运行状态监控方法及系统
CN110442334B (zh) 一种多人协同图形组态方法、电子设备和服务器
CN111538498A (zh) 一种应用创建方法、装置、电子设备及存储介质
CN112817651A (zh) 一种基于Canvas画布的图形生成方法及系统
CN115333787A (zh) 5g工控网络系统自动化安全测试方法、系统及存储介质
CN113468261B (zh) 基于图形编辑引擎构建物联网实体关系的方法和系统
CN109144655B (zh) 图像动态展示的方法、装置、系统及介质
JP2002108600A (ja) 制御システムの端末装置、記録媒体、および、制御システム
CN107908393B (zh) 一种scada实时模型画面的设计方法
CN107402771A (zh) 远程用户接口合作应用
CN116450021A (zh) 大屏搭建方法、系统、电子设备和存储介质
CN112905168B (zh) 基于区块的可视化前端页面生成方法及装置
CN105490914A (zh) 一种led自动化服务器及交互方法
CN115314535A (zh) 物联网设备的控制方法、装置、存储介质及计算机设备

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20220722