CN115543290A - 可视化编程方法及系统 - Google Patents

Abstract

本发明提供了一种可视化编程方法及系统，所述方法包括步骤：将多个预设编程能力元素分别映射为图形元素节点；将所述图形元素节点展示于一编辑页面；基于接收到的拖拽操作触发信号，将所述编辑页面中的所述图形元素节点进行连接，形成目标配置页面；以及执行所述目标配置页面，以生成对应的目标展示页面；本发明提供了一种新的具有可视化逻辑处理功能的低代码工具，在提供视图展示编程功能的同时，具备逻辑处理能力。

Description

可视化编程方法及系统

技术领域

本发明涉及计算机软件技术领域，具体地说，涉及一种可视化编程方法及系统。

背景技术

在云计算和移动互联网的助推下，企业数字化转型加快，软件开发的需求激增。数字化不断改变着现实生活，给生活带来便利的同时，也加快了数据的爆发和软件更替的周期，移动互联网和物联网的发展让软件平台变得更加多元化和碎片化，软件开发商为了支持多元化的系统和平台，不得不投入更多的人力和资源进行多平台开发。

目前，“低代码(Low-Code)”的概念越来越受到软件开发领域的欢迎。关于“低代码”的定义是：利用很少或几乎不需要写代码就可以快速地开发应用，并可以进行快速配置和部署的一种技术和工具。

目前国外出现了许多低代码工具，如面向设计师的原型设计工具“Figma”，面向企业办公的表单和流程设计工具“Creator”。国内也涌现了许多优秀的低代码工具，如面向数据工程师的数据分析工具“DataV”。这些工具的主要特点是依托工具提供的基础能力和引擎基座，根据不同的用户群体的能力差异，提供特定场景应用的低代码开发能力。

但是，现有的低代码工具普遍缺乏完整的可视化逻辑处理能力，需要编写代码片段来完成逻辑处理。或者根本没有逻辑处理能力，仅提供视图展示的功能；这不利于用户使用低代码工具快速地开发应用。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本申请的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

针对现有技术中的问题，本发明的目的在于提供一种可视化编程方法及系统，提供了一种新的具有可视化逻辑处理功能的低代码工具，在提供视图展示编程功能的同时，具备逻辑处理能力。

为实现上述目的，本发明提供了一种可视化编程方法，所述方法包括以下步骤：

S110，将多个预设编程能力元素分别映射为图形元素节点；

S120，将所述图形元素节点展示于一编辑页面；

S130，基于接收到的拖拽操作触发信号，将所述编辑页面中的所述图形元素节点进行连接，形成目标配置页面；以及

S140，执行所述目标配置页面，以生成对应的目标展示页面。

可选地，所述预设编程能力元素包括运算符元素，所述图形元素节点包括运算符节点；步骤S110包括：

将各个运算符元素分别映射为运算符节点。

可选地，所述图形元素节点还包括函数元素节点、参数元素节点、参数端口元素节点以及执行调度端口元素节点；步骤S120包括：

将所述函数元素节点和所述执行调度端口元素节点组合，形成第一匹配对；

将所述参数元素节点和所述参数端口元素节点组合，形成第二匹配对；

基于所述第一匹配对和所述第二匹配对，生成第一输入可视化模块，并将所述第一输入可视化模块展示于一编辑页面。

可选地，步骤S120包括：

根据所述运算符节点和所述参数端口元素节点，生成多个运算可视化模块；所述多个运算可视化模块具有级联关系，且包括第一运算可视化模块和第二运算可视化模块；

步骤S140包括：

将所述第一输入可视化模块作为第一运算可视化模块的输入参数；

将所述第一运算可视化模块的输出结果作为所述第二运算可视化模块的输入参数。

可选地，步骤S140包括：

将所述目标配置页面中的各可视化模块转换为预设编程语言代码；

基于与所述预设编程语言代码对应的编译器，对所述预设编程语言代码进行编译。

可选地，所述基于与所述预设编程语言代码对应的编译器，对所述预设编程语言代码进行编译，包括：

基于与所述预设编程语言代码对应的编译器，将所述预设编程语言代码转换为机器码。

可选地，步骤S140还包括：

获取编译过程中产生的报错信息；

根据所述目标配置页面中的各可视化模块，生成抽象语法树；

将所述报错信息在所述预设编程语言代码中进行第一次定位，获得对应的第一代码模块；

根据所述抽象语法树和所述第一代码模块，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

可选地，所述抽象语法树中包含有所述目标配置页面中的各可视化模块对应的模块ID信息；所述根据所述抽象语法树和所述第一代码模块，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示，包括：

根据所述第一代码模块和所述抽象语法树中的模块ID信息，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

可选地，所述根据所述目标配置页面中的各可视化模块，生成抽象语法树，包括：

将所述目标配置页面中的各可视化模块转换为Token流，生成一存储所述Token流的数组；

将所述数组转换为结构化的抽象语法树。

本发明还提供了一种可视化编程系统，用于实现上述可视化编程方法，所述系统包括：

元素映射模块，将多个预设编程能力元素分别映射为图形元素节点；

图形元素节点展示模块，将所述图形元素节点展示于一编辑页面；

目标配置页面生成模块，基于接收到的拖拽操作触发信号，将所述编辑页面中的所述图形元素节点进行连接，形成目标配置页面；以及

目标展示页面生成模块，执行所述目标配置页面，以生成对应的目标展示页面。

本发明还提供了一种可视化编程设备，包括：

处理器；

存储器，其中存储有所述处理器的可执行程序；

其中，所述处理器配置为经由执行所述可执行程序来执行上述任意一项可视化编程方法的步骤。

本发明还提供了一种计算机可读存储介质，用于存储程序，所述程序被处理器执行时实现上述任意一项可视化编程方法的步骤。

本发明与现有技术相比，具有以下优点及突出性效果：

本发明提供的可视化编程方法及系统提供了一种新的具有可视化逻辑处理功能的低代码工具，在提供视图展示编程功能的同时，具备了逻辑处理能力，便于用户快速地开发应用，利于降低一些特定场景应用的开发复杂度。

附图说明

通过阅读参照以下附图对非限制性实施例所作的详细描述，本发明的其它特征、目的和优点将会变得更明显。

图1为本发明一实施例公开的一种可视化编程方法的示意图；

图2为本发明一实施例公开的一编辑页面的示意图；

图3为本发明另一实施例公开的一种可视化编程方法的示意图；

图4为本发明另一实施例公开的一种可视化编程方法的示意图；

图5为本发明另一实施例公开的一种可视化编程方法中步骤S140的流程示意图；

图6为本发明一实施例公开的一种可视化编程系统的结构示意图；

图7为本发明一实施例公开的一种可视化编程设备的结构示意图；

具体实施方式

以下通过特定的具体实例说明本申请的实施方式，本领域技术人员可由本申请所揭露的内容轻易地了解本申请的其他优点与功效。本申请还可以通过另外不同的具体实施方式加以实施或应用系统，本申请中的各项细节也可以根据不同观点与应用系统，在没有背离本申请的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。

下面以附图为参考，针对本申请的实施例进行详细说明，以便本申请所属技术领域的技术人员能够容易地实施。本申请可以以多种不同形态体现，并不限定于此处说明的实施例。

在本申请的表示中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的表示意指结合该实施例或示例表示的具体特征、结构、材料或者特点包括于本申请的至少一个实施例或示例中。而且，表示的具体特征、结构、材料或者特点可以在任一个或多个实施例或示例中以合适的方式结合。此外，在不相互矛盾的情况下，本领域的技术人员可以将本申请中表示的不同实施例或示例以及不同实施例或示例的特征进行结合和组合。

此外，术语“第一”、“第二”仅用于表示目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或隐含地包括至少一个该特征。在本申请的表示中，“多个”的含义是两个或两个以上，除非另有明确具体的限定。

为了明确说明本申请，省略与说明无关的器件，对于通篇说明书中相同或类似的构成要素，赋予了相同的参照符号。

在通篇说明书中，当说某器件与另一器件“连接”时，这不仅包括“直接连接”的情形，也包括在其中间把其它元件置于其间而“间接连接”的情形。另外，当说某种器件“包括”某种构成要素时，只要没有特别相反的记载，则并非将其它构成要素排除在外，而是意味着可以还包括其它构成要素。

当说某器件在另一器件“之上”时，这可以是直接在另一器件之上，但也可以在其之间伴随着其它器件。当对照地说某器件“直接”在另一器件“之上”时，其之间不伴随其它器件。

虽然在一些实例中术语第一、第二等在本文中用来表示各种元件，但是这些元件不应当被这些术语限制。这些术语仅用来将一个元件与另一个元件进行区分。例如，第一接口及第二接口等表示。再者，如同在本文中所使用的，单数形式“一”、“一个”和“该”旨在也包括复数形式，除非上下文中有相反的指示。应当进一步理解，术语“包含”、“包括”表明存在的特征、步骤、操作、元件、组件、项目、种类、和/或组，但不排除一个或多个其他特征、步骤、操作、元件、组件、项目、种类、和/或组的存在、出现或添加。此处使用的术语“或”和“和/或”被解释为包括性的，或意味着任一个或任何组合。因此，“A、B或C”或者“A、B和/或C”意味着“以下任一个：A；B；C；A和B；A和C；B和C；A、B和C”。仅当元件、功能、步骤或操作的组合在某些方式下内在地互相排斥时，才会出现该定义的例外。

此处使用的专业术语只用于言及特定实施例，并非意在限定本申请。此处使用的单数形态，只要语句未明确表示出与之相反的意义，那么还包括复数形态。在说明书中使用的“包括”的意义是把特定特性、区域、整数、步骤、作业、要素及/或成份具体化，并非排除其它特性、区域、整数、步骤、作业、要素及/或成份的存在或附加。

虽然未不同地定义，但包括此处使用的技术术语及科学术语，所有术语均具有与本申请所属技术领域的技术人员一般理解的意义相同的意义。普通使用的字典中定义的术语追加解释为具有与相关技术文献和当前提示的内容相符的意义，只要未进行定义，不得过度解释为理想的或非常公式性的意义。

现在将结合参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的实施方式。相反，提供这些实施方式使得本发明将全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。在图中相同的附图标记表示相同或类似的结构，因而将省略对它们的重复描述。

如图1所示，本发明一实施例公开了一种可视化编程方法，该方法包括以下步骤：

S110，将多个预设编程能力元素分别映射为图形元素节点。具体而言，上述预设编程能力元素可以为基础类型、变量、条件语句、循环、函数、接口、类、运算符、关系运算符、逻辑运算符、位运算符、赋值运算符、类型运算符或者其他运算符等一系列能力。本实施例使得用户在集成开发环境中可以通过创建新文件、检索模块、鼠标拖拽、节点连接等操作来构造和使用相应的能力。上述图形元素节点即为可视化图形。

对于上述集成开发环境，可以选择Vue和Electron结合作为环境构建框架。其中，使用Vue开发编辑器页面，提供基本的操作界面。使用Electron来访问本地资源，进行文件保存和编译打包。

本实施例中，上述预设编程能力元素包括运算符元素。上述图形元素节点包括运算符节点。该步骤包括：将各个运算符元素分别映射为运算符节点。

S120，将上述图形元素节点展示于一编辑页面。具体而言，该页面即为可编辑页面。参考图2，其示例性地示出了一编辑页面。示例性地，上述图形元素节点还包括函数元素节点、参数元素节点、执行调度端口元素节点21以及参数端口元素节点22。该编辑页面描述了一个检测是否为奇数的函数的运算过程：函数名即函数元素节点为IsOddNumber，参数元素节点为Param，返回值为Bool类型。

S130，基于接收到的拖拽操作触发信号，将上述编辑页面中的上述图形元素节点进行连接，形成目标配置页面。下面进行举例说明：比如用户需要新建一个类文件，并将其命名为“MyClass”，然后使用集成开发环境的类编辑器，对“MyClass”添加属性及其类型、方法及其实现、基类、接口等。在进行方法的实现编写时，通过拖拽和组合不同的图形，来完成数据的处理表达。其中，图形可视化模块之间的连接方式可参考图2中的箭头所示。

S140，执行上述目标配置页面，以生成对应的目标展示页面。具体而言，该步骤可以依据用户的手动触发信号来执行生成，也可以自动执行生成，本申请对此不作限制。

如图3所示，在本申请的另一实施例中，公开了另一种可视化编程方法。该方法在上述图1对应实施例的基础上，步骤S120包括：

S121，将上述函数元素节点和上述执行调度端口元素节点组合，形成第一匹配对。

S122，将上述参数元素节点和上述参数端口元素节点组合，形成第二匹配对。

S123，基于上述第一匹配对和上述第二匹配对，生成第一输入可视化模块，并将上述第一输入可视化模块展示于一编辑页面。

继续参考图2，第一输入可视化模块23作为后续运算符节点可视化模块的输入。这样可实现用户通过拖拽和组合不同的图形，来完成数据的处理表达；在提供视图展示编程功能的同时，具备了逻辑处理能力，便于用户快速地开发应用，利于降低一些特定场景应用的开发复杂度。

在本申请的另一实施例中，公开了另一种可视化编程方法。该方法在上述图3对应实施例的基础上，步骤S120还包括：

S124，根据上述运算符节点和上述参数端口元素节点，生成多个运算可视化模块。上述多个运算可视化模块具有级联关系，且包括第一运算可视化模块25和第二运算可视化模块26。

步骤S140包括：

将上述第一输入可视化模块作为第一运算可视化模块的输入参数。

以及将上述第一运算可视化模块的输出结果作为上述第二运算可视化模块的输入参数。

其中，示例性地，第一运算可视化模块25包括一运算符节点24，该运算符节点24为求余数运算符％。

该实施例实现了用户通过拖拽和组合不同的图形，来完成数据的处理表达；在提供视图展示编程功能的同时，具备了逻辑处理能力，便于用户快速地开发应用，利于降低一些特定场景应用的开发复杂度。

如图4所示，在本申请的另一实施例中，公开了另一种可视化编程方法。该方法在上述图1对应实施例的基础上，步骤S140包括：

S141，将上述目标配置页面中的各可视化模块转换为预设编程语言代码。

S142，基于与上述预设编程语言代码对应的编译器，将上述预设编程语言代码转换为机器码。

其中，上述预设编程语言代码可以为Java、TypeScript、C++等编程语言。将数据处理过程表达，转变为可实际运行的程序，还需要对其进行转换和编译。该实施例将目标配置页面中的各可视化模块，转换为Java、TypeScript、C++等编程语言的源代码，基于各平台原生的编译环境，连通各平台编译器的调试器，将调试信息和报错信息进行双向定位，即达到断点调试、报错定位、内存查看等调试功能。实现了在执行上述目标配置页面的过程中，对该目标配置页面的编译。

如图5所示，在本申请的另一实施例中，公开了另一种可视化编程方法。该方法在上述图4对应实施例的基础上，步骤S140还包括：

S143，获取编译过程中产生的报错信息。

S144，根据上述目标配置页面中的各可视化模块，生成抽象语法树。

S145，将上述报错信息在上述预设编程语言代码中进行第一次定位，获得对应的第一代码模块。

S146，根据上述抽象语法树和上述第一代码模块，在上述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

该实施例将目标配置页面中的各可视化模块，转换为Java、TypeScript、C++等编程语言的源代码，基于各平台原生的编译环境，连通各平台编译器的调试器，将调试信息和报错信息进行双向定位，利用源代码-调试器实现了第一次定位，可视化模块-源代码实现了第二次定位，即达到断点调试、报错定位、内存查看等调试功能。实现了在执行上述目标配置页面的过程中，对该目标配置页面的编译。

该实施例也可以便于用户在调试编译报错时，快速地定位出现错误的可视化模块，从而及时进行纠正错误，利于快速开发，提高一些特定场景应用的开发速度和效率。

其中，抽象语法树即为AST(Abstract Syntax Tree)。

在一些实施例中，在上述图5对应实施例的基础上，步骤S145可以包括：

S1451，将上述目标配置页面中的各可视化模块转换为Token流，生成一存储上述Token流的数组。以及

S1452，将上述数组转换为结构化的抽象语法树。

在一些实施例中，在上述图5对应实施例的基础上，抽象语法树中包含有上述目标配置页面中的各可视化模块对应的模块ID信息。上述步骤S147可以包括：

根据上述第一代码模块和上述抽象语法树中的模块ID信息，在上述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

该实施例实现了在AST信息中附属了集成开发环境中创建的可视化模块ID信息，用来定位当前AST块对应的可视化模块，再连通各平台编译器的调试器，将调试信息和报错信息进行双向定位，即达到断点调试、报错定位、内存查看等调试功能。

示例性地，上述预设条件可以为：对定位的可视化模块以第一背景色进行显示。第一背景色可以为纯红色或者纯黄色等。这样可以便于用户在调试编译报错时，快速地定位出现错误的可视化模块，从而及时进行纠正错误，利于快速开发，提高一些特定场景应用的开发速度和效率。

需要说明的是，本申请中公开的上述所有实施例可以进行自由组合，组合后得到的技术方案也在本申请的保护范围之内。

如图6所示，本发明一实施例还公开了一种可视化编程系统6，该系统包括：

元素映射模块61，将多个预设编程能力元素分别映射为图形元素节点。

图形元素节点展示模块62，将上述图形元素节点展示于一编辑页面。

目标配置页面生成模块63，基于接收到的拖拽操作触发信号，将上述编辑页面中的上述图形元素节点进行连接，形成目标配置页面。以及

目标展示页面生成模块64，执行上述目标配置页面，以生成对应的目标展示页面。

可以理解的是，本发明的可视化编程系统还包括其他支持可视化编程系统运行的现有功能模块。图6显示的可视化编程系统仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

本实施例中的可视化编程系统用于实现上述的可视化编程的方法，因此对于可视化编程系统的具体实施步骤可以参照上述对可视化编程的方法的描述，此处不再赘述。

本发明一实施例还公开了一种可视化编程设备，包括处理器和存储器，其中存储器存储有所述处理器的可执行程序；处理器配置为经由执行可执行程序来执行上述可视化编程方法中的步骤。图7是本发明公开的可视化编程设备的结构示意图。下面参照图7来描述根据本发明的这种实施方式的电子设备600。图7显示的电子设备600仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图7所示，电子设备600以通用计算设备的形式表现。电子设备600的组件可以包括但不限于：至少一个处理单元610、至少一个存储单元620、连接不同平台组件(包括存储单元620和处理单元610)的总线630、显示单元640等。

其中，存储单元存储有程序代码，程序代码可以被处理单元610执行，使得处理单元610执行本说明书上述可视化编程方法部分中描述的根据本发明各种示例性实施方式的步骤。例如，处理单元610可以执行如图1中所示的步骤。

存储单元620可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(RAM)6201和/或高速缓存存储单元6202，还可以进一步包括只读存储单元(ROM)6203。

存储单元620还可以包括具有一组(至少一个)程序模块6205的程序/实用工具6204，这样的程序模块6205包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。

总线630可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。

电子设备600也可以与一个或多个外部设备700(例如键盘、指向设备、蓝牙设备等)通信，还可与一个或者多个使得用户能与该电子设备600交互的设备通信，和/或与使得该电子设备600能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口650进行。并且，电子设备600还可以通过网络适配器660与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。网络适配器660可以通过总线630与电子设备600的其它模块通信。应当明白，尽管图中未示出，可以结合电子设备600使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储平台等。

本发明还公开了一种计算机可读存储介质，用于存储程序，所述程序被执行时实现上述可视化编程方法中的步骤。在一些可能的实施方式中，本发明的各个方面还可以实现为一种程序产品的形式，其包括程序代码，当程序产品在终端设备上运行时，程序代码用于使终端设备执行本说明书上述可视化编程方法中描述的根据本发明各种示例性实施方式的步骤。

如上所示，该实施例的计算机可读存储介质的程序在执行时，提供了一种新的具有可视化逻辑处理功能的低代码工具，在提供视图展示编程功能的同时，具备了逻辑处理能力，便于用户快速地开发应用，利于降低一些特定场景应用的开发复杂度。

本发明一实施例公开了一种计算机可读存储介质。该存储介质是实现上述方法的程序产品，其可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码，并可以在终端设备，例如个人电脑上运行。然而，本发明的程序产品不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

计算机可读存储介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读存储介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。可读存储介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、RF等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言的任意组合来编写用于执行本发明操作的程序代码，程序设计语言包括面向对象的程序设计语言—诸如Java、C++等，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(LAN)或广域网(WAN)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。

本发明实施例提供的可视化编程方法及系统提供了一种新的具有可视化逻辑处理功能的低代码工具，在提供视图展示编程功能的同时，具备了逻辑处理能力，便于用户快速地开发应用，利于降低一些特定场景应用的开发复杂度。

以上内容是结合具体的优选实施方式对本发明所作的进一步详细说明，不能认定本发明的具体实施只局限于这些说明。对于本发明所属技术领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干简单推演或替换，都应当视为属于本发明的保护范围。

Claims (10)

1.一种可视化编程方法，其特征在于，包括以下步骤：

S110，将多个预设编程能力元素分别映射为图形元素节点；

S120，将所述图形元素节点展示于一编辑页面；

S130，基于接收到的拖拽操作触发信号，将所述编辑页面中的所述图形元素节点进行连接，形成目标配置页面；以及

S140，执行所述目标配置页面，以生成对应的目标展示页面。

2.如权利要求1所述的可视化编程方法，其特征在于，所述预设编程能力元素包括运算符元素，所述图形元素节点包括运算符节点；步骤S110包括：

将各个运算符元素分别映射为运算符节点。

3.如权利要求2所述的可视化编程方法，其特征在于，所述图形元素节点还包括函数元素节点、参数元素节点、参数端口元素节点以及执行调度端口元素节点；步骤S120包括：

将所述函数元素节点和所述执行调度端口元素节点组合，形成第一匹配对；

将所述参数元素节点和所述参数端口元素节点组合，形成第二匹配对；

基于所述第一匹配对和所述第二匹配对，生成第一输入可视化模块，并将所述第一输入可视化模块展示于一编辑页面。

4.如权利要求3所述的可视化编程方法，其特征在于，步骤S120包括：

根据所述运算符节点和所述参数端口元素节点，生成多个运算可视化模块；所述多个运算可视化模块具有级联关系，且包括第一运算可视化模块和第二运算可视化模块；

步骤S140包括：

将所述第一输入可视化模块作为第一运算可视化模块的输入参数；

将所述第一运算可视化模块的输出结果作为所述第二运算可视化模块的输入参数。

5.如权利要求1所述的可视化编程方法，其特征在于，步骤S140包括：

将所述目标配置页面中的各可视化模块转换为预设编程语言代码；

基于与所述预设编程语言代码对应的编译器，对所述预设编程语言代码进行编译。

6.如权利要求5所述的可视化编程方法，其特征在于，所述基于与所述预设编程语言代码对应的编译器，对所述预设编程语言代码进行编译，包括：

基于与所述预设编程语言代码对应的编译器，将所述预设编程语言代码转换为机器码。

7.如权利要求6所述的可视化编程方法，其特征在于，步骤S140还包括：

获取编译过程中产生的报错信息；

根据所述目标配置页面中的各可视化模块，生成抽象语法树；

将所述报错信息在所述预设编程语言代码中进行第一次定位，获得对应的第一代码模块；

根据所述抽象语法树和所述第一代码模块，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

8.如权利要求7所述的可视化编程方法，其特征在于，所述抽象语法树中包含有所述目标配置页面中的各可视化模块对应的模块ID信息；所述根据所述抽象语法树和所述第一代码模块，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示，包括：

根据所述第一代码模块和所述抽象语法树中的模块ID信息，在所述目标配置页面中的可视化模块中进行第二次定位，并对定位的可视化模块以预设条件进行展示。

9.如权利要求7所述的可视化编程方法，其特征在于，所述根据所述目标配置页面中的各可视化模块，生成抽象语法树，包括：

将所述目标配置页面中的各可视化模块转换为Token流，生成一存储所述Token流的数组；

将所述数组转换为结构化的抽象语法树。

10.一种可视化编程系统，用于实现如权利要求1所述的可视化编程方法，其特征在于，所述系统包括：

元素映射模块，将多个预设编程能力元素分别映射为图形元素节点；

图形元素节点展示模块，将所述图形元素节点展示于一编辑页面；

目标配置页面生成模块，基于接收到的拖拽操作触发信号，将所述编辑页面中的所述图形元素节点进行连接，形成目标配置页面；以及

目标展示页面生成模块，执行所述目标配置页面，以生成对应的目标展示页面。

Images