Image generation method and device, equipment and medium
By monitoring and validity detection of SVG codes within a single operation interface and synchronously generating target vector images, the problem of inefficiency of traditional SVG editing tools is solved, and efficient SVG image creation and editing is achieved, reducing error rates and improving code quality.
Patent Information
- Application Number
- CN202411723952.6
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-27
- Publication Date
- 2025-03-21
AI Technical Summary
Traditional SVG image editing tools lack tight integration with modern web development toolchains, resulting in designers and developers having to frequently switch multiple tools, reducing development efficiency and increasing the risk of errors.
An image generation method is provided, which can realize SVG image editing and preview functions in a single operation interface by monitoring input events triggered by the user in the editing area of the preset operation interface, identify and validly detect SVG codes, and synchronously generate target vector images in the preview area.
It improves the creation and editing efficiency of SVG images, reduces frequent switching between multiple tools, reduces error rate, saves debugging and error repair time, and ensures that the output SVG code is of high quality and does not contain redundancy.
Smart Images

Figure CN119668471A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of image processing technology, and in particular to an image generation method, device, equipment and medium. Background Art
[0002] Scalable Vector Graphics (SVG) is an XML (Extensible Markup Language) markup language used to describe vector graphics. In the field of life insurance, with the in-depth development of digital transformation, users' demand for online display of insurance products is increasing. SVG images are gradually becoming a popular choice in insurance product image design because of their ability to be losslessly enlarged and reduced at any resolution and their support for animation and interactive functions. However, although SVG images have great potential, their development process still has certain limitations. Traditional SVG image editing tools are mostly desktop software. These tools provide powerful design functions, but lack close integration with modern web development tool chains. In addition, designers and developers often need to switch frequently between multiple tools to preview and adjust SVG images, which not only reduces development efficiency, but also may increase the risk of errors.
[0003] Therefore, how to improve the creation and editing efficiency of SVG images has become an urgent problem to be solved. Summary of the invention
[0004] Based on this, an image generation method, device, equipment and medium are provided to solve the problem of how to improve the efficiency of creating and editing SVG images.
[0005] In a first aspect, an embodiment of the present invention provides an image generation method, comprising: Listening to input events triggered by a user in an editing area of a preset operation interface, identifying SVG code input in the editing area, and determining tags in the SVG code, attributes related to the tags, and attribute values corresponding to the attributes; Performing a validity check on the SVG code according to a preset SVG tag dictionary, and synchronously generating a target vector image corresponding to the SVG code in a preview area of the preset operation interface after the validity check passes; The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes.
[0006] In a second aspect, an embodiment of the present invention provides an image generating device, including: An editing module, configured to monitor input events triggered by a user in an editing area of a preset operation interface, identify SVG codes input in the editing area, and determine tags in the SVG code, attributes related to the tags, and attribute values corresponding to the attributes; A synchronous preview module, used to perform validity detection on the SVG code according to a preset SVG tag dictionary, and synchronously generate a target vector image corresponding to the SVG code in a preview area of the preset operation interface after the validity detection passes; The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes.
[0007] In a third aspect, an embodiment of the present invention provides a computer device, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the image generation method of the first aspect when executing the computer program.
[0008] In a fourth aspect, an embodiment of the present invention provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the image generation method of the first aspect is implemented.
[0009] The technical effects achieved by the present invention are different from those achieved by the prior art solutions: the present invention monitors the input events triggered by the user in the editing area of the preset operation interface, identifies the SVG code input in the editing area, performs validity detection on the SVG code according to the SVG tag dictionary, and after the validity detection passes, synchronously generates the target vector image corresponding to the SVG code in the preview area of the preset operation interface. The simultaneous editing and previewing functions of SVG images in a single operation interface are realized. Compared with traditional SVG editing tools, the frequent switching between multiple tools is avoided during the creation and editing of SVG images. According to the SVG code in the editing area, the corresponding SVG image effect can be instantly previewed in the preview area of the single operation interface, thereby improving the creation and editing efficiency of SVG images. At the same time, by performing validity detection on the identified SVG code, the error rate of the SVG code is reduced, the time for debugging and error repair is saved, and the output SVG code is ensured to be of high quality and free of redundancy. BRIEF DESCRIPTION OF THE DRAWINGS
[0010] In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the accompanying drawings required for use in the description of the embodiments of the present invention will be briefly introduced below. Obviously, the accompanying drawings in the following description are only some embodiments of the present invention. For ordinary technicians in this field, other accompanying drawings can be obtained based on these accompanying drawings without paying creative labor.
[0011] Figure 1 This is a schematic diagram of an application environment of an image generation method provided in Embodiment 1 of the present application; Figure 2 is a flowchart of an image generating method provided by Embodiment 2 of the present invention; Figure 3 is a flowchart of an image generation method provided by Embodiment 3 of the present invention; Figure 4 is a flowchart of an image generating method provided by Embodiment 4 of the present invention; Figure 5 is a structural schematic diagram of an image generating device provided by Embodiment 5 of the present invention; Figure 6 It is a structural diagram of a computer device provided in Embodiment 6 of the present invention. DETAILED DESCRIPTION
[0012] The following will be combined with the drawings in the embodiments of the present invention to clearly and completely describe the technical solutions in the embodiments of the present invention. Obviously, the described embodiments are part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.
[0013] It should be understood that the order of execution of the steps in the following embodiments does not imply a precedence of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present invention.
[0014] An image generation method provided by the first embodiment of the present invention can be applied in the following aspects: Figure 1 In the application environment, the server communicates with the client, the server provides image generation services, and the client triggers the image generation task to the server. The client includes but is not limited to PDAs, desktop computers, laptops, ultra-mobile personal computers (UMPCs), netbooks, cloud computing devices, personal digital assistants (PDAs), and other devices. The computer device corresponding to the server can be implemented with an independent server or a server cluster consisting of multiple servers.
[0015] like Figure 2 FIG. 1 is a flow chart of an image generation method provided in Embodiment 2 of the present invention, comprising the following steps: Step S201: monitoring input events triggered by a user in an editing area of a preset operation interface, identifying SVG codes input in the editing area, and determining tags, tag-related attributes, and attribute values corresponding to the attributes in the SVG code.
[0016] Step S202: performing validity check on the SVG code according to a preset SVG tag dictionary, and after the validity check passes, synchronously generating a target vector image corresponding to the SVG code in a preview area of a preset operation interface.
[0017] In this embodiment, the preset operation interface may refer to a preset interface for users to interact with computer devices, such as screen interfaces of computer devices such as mobile phones and computers. Tags in SVG codes may be used to define and describe elements in SVG images. Attributes may be used to describe the characteristics or behaviors of SVG elements. Attribute values refer to specific values of attributes. The editing area may be an area in the preset operation interface for SVG code input. An input event may refer to an input operation in the editing area triggered by a user. The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes. The target vector image may refer to an SVG image generated based on SVG codes.
[0018] Specifically, the preset operation interface can be set to a dual-window mode, one window is the editing area, and the other window is the preview area, which monitors the input events triggered by the user in the editing area, and the input events may include the user-triggered input operation of the SVG code in the editing area, the user-triggered drag-in operation of the editing file in the editing area, and the user-triggered access operation of the local editing file based on the file path. If the input event in the editing area is an SVG code input operation, the SVG code is directly identified to determine the tag, the tag-related attributes, and the attribute values corresponding to the attributes. If the input event in the editing area is the drag-in or access operation of the editing file, the file type of the editing file is detected. If the file type is in SVG format, the editing file is parsed to identify the SVG code in the editing file, and the tag, the tag-related attributes, and the attribute values corresponding to the attributes are determined.
[0019] After determining the tags, tag-related attributes, and attribute values corresponding to the attributes in the SVG code, for any tag in the SVG code, the tag is regularly matched with the standard tag, the attribute related to the tag is regularly matched with the standard attribute related to the standard tag, and the attribute value corresponding to the attribute is regularly matched with the standard attribute value corresponding to the standard attribute. If all tags, tag-related attributes, and attribute values corresponding to the attributes in the currently input SVG code can be matched to the corresponding standard tags, standard attributes, or standard attribute values in the preset SVG tag dictionary, it is determined that the SVG code validity check has passed. After the validity check passes, the SVG code is parsed, and the target vector image corresponding to the SVG code is synchronously generated in the preview area.
[0020] Optionally, after monitoring the completion of SVG code input in the editing area, the target code after the input is obtained, and a unique version number is assigned to the target code, a mapping relationship is formed between the target SVG code and the version number, a version mapping table is constructed, the version number is used as a menu item, a drop-down menu is formed in the editing area, the menu item selected by the user in the drop-down menu is identified, and the target SVG code corresponding to the menu item is displayed in the editing area according to the version number corresponding to the menu item and the version mapping table.
[0021] In this embodiment, the simultaneous editing and previewing functions of SVG images in a single operation interface are implemented. Compared with traditional SVG editing tools, frequent switching between multiple tools is avoided during the creation and editing of SVG images. The corresponding SVG image effect can be instantly previewed in the preview area of the single operation interface according to the SVG code in the editing area, thereby improving the creation and editing efficiency of SVG images. At the same time, by performing validity detection on the identified SVG code, the error rate of the SVG code is reduced, saving time for debugging and error repair, and ensuring that the output SVG code is of high quality and does not contain redundancy.
[0022] like Figure 3 FIG. 2 is a flow chart of an image generation method provided by Embodiment 3 of the present invention. After monitoring the input event triggered by the user in the editing area of the preset operation interface in the above step S201, the following steps may be further included: Step S301: obtaining the cursor position input by the user in the editing area, determining the input string corresponding to the cursor position, performing similarity matching between the input string and the standard label, standard attribute and standard attribute value, and obtaining a similarity score.
[0023] Step S302: Determine candidate tags, candidate attributes or candidate attribute values that match the input string according to the similarity score, and form a drop-down list in the editing area with the candidate tags, candidate attributes and candidate attribute values in the form of list items.
[0024] Step S303: Identify the list item selected by the user in the drop-down list, and update the candidate label, candidate attribute or candidate attribute value corresponding to the list item with the input character string.
[0025] In this embodiment, the cursor position may be the character input position within the editing area, the input string corresponding to the cursor position may be the string currently being input by the user, the similarity score may refer to a score representing the similarity between the input string and the standard label, standard attribute or standard attribute value, the candidate labels, candidate attributes and candidate attribute values may refer to labels, attributes and attribute values screened from standard labels, standard attributes and standard attribute values based on the similarity scores, and the drop-down list may refer to a list with candidate labels, candidate attributes and candidate attribute values as list items.
[0026] Specifically, based on the cursor position entered by the user in the editing area, the character string currently being entered by the user is determined, and the similarity between the input character string and the standard label, standard attribute and standard attribute value is calculated through an approximate matching algorithm such as cosine similarity or edit distance to obtain a similarity score between the input character string and each standard label, standard attribute and standard attribute value. Based on the similarity score, a standard label, standard attribute or standard attribute value whose similarity score meets a preset threshold is selected as a candidate label, candidate attribute or candidate attribute value, and the selected candidate label, candidate attribute or candidate attribute value is formed into a drop-down list in the editing area in the form of list items, and the list item selected by the user in the drop-down list is identified, and the input character string is updated to the candidate label, candidate attribute or candidate attribute value corresponding to the list item.
[0027] In this embodiment, automatic completion of the input string in the SVG code entered by the user is implemented, and the user can select the tag, attribute or attribute value corresponding to the input string from the drop-down list, thereby reducing the input time and error rate, improving the input efficiency of the SVG code, and further improving the creation and editing efficiency of the SVG image, thereby enhancing the user's input experience.
[0028] like Figure 4 As shown, a flowchart of an image generation method provided by Embodiment 4 of the present invention may further include the following steps after identifying the SVG code input in the editing area in the above step S201: Step S401: Acquire a preset component library, and display all preset graphic elements in the preset component library in the editing area.
[0029] Step S402: Identify the preset graphic element selected by the user, and insert the element code corresponding to the preset graphic element into the SVG code.
[0030] In this embodiment, the preset component library may refer to a pre-set component library including preset graphic elements and corresponding element codes. For example, the component library may be a simple folder structure, in which each file represents a preset graphic element and a corresponding element code.
[0031] Specifically, users can create their own component library, save commonly used graphic elements or templates to the preset component library, and after recognizing the SVG code entered in the editing area, display all preset graphic elements in the preset component library selected by the user in the editing area, recognize the graphic element selected by the user, and insert the element code corresponding to the graphic element into the SVG code.
[0032] Optionally, after the SVG code input in the editing area is identified, a preset tag mapping table may be obtained, in which standard tags and tag colors associated with the standard tags are recorded.
[0033] Specifically, the standard tags can be classified to obtain the tag category to which each standard tag belongs, and a corresponding label color can be assigned to each standard tag according to the label category. A mapping relationship is formed between the standard tags and the corresponding label colors, and a label mapping table is constructed. After identifying the SVG code entered in the editing area, for any tag in the SVG code, according to the tag, the label mapping table is queried to determine the label color corresponding to the tag, and the tag is labeled with the label color.
[0034] In this embodiment, when the SVG code entered in the editing area is identified, the element code corresponding to the image element is inserted into the SVG code by selecting a graphic element from the preset component library, thereby reducing the input time and error rate, improving the input efficiency of the SVG code, and thus improving the creation and editing efficiency of SVG images, thereby enhancing the user's input experience, and by color-coding the SVG code, the categories and attributes of different tags can be intuitively identified, making the code easier to read and understand, thereby improving the maintainability of the code.
[0035] like Figure 5 As shown, an image generation device provided in Embodiment 5 of the present invention corresponds to the image generation method in the above embodiment. The image generation device includes an editing module 51 and a synchronous preview module 52. The functional modules are described in detail as follows: The editing module 51 is used to monitor input events triggered by the user in the editing area of the preset operation interface, identify the SVG code input in the editing area, and determine the tags in the SVG code, the attributes related to the tags, and the attribute values corresponding to the attributes; A synchronous preview module 52, configured to perform a validity check on the SVG code according to a preset SVG tag dictionary, and synchronously generate a target vector image corresponding to the SVG code in a preview area of the preset operation interface after the validity check passes; The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes.
[0036] Optionally, the image generating device further includes: A character acquisition module, used to acquire a cursor position input by a user in the editing area, determine an input string corresponding to the cursor position, and perform similarity matching between the input string and the standard label, the standard attribute and the standard attribute value to obtain a similarity score; A list forming module, used to determine the candidate tags, candidate attributes or candidate attribute values that match the input string according to the similarity score, and form a drop-down list in the editing area with the candidate tags, the candidate attributes and the candidate attribute values in the form of list items; The character completion module is used to identify the list item selected by the user in the drop-down list, and update the candidate label, candidate attribute or candidate attribute value corresponding to the list item with the input character string.
[0037] Optionally, the image generating device further includes: A file acquisition module, used to acquire the editing file dragged by the user in the editing area, and determine the file type of the editing file; A format determination module, configured to parse the edit file and identify the SVG code in the edit file if the file type is in SVG format; The invalidation module is used to determine that the edited file is an invalid file if the file type is not in the SVG format.
[0038] Optionally, the image generating device further includes: A component acquisition module, used to acquire a preset component library, the preset component library including preset graphic elements and corresponding element codes, and display all preset graphic elements in the preset component library in the editing area; The component insertion module is used to identify the preset graphic element selected by the user and insert the element code corresponding to the preset graphic element into the SVG code.
[0039] Optionally, the image generating device further includes: A mapping table acquisition module, used to acquire a preset label mapping table, wherein the preset label mapping table records the standard label and the label color associated with the standard label; The color identification module is used to query the preset tag mapping table for any tag in the SVG code according to the tag, determine the tag color corresponding to the tag, and perform the tag color identification on the tag.
[0040] Optionally, the synchronous preview module 52 includes: A regular matching module, for performing regular matching on any tag in the SVG code with the standard tag, performing regular matching on an attribute associated with the tag with a standard attribute associated with the standard tag, and performing regular matching on an attribute value corresponding to the attribute with a standard attribute value corresponding to the standard attribute; The result determination module is used to determine that the validity test has passed if the tag, the attribute related to the tag and the attribute value corresponding to the attribute all match each other.
[0041] Optionally, the image generating device further includes: A version allocation module, configured to obtain a target SVG code after monitoring that the editing area completes input of the SVG code, and allocate a unique version number to the target SVG code; A mapping table construction module, used to form a mapping relationship between the target SVG code and the version number, and construct a version mapping table; A menu forming module, used for forming a drop-down menu in the editing area by using the version number as a menu item; The code display module is used to identify the menu item selected by the user in the drop-down menu, and display the target SVG code corresponding to the menu item in the editing area according to the version number corresponding to the menu item and the version mapping table.
[0042] For the specific definition of the image generation device, please refer to the definition of the image generation method above, which will not be repeated here. Each module in the above-mentioned image generation device can be implemented in whole or in part by software, hardware and a combination thereof. The above-mentioned modules can be embedded in or independent of the processor in the computer device in the form of hardware, or can be stored in the memory of the computer device in the form of software, so that the processor can call and execute the operations corresponding to the above modules.
[0043] Figure 6 This is a schematic diagram of the structure of a computer device provided in Embodiment 6 of the present invention. Figure 6 As shown, the computer device of this embodiment includes: at least one processor ( Figure 6 Only one is shown in the figure), a memory, and a computer program stored in the memory and executable on at least one processor, wherein when the processor executes the computer program, the steps of any of the above-mentioned image generation method embodiments are implemented.
[0044] The computer device may include, but is not limited to, a processor and a memory. Those skilled in the art will appreciate that Figure 6 This is merely an example of a computer device and does not constitute a limitation on the computer device. The computer device may include more or fewer components than those shown in the figure, or a combination of certain components, or different components. For example, it may also include a network interface, a display screen, and an input device.
[0045] The processor may be a central processing unit (CPU), other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor may be a microprocessor or any conventional processor, etc.
[0046] The memory includes a readable storage medium, an internal memory, etc., wherein the internal memory may be the memory of a computer device, and the internal memory provides an environment for the operation of the operating system and computer-readable instructions in the readable storage medium. The readable storage medium may be a hard disk of a computer device, and in other embodiments, it may also be an external storage device of the computer device, for example, a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card, a flash card (Flash Card), etc. equipped on the computer device. Further, the memory may also include both an internal storage unit of the computer device and an external storage device. The memory is used to store an operating system, an application program, a boot loader (BootLoader), data, and other programs, such as the program code of a computer program, etc. The memory may also be used to temporarily store data that has been output or is to be output.
[0047] The technicians in the relevant field can clearly understand that for the convenience and simplicity of description, only the division of the above-mentioned functional units and modules is used as an example. In practical applications, the above-mentioned function allocation can be completed by different functional units and modules as needed, that is, the internal structure of the device is divided into different functional units or modules to complete all or part of the functions described above. The functional units and modules in the embodiment can be integrated into a processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The above-mentioned integrated unit can be implemented in the form of hardware or in the form of software functional units. In addition, the specific names of the functional units and modules are only for the convenience of distinguishing each other, and are not used to limit the scope of protection of the present invention. The specific working process of the units and modules in the above-mentioned device can refer to the corresponding process in the above-mentioned method embodiment, which will not be repeated here. If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on such understanding, the present invention implements all or part of the processes in the above-mentioned embodiment method, which can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a computer-readable storage medium. When the computer program is executed by the processor, the steps of the above-mentioned method embodiment can be implemented. Among them, the computer program includes computer program code, and the computer program code can be in source code form, object code form, executable file or some intermediate form. The computer-readable medium may at least include: any entity or device capable of carrying computer program code, recording medium, computer memory, read-only memory (ROM), random access memory (RAM), electric carrier signal, telecommunication signal and software distribution medium. For example, a USB flash drive, a mobile hard disk, a magnetic disk or an optical disk. In some jurisdictions, according to legislation and patent practice, computer-readable media cannot be electric carrier signals and telecommunication signals.
[0048] The present invention implements all or part of the processes in the above-mentioned embodiment method, and can also be completed by a computer program product. When the computer program product runs on a computer device, the computer device can implement the steps in the above-mentioned method embodiment when executing.
[0049] In the above embodiments, the description of each embodiment has its own emphasis. For parts that are not described or recorded in detail in a certain embodiment, reference can be made to the relevant descriptions of other embodiments.
[0050] Those skilled in the art will appreciate that the units and algorithm steps of each example described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, or a combination of computer software and electronic hardware. Whether these functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. Professional and technical personnel can use different methods to implement the described functions for each specific application, but such implementation should not be considered to be beyond the scope of the present invention.
[0051] In the embodiments provided by the present invention, it should be understood that the disclosed devices / computer equipment and methods can be implemented in other ways. For example, the device / computer equipment embodiments described above are only schematic, for example, the division of modules or units is only a logical function division, and there may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.
[0052] The units described as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.
[0053] The above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit the same. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that the technical solutions described in the aforementioned embodiments can still be modified, or some of the technical features can be replaced by equivalents, and these modifications or replacements do not deviate the essence of the corresponding technical solutions from the spirit and scope of the technical solutions of the embodiments of the present invention, and should all be included in the protection scope of the present invention.
Claims
1. An image generation method, characterized in that: include: Listening to input events triggered by a user in an editing area of a preset operation interface, identifying SVG code input in the editing area, and determining tags in the SVG code, attributes related to the tags, and attribute values corresponding to the attributes; Performing a validity check on the SVG code according to a preset SVG tag dictionary, and synchronously generating a target vector image corresponding to the SVG code in a preview area of the preset operation interface after the validity check passes; The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes.
2. The image generation method according to claim 1, characterized in that: After monitoring the input event triggered by the user in the editing area of the preset operation interface, the method further includes: Obtaining a cursor position input by a user in the editing area, determining an input string corresponding to the cursor position, and performing similarity matching between the input string and the standard label, the standard attribute, and the standard attribute value to obtain a similarity score; Determine, according to the similarity score, a candidate tag, a candidate attribute, or a candidate attribute value that matches the input string, and form a drop-down list in the editing area with the candidate tags, the candidate attributes, and the candidate attribute values in the form of list items; Identify the list item selected by the user in the drop-down list, and update the candidate label, candidate attribute or candidate attribute value corresponding to the list item with the input character string.
3. The image generation method according to claim 1, wherein: After monitoring the input event triggered by the user in the editing area of the preset operation interface, the method further includes: Acquire the editing file dragged by the user into the editing area, and determine the file type of the editing file; If the file type is in SVG format, the edit file is parsed to identify the SVG code in the edit file; If the file type is not the SVG format, the edited file is determined to be an invalid file.
4. The image generation method according to claim 1, wherein: After identifying the SVG code input in the editing area, the method further includes: Acquire a preset component library, the preset component library including preset graphic elements and corresponding element codes, and display all preset graphic elements in the preset component library in the editing area; Identify the preset graphic element selected by the user, and insert the element code corresponding to the preset graphic element into the SVG code.
5. The image generation method according to claim 1, characterized in that: After identifying the SVG code input in the editing area, the method further includes: Obtaining a preset label mapping table, wherein the preset label mapping table records the standard label and the label color associated with the standard label; For any tag in the SVG code, the preset tag mapping table is queried according to the tag, the tag color corresponding to the tag is determined, and the tag is marked with the tag color.
6. The image generation method according to claim 1, wherein: The performing validity detection on the SVG code according to the preset SVG tag dictionary includes: For any tag in the SVG code, the tag is regularly matched with the standard tag, the attribute associated with the tag is regularly matched with the standard attribute associated with the standard tag, and the attribute value corresponding to the attribute is regularly matched with the standard attribute value corresponding to the standard attribute; If the tag, the attribute associated with the tag, and the attribute value corresponding to the attribute all match each other, it is determined that the validity check has passed.
7. The image generation method according to claim 1, characterized in that: The image generation method further comprises: After monitoring that the editing area completes input of the SVG code, a target SVG code is obtained, and a unique version number is assigned to the target SVG code; A mapping relationship is formed between the target SVG code and the version number, and a version mapping table is constructed; The version number is a menu item, and a drop-down menu is formed in the editing area; The menu item selected by the user in the drop-down menu is identified, and the target SVG code corresponding to the menu item is displayed in the editing area according to the version number corresponding to the menu item and the version mapping table.
8. An image generating device, characterized in that: include: An editing module, configured to monitor input events triggered by a user in an editing area of a preset operation interface, identify SVG codes input in the editing area, and determine tags in the SVG code, attributes related to the tags, and attribute values corresponding to the attributes; A synchronous preview module, used to perform validity detection on the SVG code according to a preset SVG tag dictionary, and synchronously generate a target vector image corresponding to the SVG code in a preview area of the preset operation interface after the validity detection passes; The preset SVG tag dictionary includes standard tags, standard attributes related to the standard tags, and standard attribute values corresponding to the standard attributes.
9. A computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that: When the processor executes the computer program, the image generating method according to any one of claims 1 to 7 is implemented.
10. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the image generating method according to any one of claims 1 to 7 is implemented.