A picture labeling method, picture labeling system, device and medium

CN122530372BActive Publication Date: 2026-09-22STORAGEX TECH INC
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202611027175.0
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2026-07-10
Publication Date
2026-09-22
Estimated Expiration
2046-07-10

AI Technical Summary

Technical Problem

[0005]本发明申请提供了一种图片标注方法、图片标注系统、装置、介质,旨在至少部分解决现有图片标注技术中原图与标注内容混合绘制导致渲染开销较大,颜色相近连续区域识别效率较低,区域扩展过程中像素重复判断,像素访问状态进行有效管理等技术问题

Benefits of technology

在本发明申请中,通过在图片标注交互页面中设置操作控制区域和图片交互区域,响应用户的图片上传操作、标注参数设置操作以及针对待标注图片的点击操作,基于点击位置对应像素点的颜色值和颜色容差参数识别颜色相近且连续的目标区域,并根据目标区域生成区域遮罩和标注框,能够提高图片区域标注的交互响应速度,使用户通过点击即可触发目标区域扩散识别,同时通过连续邻接像素扩散方式确保目标区域在空间上的连续性和完整性,减少了非连续像素被误纳入标注区域的情况,降低传统区域选择工具中容易出现的“孤岛效应”,提高目标区域识别效率和标注结果显示效果。

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122530372B_ABST
    Figure CN122530372B_ABST
Patent Text Reader

Abstract

The application discloses a picture labeling method, a picture labeling system, a device and a medium, and belongs to the technical field of picture labeling. The picture labeling method comprises the following steps: in response to a picture uploading operation of a user in an operation control area, obtaining a picture to be labeled; in response to a labeling parameter setting operation of the user in the operation control area, determining a color tolerance parameter, a labeling fill color parameter, a transparency parameter and a border style parameter; in response to a clicking operation of the user on the picture to be labeled, determining a picture pixel position corresponding to the clicking operation; identifying a target region which is similar to a color of a pixel point and continuous according to a color value of the pixel point corresponding to the picture pixel position and the color tolerance parameter; determining a region mask range based on the target region, and determining a labeling frame range from a boundary of the target region; drawing the region mask in the region mask range, and drawing the labeling frame at the labeling frame range. The application can improve the target region identification efficiency and the labeling result display effect.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention belongs to the field of image data annotation technology, specifically relating to an image annotation method, image annotation system, device, and medium. Background Technology

[0002] With the development of artificial intelligence technology, image data annotation has been widely applied in scenarios such as target recognition, image segmentation, industrial inspection, medical image analysis, and construction of training data for autonomous driving. Image annotation typically requires selecting, outlining, filling, classifying, or recording coordinate information of target regions, similar color regions, or specific objects in an image for subsequent model training, data analysis, or manual verification.

[0003] Existing browser-based image annotation tools are typically implemented using HTML Canvas. Their general approach is to draw the original image and user-annotated content on the same canvas, employing a hybrid "original image + annotation" drawing scheme. When users modify annotation colors, transparency, border styles, line widths, or clear annotation content, the system usually needs to redraw the entire original image and all generated annotations. For high-resolution images, large images, or annotation scenarios with frequent interactions, this method results in high rendering overhead, easily leading to page lag, response delays, and low redraw efficiency, thus affecting the smoothness and efficiency of annotation operations.

[0004] In the target region selection process, existing image annotation tools mostly rely on users manually dragging selection boxes or manually drawing boundaries. For image regions with similar colors and continuous distribution, users need to repeatedly adjust the selection range or manually outline the region boundaries, which is cumbersome and inefficient. Although some tools can select regions based on click positions, if pixel access status is not effectively managed during region expansion, problems such as duplicate pixel judgments, low expansion efficiency, and frequent memory allocation can easily occur, thereby increasing the system's computational load and reducing the response speed of region recognition. For annotation tasks that require frequent selection of multiple similar regions or processing large images, the above problems will further affect the timeliness and accuracy of annotation results. Summary of the Invention

[0005] This invention provides an image annotation method, system, device, and medium, aiming to at least partially solve the technical problems in existing image annotation technologies, such as high rendering overhead due to the mixed rendering of the original image and the annotation content, low efficiency in identifying continuous regions with similar colors, repeated pixel judgment during region expansion, and effective management of pixel access status. This invention, by setting an operation control area and an image interaction area in the image annotation interaction page, responds to user image upload operations, annotation parameter setting operations, and click operations on the image to be annotated. Based on the color value and color tolerance parameter of the pixel corresponding to the click position, it identifies target regions with similar colors and continuous continuity, and generates region masks and annotation boxes based on the target regions. This improves the interactive response speed of image region annotation, allowing users to trigger target region diffusion recognition simply by clicking. Simultaneously, by using a continuous adjacent pixel diffusion method, it ensures the spatial continuity and integrity of the target region, reducing the situation where non-contiguous pixels are mistakenly included in the annotation region, mitigating the "island effect" that easily occurs in traditional region selection tools, and improving the efficiency of target region recognition and the display effect of annotation results. To achieve the objectives of this invention, the following technical solutions are adopted: Firstly, an image annotation method includes: An image annotation interactive page is provided, which includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations, and the image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. In response to the user's image upload operation in the operation control area, the system retrieves the image to be labeled and displays the image to be labeled in the image interaction area. In response to the user's annotation parameter setting operation in the operation control area, determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter; In response to a user's click on the image to be labeled, the image pixel position corresponding to the click operation is determined; based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter, a target area that is similar in color to and continuous with the pixel is identified; The region masking range is determined based on the target region, and the annotation box range is determined by the boundary of the target region; the region masking is drawn within the region masking range according to the annotation fill color parameter and the transparency parameter, and the annotation box is drawn within the annotation box range according to the border style parameter, so as to complete the region annotation of the image to be annotated.

[0006] Optionally, based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter, identifying a target region with a similar and continuous color to the pixel includes: Using the pixel corresponding to the image pixel position as the diffusion starting point, and obtaining the base color value of the diffusion starting point; using a breadth-first search method, diffusion is performed from the diffusion starting point to the four neighboring pixels above, below, left, and right; the color difference value between the color value of the adjacent pixel and the base color value is calculated; when the color difference value is not greater than the color tolerance parameter, the corresponding adjacent pixel is included in the target area; the adjacent pixel judgment and diffusion are repeated until there are no adjacent pixels that satisfy the color tolerance parameter.

[0007] Optionally, in the process of responding to the user's image upload operation in the operation control area, obtaining the image to be labeled, and displaying the image to be labeled in the image interaction area, an off-screen canvas invisible to the user is created, and the image to be labeled is drawn onto the off-screen canvas according to a preset scaling ratio, wherein the preset scaling ratio is less than 1; During the identification of the target region, when the width and / or height of the image to be labeled is greater than or equal to a preset size threshold, the original pixel coordinates of the image pixels in the original coordinate system of the image to be labeled are converted into reduced pixel coordinates in the off-screen canvas according to the preset reduction ratio. Using the reduced pixel coordinates as the starting point of off-screen diffusion, a breadth-first search is used to diffuse to the four neighboring pixels in the off-screen canvas to identify the reduced target region with a similar and continuous color to the pixel corresponding to the reduced pixel coordinates. According to the preset reduction ratio, the reduced target region is mapped back to the original coordinate system of the image to be labeled, and the mapped region is determined as the target region. When the width and height of the image to be labeled are both less than the preset size threshold, the image pixel position is used as the diffusion starting point in the original pixel data of the image to be labeled, and the diffusion is carried out to the four neighboring pixels in a breadth-first search manner to identify the target area. In the process of identifying the target region or narrowing the target region using a breadth-first search method, a pre-allocated fixed-size queue is used to store the pixels to be diffused, and an access flag array corresponding to the number of pixels in the image data to be diffused is used to record the pixel access status; the access flag array marks the accessed pixels to avoid the same pixel being judged repeatedly; the fixed-size queue stores and retrieves the pixels to be diffused in the order of breadth-first search. When a pixel is included in the target region, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the target region are updated synchronously to obtain the boundary of the target region during the region recognition process.

[0008] Optionally, in response to a user's image upload operation in the operation control area, obtaining the image to be labeled and displaying the image to be labeled in the image interaction area includes: The image to be labeled is drawn on the original canvas; a mask canvas is created above the original canvas, the mask canvas is set independently of the original canvas, and carries the drawing content of the region mask and the label box; the original pixel data of the image to be labeled is read and cached in memory; the display state of the image to be labeled is initialized, the display state includes the original image size, the current scaling ratio and the canvas offset.

[0009] Optionally, in response to a user's click operation on the image to be labeled, determining the image pixel position corresponding to the click operation includes: Obtain the screen coordinates of the click operation in the image interaction area; combine the current zoom level and canvas offset to perform reverse mapping on the screen coordinates to obtain the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; use the original pixel coordinates as the pixel position of the image; wherein, the original pixel coordinates correspond one-to-one with the original pixel data of the image to be labeled; And / or, the border style parameters include the outer border color, the inner border color, and the border line width; according to the annotation fill color parameters and the transparency parameters, draw an area mask within the area masking range, and according to the border style parameters, draw an annotation box within the annotation box range, including: The pixels within the masked area are drawn onto the mask canvas with the color corresponding to the annotation fill color parameter and the transparency corresponding to the transparency parameter. Draw an outer border within the area of ​​the marked box, using the same color as the outer border, to visually guide the target area. An inner border is drawn inside the outer border, and the inner border uses an inner border color that visually contrasts with the outer border to enhance the boundary recognition of the target area. The border line width is reverse-calculated based on the current scaling ratio to obtain the actual drawn line width, which is equal to the border line width divided by the current scaling ratio. The outer border is drawn according to the actual drawn line width, and the inner border is drawn according to the inner line width which is less than or equal to the actual drawn line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

[0010] Secondly, an image annotation system includes: The page provides a module configured to provide an image annotation interactive page. The image annotation interactive page includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations. The image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. The image acquisition module is configured to respond to the user's image upload operation in the operation control area, acquire the image to be labeled, and display the image to be labeled in the image interaction area; The parameter determination module is configured to respond to the user's annotation parameter setting operation in the operation control area and determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter; The region recognition module is configured to respond to a user's click operation on the image to be labeled, determine the image pixel position corresponding to the click operation, and identify a target region that is similar in color and continuous with the pixel position based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter. The annotation drawing module is configured to determine the area masking range based on the target area, and to determine the annotation frame range by the boundary of the target area; draw the area mask within the area masking range according to the annotation fill color parameter and the transparency parameter, and draw the annotation frame within the annotation frame range according to the border style parameter.

[0011] Optionally, the image annotation system further includes: The canvas management module is configured to draw the image to be annotated on the original canvas and to create a mask canvas above the original canvas. The mask canvas is set independently of the original canvas and carries the drawing content of the area mask and the annotation box. And / or, a pixel caching module is configured to read the raw pixel data of the image to be labeled and cache the raw pixel data in memory; And / or, the region recognition module is further configured to combine the current zoom level and canvas offset to perform reverse mapping of the screen coordinates corresponding to the user click operation, thereby obtaining the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; using a breadth-first search method, the diffusion spreads from the diffusion starting point to the four neighboring pixels, and uses the color difference value and the color tolerance parameter as the pixel inclusion condition to determine the target region; when a pixel is included in the target region, the boundary coordinates of the target region are updated synchronously. And / or, the annotation drawing module is also configured to perform a reverse conversion on the border line width based on the current scaling ratio to obtain the actual drawing line width, wherein the actual drawing line width is equal to the border line width divided by the current scaling ratio; the outer border is drawn according to the actual drawing line width, and the inner border is drawn according to the inner line width which is less than or equal to the actual drawing line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

[0012] Optionally, the image annotation system further includes an interactive control module, which is configured to respond to zoom and / or pan operations performed by a user in the image interactive area. And / or, in response to a user's one-click clear operation in the operation control area, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas; or, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas, and restore the color tolerance parameter, the annotation fill color parameter, the transparency parameter, and the border style parameter to the default annotation configuration parameters.

[0013] Thirdly, an image annotation apparatus includes a processor and a memory, wherein the memory stores a computer program, and when the processor executes the computer program, it executes an image annotation method as described in any of the first aspects above.

[0014] Fourthly, a computer-readable storage medium storing instructions that, when executed on a computer, perform any of the image annotation methods described in the first aspect above.

[0015] Compared with the prior art, the beneficial technical effects of this invention application are as follows: In this invention application, by setting an operation control area and an image interaction area in the image annotation interaction page, the system responds to user image upload operations, annotation parameter setting operations, and click operations on the image to be annotated. Based on the color value and color tolerance parameter of the pixel corresponding to the click position, it identifies target areas with similar and continuous colors, and generates area masks and annotation boxes according to the target areas. This improves the interactive response speed of image area annotation, allowing users to trigger target area diffusion recognition with a click. At the same time, the continuous adjacent pixel diffusion method ensures the spatial continuity and integrity of the target area, reduces the situation where non-contiguous pixels are mistakenly included in the annotation area, reduces the "island effect" that is prone to occur in traditional area selection tools, and improves the target area recognition efficiency and the display effect of annotation results. Attached Figure Description

[0016] To more clearly illustrate the technical solutions in the embodiments of this invention, the drawings used in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this invention. For those skilled in the art, other drawings can be obtained from these drawings without creative effort.

[0017] Figure 1 This is a schematic diagram of the structure of an image annotation method according to an embodiment of this invention. Figure 2This is a schematic diagram of an image annotation interactive page according to an embodiment of this invention. Figure 3 This is a schematic diagram of the composition of an image annotation system according to an embodiment of this invention. The accompanying drawings are provided to further understand the present invention and form part of the specification. They are used together with the embodiments of the present invention to explain the present invention and do not constitute a limitation thereof. Detailed Implementation

[0018] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. All other embodiments obtained by those skilled in the art based on the embodiments of the present invention without creative effort are within the scope of protection of the present invention.

[0019] As shown in the present invention application and claims, unless the context clearly indicates otherwise, the words "a," "an," "an," and / or "the" do not specifically refer to the singular and may also include the plural. Generally speaking, the terms "comprising" and "including" only indicate that explicitly identified steps and elements are included, and "multiple" includes one, two, or more, and these steps and elements do not constitute an exclusive list; the method or apparatus may also include other steps or elements.

[0020] While this application makes various references to certain modules of the system according to embodiments of the present invention, any number of different modules can be used and run on user terminals and / or servers. The modules are merely illustrative, and different aspects of the system and method may use different modules.

[0021] This invention application uses flowcharts to illustrate the operations performed by the system according to embodiments of the invention. It should be understood that the preceding or following operations are not necessarily performed in exact order. Instead, various steps can be processed in reverse order or simultaneously, as needed. Furthermore, other operations can be added to these processes, or one or more steps can be removed from them.

[0022] Hereinafter, exemplary embodiments of the present invention will be described in detail with reference to the accompanying drawings. Obviously, the described embodiments are merely a part of the embodiments of the present invention, and not all of the embodiments of the present invention. It should be understood that the present invention is not limited to the exemplary embodiments described herein.

[0023] It is worth noting that in this invention application, all data acquisition actions are carried out in compliance with the relevant data protection laws and policies of the country where the location is located, and with the authorization granted by the owner of the relevant device.

[0024] Firstly, such as Figure 1 As shown, an image annotation method includes: An image annotation interactive page is provided, which includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations, and the image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. In response to the user's image upload operation in the operation control area, the system retrieves the image to be labeled and displays the image to be labeled in the image interaction area. In response to the user's annotation parameter setting operation in the operation control area, determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter; In response to a user's click on the image to be labeled, the image pixel position corresponding to the click operation is determined; based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter, a target area that is similar in color to and continuous with the pixel is identified; The area masking range is determined based on the target area, and the annotation box range is determined by the boundary of the target area; the area masking is drawn within the area masking range according to the annotation fill color parameter and the transparency parameter, and the annotation box is drawn within the annotation box range according to the border style parameter.

[0025] In some embodiments, the image annotation method can be applied to browser-based image annotation tools, image data processing platforms, artificial intelligence training data annotation platforms, and other electronic devices capable of displaying and interacting with images. The image annotation method can be implemented using HTML pages, Canvas, scripts, and corresponding interactive controls, enabling users to automatically annotate contiguous areas of similar color by uploading images, setting annotation parameters, and clicking on image regions.

[0026] In some embodiments, an image annotation interaction page may be provided first. This page may include an operation control area and an image interaction area. The operation control area may be located at the top, side, or other easily accessible position for user operation on the image annotation interaction page. The image interaction area may be adjacent to the operation control area, or it may be located below the operation control area. The operation control area may be configured to receive user image upload operations and annotation parameter setting operations, while the image interaction area may be configured to display the image to be annotated and receive user click operations on the image.

[0027] In some embodiments, the operation control area may include controls, which can be understood at least as: interface functional elements set in the image annotation interaction page, capable of receiving at least one interactive operation such as user input, selection, clicking, dragging, and switching. For example, controls may include at least one of the following: buttons, file selection boxes, sliders, color pickers, number input boxes, drop-down lists, checkboxes, or other interactive elements capable of parameter input and function triggering. The "control" in this application is not limited to a specific interface form, as long as it can receive user operations and generate corresponding control instructions or annotation parameters.

[0028] For example, the operation control area may include an image upload control, a color tolerance adjustment control, a label fill color setting control, a transparency setting control, and a border style setting control. The image upload control can be an upload button, a file selection box, or a drag-and-drop upload area, used to receive a local image file selected by the user or import an image to be labeled; the color tolerance adjustment control can be a slider, a numeric input box, or a level selection control, used to set the allowed range of color differences during area recognition; the label fill color setting control can be a color picker, a color input box, or a preset color selection button, used to set the display color of the area mask; the transparency setting control can be a slider, a percentage input box, or a transparency level selection control, used to set the transparency level when the area mask is overlaid; the border style setting control can be a color picker, a line width input box, a line type selection box, or a combination thereof, used to set the color, line type, line width, or other display style of the label box.

[0029] In some embodiments, the border style setting control may further include: an outer border color setting control, an inner border color setting control, and a border line width setting control. The outer border color setting control can receive user selections for the outer border color, the inner border color setting control can receive user selections for the inner border color, and the border line width setting control can receive user settings for the annotation box line width. Thus, users can uniformly configure the fill color and transparency of the area mask and the double-border style of the annotation box through the operation control area, enabling the annotation results to adapt to different image backgrounds and different visualization needs.

[0030] In some embodiments, the operation control area may further include a clear control, a reset control, a zoom control, and other auxiliary interactive controls. The clear control can be a one-click clear button, used to trigger the clearing of drawn area masks, annotation boxes, and corresponding annotation status data; the reset control can be used to restore color tolerance parameters, annotation fill color parameters, transparency parameters, and border style parameters to their default annotation configuration parameters; the zoom control can be used to receive user adjustments to the image display ratio. Of course, the clear control and reset control can also be combined into a single clear-reset control, achieving both functions simultaneously. Zooming operations can also be implemented via mouse wheel, touchpad gestures, or touchscreen gestures; this application does not limit this approach.

[0031] In some embodiments, using the image upload control described above, users can perform image upload operations in the operation control area, respond to the image upload operation, obtain the image to be annotated, and display the image to be annotated in the image interaction area. Specifically, the user-uploaded image file can be read, its width, height, pixel data, and file format information can be parsed, and the image to be annotated can be drawn onto the canvas or image display container corresponding to the image interaction area. After the image to be annotated is displayed in the image interaction area, the user can click to annotate the displayed image.

[0032] In some embodiments, by utilizing at least one of the above-described color tolerance adjustment control, annotation fill color setting control, transparency setting control, and border style setting control, a user can perform annotation parameter setting operations in the operation control area. In response to these annotation parameter setting operations, the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter can be determined. Specifically, the color tolerance parameter can be used to control the sensitivity of adjacent pixels being included in the target area during region recognition; the annotation fill color parameter can be used to determine the display color of the region mask; the transparency parameter can be used to determine the transparency effect when the region mask is superimposed on the image to be annotated; and the border style parameter can be used to determine at least one of the annotation box's border color, border line type, border line width, and border display style.

[0033] For example, such as Figure 2 As shown, the image annotation interaction page includes an operation control area at the top and an image interaction area at the bottom. Specifically: the operation control area includes an image upload control, for example, a file selection button or an image selection button, which can be used to receive images uploaded by the user for annotation; a color tolerance adjustment control includes a color tolerance slider, which can be used to adjust the color tolerance parameter when recognizing continuous areas with similar colors; an annotation fill color control includes an annotation fill color selector, which can be used to set the fill color of the area mask; a transparency setting control includes a transparency slider, which can be used to set the transparency level when the area mask is overlaid; an outer border color setting control may include an outer dashed line color selector, which is used to configure the outer border color of the annotation box; an inner border color setting control may include an inner solid line color selector, which can be used to configure the inner border color of the annotation box; and a line width setting control may include a numeric input box, which is used to set the line width of the annotation box border.

[0034] Furthermore, it also includes: a clear control that may include a clear annotation button, used to clear generated area masks and annotation boxes; a zoom control that may include a zoom button or a scroll wheel zoom button, used to adjust the display ratio of the image to be annotated in the image interaction area; and a pan control that may include a pan button or a drag-and-drop pan button, used to adjust the display position of the image to be annotated in the image interaction area. The image interaction area displays user-uploaded images to be annotated, which can be drawn on the original canvas. A mask canvas can be overlaid on top of the original canvas. The mask canvas is set independently of the original canvas and is used to hold annotation content such as area masks and annotation boxes.

[0035] In some embodiments, when a user clicks on an image to be labeled, the system can respond to the user's click and determine the corresponding pixel position in the image. The pixel position can be the pixel coordinates of the click in the original coordinate system of the image, or it can be the position corresponding to the original pixel data of the image after coordinate transformation. By determining the pixel position, subsequent region recognition processes can use the pixel actually clicked by the user as the starting point, thereby ensuring that the labeled area corresponds to the user's intention.

[0036] In some embodiments, after determining the image pixel location, the color value of the pixel corresponding to that location can be obtained. Based on this color value and a color tolerance parameter, a target region with a similar and continuous color to that pixel can be identified. Specifically, the pixel corresponding to the image pixel location can be used as the starting point for region identification. The color value of that pixel can be read as the base color value, and then the color difference between pixels adjacent to the starting point can be judged. If the difference between the color value of an adjacent pixel and the base color value meets the range defined by the color tolerance parameter, then the adjacent pixel can be included in the target region, and the region can continue to expand to its adjacent pixels based on the included pixel. In this way, a target region with a similar color to the user's click location and which is spatially continuous can be gradually obtained.

[0037] In some embodiments, color values ​​may include RGB three-channel color values, or RGBA color values, grayscale values, HSV color values, or other values ​​that can characterize pixel color features. For example, the differences between adjacent pixels and the starting pixel in the red, green, and blue channels can be calculated separately, and these differences across multiple channels can be used as color difference values. When the color difference value is not greater than the color tolerance parameter, the adjacent pixel can be considered to have a similar color to the starting pixel, and thus included in the target area; when the color difference value is greater than the color tolerance parameter, the adjacent pixel can be considered to have a large color difference from the starting pixel, and not included in the target area.

[0038] In some embodiments, after identifying the target region, the region masking range can be determined based on the target region, and the bounding box range can be determined by the boundary of the target region. The target region can be understood as a set of pixels included in the annotation object after color tolerance determination. The region masking range can correspond to this pixel set, so that when the region mask is subsequently drawn, only the pixel positions corresponding to the target region are filled and displayed, without covering pixel positions outside the target region.

[0039] In some embodiments, the bounding box range can be determined by the outer boundary of the target region. Specifically, during the target region identification process, pixels of similar color are searched in four directions: up, down, left, and right. Whenever a pixel is included in the target region, its x-coordinate and y-coordinate in the original coordinate system of the image to be labeled are obtained, and these x-coordinates and y-coordinates are compared with the currently recorded minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate, respectively. If the pixel's x-coordinate is less than the current minimum x-coordinate, the minimum x-coordinate is updated; if the pixel's x-coordinate is greater than the current maximum x-coordinate, the maximum x-coordinate is updated; if the pixel's y-coordinate is less than the current minimum y-coordinate, the minimum y-coordinate is updated; if the pixel's y-coordinate is greater than the current maximum y-coordinate, the maximum y-coordinate is updated.

[0040] For example, if the x-coordinate range of the pixel points in the target region is xmin to xmax and the y-coordinate range is ymin to ymax, then the rectangular area defined by the coordinate points (xmin, ymin) and (xmax, ymax) can be used as the bounding rectangle of the target region, and the bounding rectangle can be defined as the annotation box range. The annotation box range can be used to determine the drawing start point, width, and height of the annotation box. The drawing start point can be determined by the minimum x-coordinate and the minimum y-coordinate, the width can be determined by the difference between the maximum x-coordinate and the minimum x-coordinate, and the height can be determined by the difference between the maximum y-coordinate and the minimum y-coordinate.

[0041] In some embodiments, the region masking range and the bounding box range can have different representations. The region masking range can be the actual set of pixels of the target region, and its shape can be regular or irregular, used to accurately represent the identified areas of similar and continuous color; the bounding box range can be a regular rectangular range surrounding the actual set of pixels, used to visually indicate the overall position, width, and height of the target region. By displaying the region mask and the bounding box simultaneously, both the pixel-level recognition results of the target region can be preserved, and the overall boundary of the target region can be quickly observed by the user.

[0042] In some embodiments, the region masking range and the bounding box range can be obtained synchronously during the target region identification process. That is, when performing pixel diffusion and color difference judgment, the set of pixels included in the target region and the maximum and minimum horizontal and vertical coordinates of the target region can be recorded simultaneously. After the target region identification is completed, the region masking range and the bounding box range can be obtained directly without having to traverse the target region a second time or recalculate the boundary, thereby reducing calculation steps and improving the response speed of region annotation. At the same time, in the process of obtaining the target region, simultaneously determining the region masking range and the bounding box range corresponding to the target region can ensure that the drawing position of the region mask is consistent with the actual identified pixel set, and the bounding box can be displayed around the outer boundary of the target region, avoiding the need for the user to draw the bounding box manually by dragging, thereby improving the automation of the annotation operation and the accuracy of the annotation results.

[0043] In some embodiments, after determining the area to be masked and the bounding box, the area mask can be drawn within the area to be masked according to the fill color parameters and transparency parameters. When drawing the area mask, the positions corresponding to each pixel in the target area can be used as the drawing positions, and the mask color is determined by the fill color parameters, while the transparency parameters determine the degree of overlay transparency between the mask and the image to be labeled. In this way, the area mask can highlight the identified target area. For irregularly shaped target areas, the area mask can cover the actual pixel set of the target area, thereby more accurately reflecting the true range of the identified area.

[0044] In some embodiments, after determining the area masking range and the annotation box range, the annotation box can be drawn within the annotation box range according to the border style parameters. When drawing the annotation box, the boundary coordinates corresponding to the annotation box range can be used as the drawing basis, and the border color, line type, and line width of the annotation box can be determined according to the border style parameters. The annotation box can be drawn around the bounding rectangle of the target area, allowing users to quickly determine the overall position, width, height, and boundary range of the target area in the entire image to be annotated. Compared with only displaying the area mask, the annotation box can provide clearer boundary prompts, making it easier for users to view, compare, and verify the annotation results.

[0045] In some embodiments, region masking and annotation boxes visually represent the target region from two levels: "pixel-level region display" and "overall boundary indication," respectively. Region masking and annotation boxes can be overlaid on the image to be annotated, forming a superimposed display effect of "original image display layer, region masking layer, and annotation box display layer." Region masking can represent the actual pixel set range of the target region, intuitively displaying selected, color-similar, continuous areas; annotation boxes can represent the overall boundary range of the target region, clearly showing its outer boundary and size range. Since both the region masking range and the annotation box range originate from the same target region identification result, they have good consistency. Furthermore, by combining region masking and annotation boxes, the pixel-level identification result and overall boundary information of the target region can be presented to the user simultaneously. This not only reflects the actual shape of the target region but also highlights its overall position and size, allowing the user to more intuitively confirm whether the annotation result matches the expected annotation object.

[0046] For example, the image annotation method of this invention application is used, such as Figure 2As shown, after the user clicks the "Select File" button to upload the image to be annotated, the uploaded image is displayed in the image interaction area. The color tolerance slider is set to a color tolerance parameter of 30 (out of 100), the annotation fill color selector is set to red, the transparency slider is set to a transparency parameter of 65 (out of 100), the outer dashed line color selector is set to white, the inner solid line color selector is set to blue, the border line width is 3 points, the outer border line type is set to dashed by default, and the inner border line type is set to solid by default. The user can click on the target position of the image to be annotated in the image interaction area. Based on the color value of the corresponding pixel at the clicked position and the color tolerance parameter set in the operation control area, adjacent pixels with similar colors and spatial continuity are diffused and identified to obtain the target area. After the target area in the image to be annotated is identified, a red-filled area mask with 65% transparency can be drawn in the mask canvas according to the set annotation fill color and transparency. A white outer border and a blue inner border are drawn according to the boundary of the target area.

[0047] Therefore, in the image annotation method of this invention, the user's image upload operation, annotation parameter setting operation, and click operation can be received through the image annotation interaction page. The target area is identified based on the color value of the pixel corresponding to the click position and the color tolerance parameter. Then, the area mask and annotation box are drawn according to the annotation fill color, transparency, and border style set by the user. In other words, the user only needs to upload the image and set the annotation parameters in the operation control area, and then click the target position in the image to be annotated in the image interaction area to trigger the target area recognition, area mask generation, and annotation box drawing. There is no need to manually drag and repeatedly adjust the selection range, nor is there a need to manually draw the boundary of the target area, thereby reducing the operational complexity of image area annotation and realizing automated image area annotation for user click operations. Furthermore, since the target area is identified based on the color value of the pixel corresponding to the click position and the color tolerance parameter, the recognition result can be made to correspond to the continuous area with similar color clicked by the user. The area mask and annotation box are generated based on the target area, which can make the annotation display result consistent with the actual recognition area, improve the interactive response speed and annotation efficiency of image area annotation, and improve the target area recognition efficiency, the display effect of the annotation result, and the visual recognition.

[0048] Optionally, based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter, identifying a target region with a similar and continuous color to the pixel includes: using the pixel corresponding to the image pixel position as the diffusion starting point and obtaining the base color value of the diffusion starting point; using a breadth-first search method to diffuse from the diffusion starting point to the four neighboring pixels above, below, left, and right; calculating the color difference value between the color value of the adjacent pixel and the base color value; when the color difference value is not greater than the color tolerance parameter, including the corresponding adjacent pixel in the target region; repeating the adjacent pixel judgment and diffusion until there are no adjacent pixels that satisfy the color tolerance parameter.

[0049] In some embodiments, the pixel position corresponding to the user's click operation can be used as the diffusion starting point, and the color value of the pixel corresponding to the diffusion starting point can be obtained from the original pixel data of the image to be labeled. After obtaining the diffusion starting point and the base color value, a breadth-first search can be used to diffuse from the diffusion starting point to neighboring pixels. That is, the diffusion starting point can be added to the queue of pixels to be diffused first, and then the current pixel can be retrieved from the queue, and the four neighboring pixels above, below, left, and right of the current pixel can be obtained. For each of the four neighboring pixels, the color value of the four neighboring pixels can be obtained, and the color difference value between the color value of the four neighboring pixels and the base color value can be calculated. The color difference value can be used to characterize the degree of color similarity between the neighboring pixels and the pixel corresponding to the diffusion starting point.

[0050] Understandably, by employing a breadth-first search approach for region diffusion, the system can use the user-clicked pixel as the center and progressively determine whether its spatially adjacent pixels meet the color similarity requirement. Only pixels that simultaneously satisfy the condition of having a color difference value no greater than the color tolerance parameter and being adjacent to already included pixels are included in the target region. This avoids incorrectly including spatially discontinuous, isolated pixel regions in the same labeled area simply because of color similarity, thus ensuring the spatial continuity of the identified target region.

[0051] In some embodiments, preferably, the color difference value can be determined based on the RGB three-channel difference. For example, the difference between the adjacent pixel and the base color value in the red, green, and blue channels can be calculated separately, and the sum of the absolute values ​​of the three channel differences can be used as the color difference value; alternatively, the sum of the squares, weighted sum, or other color distance calculation results of the three channel differences can be used as the color difference value. A color tolerance parameter can be used as a threshold for determining whether a pixel is included in the target region. When the color difference value is not greater than the color tolerance parameter, the adjacent pixel is considered to have a similar color to the pixel corresponding to the diffusion start point, and the adjacent pixel is included in the target region; when the color difference value is greater than the color tolerance parameter, the adjacent pixel is considered to have a large color difference from the pixel corresponding to the diffusion start point, and the adjacent pixel is not included in the target region.

[0052] In some embodiments, once a neighboring pixel is included in the target region, it can be further added to the queue of pixels to be diffused, allowing it to continue to diffuse as the new current pixel to its four neighboring pixels above, below, left, and right during the subsequent diffusion process. Thus, the region identification process can expand outwards layer by layer from the diffusion starting point, rather than only judging the limited number of pixels around the diffusion starting point, thereby enabling the identification of target regions that are similar in color to the diffusion starting point and spatially continuous.

[0053] In some embodiments, the operations of pixel extraction, acquisition of four neighboring pixels, calculation of color difference value, color tolerance judgment, and pixel inclusion can be repeatedly performed until the pixel queue to be diffused is empty, or until there are no adjacent pixels that meet the color tolerance parameter. When the pixel queue to be diffused is empty, it means that there are no pixels that can continue to diffuse outwards. At this time, the set of pixels that have been included can be determined as the target region. Thus, the target region can be composed of consecutive adjacent pixels that start from the diffusion starting point and meet the color tolerance condition.

[0054] Furthermore, the color tolerance parameter can be set by the user in the operation control area. When the color tolerance parameter is small, adjacent pixels need to be closer to the base color value to be included in the target area, and the diffusion range of the target area is relatively small, which is suitable for scenarios with obvious boundary color differences or requiring fine annotation. When the color tolerance parameter is large, the system allows for greater color differences between adjacent pixels and the base color value, and the diffusion range of the target area is relatively large, which is suitable for color gradient areas, areas with lighting changes, or annotation scenarios requiring more lenient recognition. Thus, users can control the sensitivity of region recognition by adjusting the color tolerance parameter.

[0055] Therefore, by taking the pixel corresponding to the user's click location as the diffusion starting point, and using the basic color value and color tolerance parameter of the diffusion starting point as the pixel inclusion condition, the breadth-first search method is used to recursively diffuse to the four neighboring pixels. This can automatically obtain the target area that is similar in color and spatially continuous to the user's click location. This can reduce the user's manual selection or drawing of the area boundary, improve the recognition efficiency of similar color continuous areas, and make the marked area more consistent with the actual image area corresponding to the user's click location.

[0056] Optionally, in the process of responding to the user's image upload operation in the operation control area, obtaining the image to be labeled, and displaying the image to be labeled in the image interaction area, an off-screen canvas invisible to the user is created, and the image to be labeled is drawn onto the off-screen canvas according to a preset scaling ratio, wherein the preset scaling ratio is less than 1; During the identification of the target region, when the width and / or height of the image to be labeled is greater than or equal to a preset size threshold, the original pixel coordinates of the image pixels in the original coordinate system of the image to be labeled are converted to reduced pixel coordinates in the off-screen canvas according to the preset reduction ratio. Using the reduced pixel coordinates as the starting point for off-screen diffusion, a breadth-first search is used to diffuse to the four neighboring pixels in the off-screen canvas to identify a continuous reduced target region with a color similar to the pixel corresponding to the reduced pixel coordinates. According to the preset reduction ratio, the reduced target region is mapped back to the original coordinate system of the image to be labeled, and the mapped region is determined as the target region. When the width and height of the image to be labeled are both less than the preset size threshold, the original pixel data of the image to be labeled... Using the image pixel position as the diffusion starting point, a breadth-first search is employed to diffuse to the four neighboring pixels to identify the target region. During the breadth-first search process for identifying the target region or narrowing the target region, a pre-allocated fixed-size queue stores the pixels to be diffused, and an access flag array corresponding to the number of pixels in the image data being diffused records the pixel access status. The access flag array marks visited pixels to avoid the same pixel being repeatedly judged. The fixed-size queue stores and retrieves pixels to be diffused sequentially according to the breadth-first search order. When a pixel is included in the target region or narrowing the target region, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the corresponding region are synchronously updated to obtain the boundary of the corresponding region during the region identification process.

[0057] In this invention application, the applicant discovered that when the image to be labeled is a 4K, 8K, industrial inspection image, medical image, or other large-size image, directly performing a breadth-first search based on the original pixel data may require accessing and judging a large number of pixels, easily resulting in high computational overhead and response latency. Therefore, an off-screen canvas invisible to the user can be created during the image loading stage, and the image to be labeled can be drawn onto the off-screen canvas according to a preset scaling ratio, for subsequent rapid region recognition in large image scenarios. Specifically: For example, during the loading process of the image to be labeled, the original image size of the image to be labeled can be obtained, and it can be determined whether the subsequent region recognition process needs to use an off-screen canvas for scaled-down recognition based on the original image size. For example, the original image size may include the width and height of the image to be labeled. The preset size threshold can be 8000 pixels, or it can be set according to device performance, image type, browser operating environment, labeling accuracy requirements, etc., and this application does not limit it in this respect.

[0058] In some embodiments, the off-screen canvas can be a Canvas that is not directly displayed in the image annotation interaction page, or it can be an off-screen rendering object, a memory canvas, or other image processing object capable of carrying scaled-down image data. The off-screen canvas can be set independently of the original canvas and the mask canvas. The original canvas can be used to display the image to be annotated, the mask canvas can be used to display the region mask and annotation boxes, and the off-screen canvas can be used to perform scaled-down target region recognition in large image scenarios. Therefore, the off-screen canvas does not affect the user's observation of the image to be annotated and the annotation results in the image interaction area, but it can provide scaled-down image data for background region recognition.

[0059] In some embodiments, the preset scaling ratio can be less than 1. For example, the preset scaling ratio can be 0.1, 0.2, 0.25, 0.3, 0.4, 0.5, 0.6, 0.75, 0.8, 0.9, 0.95, etc. Taking 0.25 as an example, the image to be labeled is drawn on the off-screen canvas at one-quarter of its original width and original height. If the original width of the image to be labeled is W and the original height is H, and the preset scaling ratio is S, then the width of the off-screen canvas can be W×S, and the height of the off-screen canvas can be H×S. Thus, by scaling down, the number of pixels in the off-screen canvas can be significantly reduced, thereby reducing the number of pixels to be accessed in the subsequent breadth-first search process and improving the region recognition speed of large-size images.

[0060] In some embodiments, when a user clicks on an image to be annotated in the image interaction area, the screen coordinates corresponding to the click operation can be reverse-mapped to the original pixel coordinates in the original coordinate system of the image to be annotated based on the current scaling ratio and canvas offset. These original pixel coordinates can be used as the image pixel position. When the width and / or height of the image to be annotated is greater than or equal to a preset size threshold, the image pixel position can be converted into reduced pixel coordinates in the off-screen canvas according to a preset scaling ratio. For example, if the image pixel position in the original coordinate system of the image to be annotated is (x, y), and the preset scaling ratio is S, then the reduced pixel coordinates in the off-screen canvas can be (x×S, y×S). Thus, the user's click position in the original image display state can maintain a correspondence with the reduced image position in the off-screen canvas.

[0061] In some embodiments, after obtaining the reduced pixel coordinates, these coordinates can be used as the starting point for off-screen diffusion. A breadth-first search is then employed in the off-screen canvas to diffuse upwards, downwards, leftwards, and rightwards to identify continuous, reduced target regions with colors similar to the pixels corresponding to the reduced pixel coordinates. Specifically, the base color value of the pixel corresponding to the off-screen diffusion starting point can be obtained, and the color difference between the color values ​​of adjacent pixels and this base color value can be calculated. Similarly, the color difference can also be determined based on the RGB three-channel difference. When the color difference is not greater than the color tolerance parameter, the corresponding adjacent pixel can be included in the reduced target region, and diffusion continues to extend to its four neighboring pixels based on this adjacent pixel until no adjacent pixels satisfy the color tolerance parameter are found. Since this process is performed in the reduced off-screen canvas, the number of pixels processed by the diffusion search is small, improving the target region recognition efficiency in large-size image scenarios.

[0062] In some embodiments, after identifying the reduced target region in the off-screen canvas, the reduced target region can be mapped back to the original coordinate system of the image to be labeled according to a preset reduction ratio, and the mapped region is determined as the target region. For example, if the coordinates of a pixel in the reduced target region are (xs, ys), and the preset reduction ratio is S, then the coordinates of this pixel after mapping back to the original coordinate system of the image to be labeled can be (xs / S, ys / S). Correspondingly, if the boundary range corresponding to the reduced target region is (xsmin, ysmin) to (xsmax, ysmax), then the boundary range after mapping back to the original coordinate system of the image to be labeled can be (xsmin / S, ysmin / S) to (xsmax / S, ysmax / S). Thus, although the target region identification process is performed in the off-screen canvas, the final target region can still be returned to the original coordinate system of the image to be labeled, facilitating subsequent determination of the region masking range and the annotation box range based on the target region.

[0063] In some embodiments, when the width and height of the image to be labeled are both smaller than a preset size threshold, downsizing recognition can be performed without using an off-screen canvas. Instead, the image's pixel position is used as the starting point for diffusion, and a breadth-first search is employed to diffuse to the four neighboring pixels in the original pixel data of the image to identify the target region. In other words, for images with small sizes or few pixels, region recognition can be performed directly based on the original pixel data to avoid potential loss of boundary details during downsizing. For larger images, downsizing recognition can be performed using an off-screen canvas to reduce computational load. Therefore, different region recognition paths can be selected based on the size of the image to be labeled, achieving a better balance between recognition efficiency and labeling accuracy.

[0064] Therefore, in this invention, when the image to be labeled is large, the image is scaled down using an off-screen canvas before breadth-first search, which reduces the number of pixels involved in diffusion determination. When the image to be labeled is small, diffusion recognition is performed directly based on the original pixel data, preserving the original pixel-level recognition accuracy. This reduces redundant processing in region identification and boundary calculation, improving the efficiency of target region identification and bounding box generation.

[0065] In some embodiments, before identifying or narrowing down the target region using a breadth-first search approach, a fixed-size queue and an access marker array can be pre-allocated based on the number of pixels in the image data from which diffusion will be performed. The image data from which diffusion will be performed can be the original pixel data of the image to be labeled, or it can be scaled-down image data from an off-screen canvas. The fixed-size queue can be used to store pixels to be diffused, and the access marker array can be used to record whether each pixel has been accessed or determined. Since the fixed-size queue and access marker array can be allocated before region identification begins, there is no need to frequently create new arrays, sets, or temporary objects during subsequent diffusion, thereby reducing the number of memory allocations and minimizing diffusion jitter during the region diffusion process.

[0066] In some embodiments, the capacity of the fixed-size queue can be matched to the number of pixels in the image data to be diffused. For example, if diffusion is performed on the original pixel data of the image to be labeled, and the width of the image to be labeled is W and the height is H, then the number of pixels in the image data to be diffused can be W×H; if diffusion is performed on an off-screen canvas, and the width of the off-screen canvas is Ws and the height is Hs, then the number of pixels in the image data to be diffused can be Ws×Hs. The capacity of the fixed-size queue can be set to the number of pixels in the image data to be diffused, or set to a capacity not less than the maximum possible number of pixels in the target area. The fixed-size queue can use a head pointer and a tail pointer to enqueue and dequeue pixels to be diffused. When a pixel meets the color tolerance parameter and is included in the target area or the target area is reduced, the pixel coordinates or pixel index corresponding to that pixel can be written to the tail of the queue; when further diffusion is needed, the current pixel can be retrieved from the head of the queue, and the four neighboring pixels above, below, left, and right of the current pixel can be judged. Thus, the fixed-size queue can store and retrieve pixels to be diffused sequentially in a breadth-first search order.

[0067] In some embodiments, the access marker array can correspond one-to-one with the number of pixels in the image data undergoing diffusion. That is, each pixel in the image data undergoing diffusion can have a corresponding marker bit in the access marker array. For example, the two-dimensional coordinates of a pixel can be converted into a one-dimensional index, such as representing the pixel index corresponding to the x-coordinate and y-coordinate as y×W+x, where W can be the width of the image data currently undergoing diffusion. When diffusion is performed on an off-screen canvas, W can be the width of the off-screen canvas; when diffusion is performed on the original pixel data, W can be the original width of the image to be labeled. Using this pixel index, it is possible to quickly query whether a corresponding pixel has been accessed in the access marker array, and also to quickly update its access status after a pixel has been accessed.

[0068] In some embodiments, when the system determines whether a neighboring pixel needs to be included in the target region or the target region needs to be reduced, it can first query the access status of the neighboring pixel in the access marker array. If the access marker array indicates that the neighboring pixel has been accessed, the neighboring pixel can be skipped, and the color value reading, color difference value calculation, and enqueue judgment will not be repeated. If the access marker array indicates that the neighboring pixel has not been accessed, it can be marked as accessed, and the color difference value between the color value of the neighboring pixel and the base color value can be further calculated. This avoids the same pixel being repeatedly judged when scanned from different directions, reducing redundant calculations.

[0069] In some embodiments, for adjacent pixels that meet the color tolerance parameters, the adjacent pixels can be included in the target region or the target region can be reduced, and the adjacent pixels can be added to a fixed-size queue so that subsequent diffusion can continue from that pixel to its four neighboring pixels. For adjacent pixels that do not meet the color tolerance parameters, they can be excluded from the target region or the target region can be reduced, and they can not be added to the fixed-size queue, but their visited status can still be recorded by an access marker array to avoid repeated judgments on that pixel in the future. Thus, the region identification process can reduce invalid judgments while ensuring continuous diffusion.

[0070] In some embodiments, when a pixel is included in the target region or the target region is reduced, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the corresponding region can be updated synchronously. Specifically, when diffusion is performed in the original pixel data of the image to be labeled, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the target region in the original coordinate system of the image to be labeled can be updated synchronously; when diffusion is performed in an off-screen canvas, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the reduced target region in the off-screen canvas coordinate system can be updated synchronously, and after the reduced target region is mapped back to the original coordinate system of the image to be labeled, the corresponding boundary of the target region in the original coordinate system of the image to be labeled is obtained.

[0071] In some embodiments, by updating the boundary coordinates of the corresponding region while pixels are incorporated into or reduced within the target region, the boundary of the corresponding region can be obtained synchronously upon completion of region recognition. That is, when the fixed-size queue is empty or there are no adjacent pixels satisfying the color tolerance parameter, the pixel set of the target region or the reduced target region has been determined, and the boundary coordinates of the corresponding region have also been determined synchronously. Thus, the bounding box range can be further determined by synchronously updating the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate. For example, the upper left corner of the bounding box can be determined by the minimum x-coordinate and minimum y-coordinate, the lower right corner by the maximum x-coordinate and maximum y-coordinate, the width by the difference between the maximum and minimum x-coordinates, and the height by the difference between the maximum and minimum y-coordinates. In this way, the bounding box range can be directly determined by the maximum and minimum x- and y-coordinates of the boundary recorded during the region diffusion process, ensuring that the bounding box corresponds to the outer boundary of the target region.

[0072] Therefore, in this invention application, by using a pre-allocated fixed-size queue to store the pixels to be diffused, frequent dynamic memory allocation during the region diffusion process can be avoided; by using an access marker array to record the pixel access status, the same pixel can be avoided being read, judged, or enqueued multiple times; by synchronously updating the boundary coordinates when a pixel is included in the target region or the target region is shrunk, the boundary of the target region can be obtained while the target region identification is completed.

[0073] Therefore, this invention constructs a collaborative mechanism that integrates off-screen canvas scaling and recognition, fixed-size queues, access marker arrays, and synchronous update of boundary coordinates. This mechanism makes the target region recognition process more stable and efficient. The off-screen canvas can reduce the pixel scale of the diffusion search in large image scenarios. The fixed-size queue can ensure the pixel diffusion order in the breadth-first search process. The access marker array can reduce the computational overhead caused by repeatedly judging pixels. The maximum and minimum horizontal and vertical coordinates of the boundary can be updated synchronously when a pixel is included in the target region or the target region is scaled down, so that the boundary of the target region can be obtained synchronously with the region recognition process. This can improve the response speed and overall processing efficiency of the image annotation process.

[0074] Optionally, responding to a user's image upload operation in the operation control area, obtaining the image to be labeled, and displaying the image to be labeled in the image interaction area includes: drawing the image to be labeled on the original canvas; establishing a mask canvas above the original canvas, the mask canvas being set independently of the original canvas and carrying the drawing content of the area mask and the labeling box; reading the original pixel data of the image to be labeled and caching the original pixel data in memory; initializing the display state of the image to be labeled, the display state including the original image size, the current scaling ratio, and the canvas offset.

[0075] In some embodiments, when a user performs an image upload operation in the operation control area, the system can respond to the image upload operation, retrieve the image to be labeled selected or imported by the user, and load and parse the image to be labeled. The image to be labeled can be an image file uploaded locally by the user, or image data obtained through a network address, data interface, or other image input methods. After the image to be labeled is successfully loaded, the original image size can be obtained. The original image size can include the image width and image height, and this original image size can be used as the basis data for subsequent pixel coordinate mapping, region recognition, and annotation box drawing.

[0076] In some embodiments, the image to be annotated can be drawn on the original canvas. The original canvas can serve as the base display layer for the image to be annotated, carrying its image content. For example, the original canvas can be an HTMLCanvas, or any other drawing layer or display container capable of displaying image content in the image interaction area. After the image to be annotated is drawn on the original canvas, the user can observe the image in the image interaction area and perform interactive operations such as clicking, zooming, and panning based on the image.

[0077] In some embodiments, a mask canvas can be created above the original canvas. The mask canvas can be set up independently of the original canvas and overlaid on the original canvas in the image interaction area. The original canvas can hold the image to be annotated, while the mask canvas can hold the area mask and annotation boxes, etc. In other words, the content to be annotated and the annotation content can be held by different canvases, allowing the annotation results, such as the area mask and annotation boxes, to be displayed overlaid on the image to be annotated.

[0078] In some embodiments, the mask canvas may have the same or corresponding display size, scaling state, and offset state as the original canvas to ensure that the region mask and annotation box in the mask canvas can maintain positional correspondence with the image to be annotated in the original canvas. For example, when the image to be annotated is scaled and / or translated in the image interaction area, the original canvas and the mask canvas can use the same scaling ratio and canvas offset for display transformation, so that the annotation content can change synchronously with the image to be annotated.

[0079] Correspondingly, by drawing the image to be annotated on the original drawing canvas and creating an independent masking canvas above the original drawing canvas, the display content of the image to be annotated and the annotation content such as the area mask and annotation box can be carried in layers. The original drawing canvas mainly maintains the basic display of the image to be annotated, while the masking canvas mainly carries the annotation results generated later. This avoids the annotation content and the original image content being mixed in the same drawing layer, which would lead to complex display logic and increase the burden of annotation redrawing. In some embodiments, after acquiring the image to be labeled, the raw pixel data of the image can also be read and cached in memory. The raw pixel data may include the color values ​​of each pixel in the image to be labeled, such as RGB three-channel color values ​​or RGBA four-channel color values. After caching the raw pixel data in memory, when performing target region recognition subsequently, the pixel color values ​​can be read directly based on the cached raw pixel data, without needing to reread the pixel data of the entire image from the display canvas every time a label is clicked. Therefore, reading and caching the raw pixel data of the image to be labeled can improve the response speed of recognizing contiguous regions with similar colors.

[0080] In some embodiments, the raw pixel data can maintain a correspondence with the original coordinate system of the image to be labeled. For example, a pixel in the image to be labeled with an x-coordinate and a y-coordinate can be located to its corresponding color value in the raw pixel data using a pixel index. Therefore, after determining the image pixel position based on the user's click location, the raw pixel data can be quickly accessed based on that pixel position, and the color value of the corresponding pixel can be obtained for use in the target region identification process.

[0081] In some embodiments, after the image to be labeled is loaded, its display state can be initialized. The display state can include the original image size, the current scaling factor, and the canvas offset. The original image size represents the width and height of the image to be labeled in the original coordinate system; the current scaling factor represents the degree of scaling of the image to be labeled within the image interaction area; and the canvas offset represents the display offset position of the image to be labeled relative to the image interaction area. Therefore, by initializing the original image size, the current scaling factor, and the canvas offset, a correspondence between the image display state and the original image coordinate system can be established. This provides basic parameters for subsequent coordinate reverse mapping, scaling, panning, and alignment of labeled content, ensuring that when a user zooms, pans, or clicks on the image to be labeled, the user's operation position is accurately mapped to the original image's pixel position, reducing click position deviations caused by display scaling or canvas offset.

[0082] Therefore, the original canvas, mask canvas, original pixel data cache, and display state initialization work together to provide an accurate data foundation for determining the click position and identifying continuous areas with similar colors. On the other hand, they provide a stable display foundation for the superimposed display of area masks and annotation boxes. This ensures that the image annotation process maintains good coordinate consistency, display consistency, and interactive smoothness in the image interaction area, providing a good foundation for the accuracy and efficiency of target area recognition, area mask drawing, and annotation box drawing.

[0083] Optionally, in response to a user's click operation on the image to be labeled, determining the image pixel position corresponding to the click operation includes: obtaining the screen coordinates of the click operation in the image interaction area; performing a reverse mapping on the screen coordinates by combining the current zoom ratio and canvas offset to obtain the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; and using the original pixel coordinates as the image pixel position; wherein the original pixel coordinates correspond one-to-one with the original pixel data of the image to be labeled. And / or, the border style parameters include the outer border color, the inner border color, and the border line width; according to the annotation fill color parameters and the transparency parameters, draw an area mask within the area masking range, and according to the border style parameters, draw an annotation box within the annotation box range, including: The pixels within the masked area are drawn onto the mask canvas with the color corresponding to the annotation fill color parameter and the transparency corresponding to the transparency parameter. Draw an outer border within the area of ​​the marked box, using the same color as the outer border, to visually guide the target area. An inner border is drawn inside the outer border, and the inner border uses an inner border color that visually contrasts with the outer border to enhance the boundary recognition of the target area. The border line width is reverse-calculated based on the current scaling ratio to obtain the actual drawn line width, which is equal to the border line width divided by the current scaling ratio. The outer border is drawn according to the actual drawn line width, and the inner border is drawn according to the inner line width which is less than or equal to the actual drawn line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

[0084] In this invention application, when a user clicks on an image to be annotated in the image interaction area, the screen coordinates of that click in the image interaction area can be obtained. The screen coordinates can be the coordinate positions of a mouse click event, a touch click event, or other pointer events within the image interaction area. Since the image to be annotated may be in a scaled or panned display state within the image interaction area, the screen coordinates are usually not directly equivalent to the pixel coordinates in the original coordinate system of the image to be annotated; they need to be converted by considering the current scaling ratio and canvas offset.

[0085] In some embodiments, the screen coordinates can be reverse-mapped by combining the current zoom level and the canvas offset to obtain the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled. For example, the translation effect of the image to be labeled relative to the image interaction area can be eliminated first based on the canvas offset, and then the scaling effect of the image to be labeled can be eliminated based on the current zoom level, thereby converting the user's click position in the display view into a pixel position at the original image size. Therefore, even if the image to be labeled is enlarged, reduced, or panned, the original pixel position of the user's actual click can be determined.

[0086] In some embodiments, after obtaining the original pixel coordinates, these coordinates can be used as the image pixel positions, which can correspond one-to-one with the original pixel data of the image to be labeled. For example, the pixel index in the original pixel data can be determined using the x and y coordinates of the original pixel coordinates, and the color value of the corresponding pixel can be read based on this index. This allows the subsequent target region identification process to be performed based on the original pixel data of the image to be labeled, rather than on the scaled display image, thus ensuring that the region identification result remains consistent with the original image pixels.

[0087] In some embodiments, boundary checks can be performed on the original pixel coordinates before using them as image pixel positions. When the original pixel coordinates are within the original image size range of the image to be labeled, they can be used as valid image pixel positions; when the original pixel coordinates exceed the original image size range, the click operation can be ignored, or the original pixel coordinates can be restricted to the boundary range of the image to be labeled. This avoids triggering abnormal region recognition processes when the user clicks outside the image display area or in a blank area of ​​the canvas.

[0088] Understandably, by mapping the screen coordinates in the image interaction area back to the original pixel coordinates in the original coordinate system of the image to be labeled, the user's click operation can be accurately correlated with the original pixel data of the image to be labeled. This way, when subsequently expanding the region based on the color value of the pixel corresponding to the image's pixel position, the original pixel corresponding to the user's true intention can be used as the starting point for expansion, thereby improving the accuracy of target region identification.

[0089] In some embodiments, border style parameters may include outer border color, inner border color, and border line width. Further, border style parameters may also include outer border line type and / or inner border line type. The outer border color determines the display color of the outer border, the inner border color determines the display color of the inner border, and the border line width determines the base line width of the annotation box. The outer and inner border line types can be selected and set by the user or preset by the system. The above border style parameters can be set by the user through the operation control area or by using default annotation configuration parameters.

[0090] In some embodiments, after determining the area masking range, the pixels within the area masking range can be drawn onto the masking canvas using the color corresponding to the annotation fill color parameter and the transparency parameter corresponding to the transparency. The area masking range can correspond to the actual pixel set of the target area, so the area mask can be displayed on the image to be annotated according to the actual shape of the target area. By setting the transparency parameter, the area mask can highlight the target area while preserving the underlying image information of the image to be annotated, allowing the user to observe the annotated covered area and the original image content.

[0091] In some embodiments, after determining the scope of the annotation box, an outer border can be drawn within the scope of the annotation box. The outer border can be drawn using an outer border color and can be displayed according to the rectangular boundary or other boundary range corresponding to the scope of the annotation box. The outer border can be used to create visual guidance for the target area, enabling users to quickly identify the approximate location and outer range of the annotated area, which is especially suitable for scenarios where the color of the target area is close to the background color or the area mask has high transparency.

[0092] In some embodiments, an inner border can also be drawn inside the outer border. The inner border can use an inner border color that visually contrasts with the outer border. For example, when the outer border uses a lighter color, the inner border can use a darker color; when the outer border uses a darker color, the inner border can use a lighter color. By displaying the outer and inner borders in combination, the visibility and recognizability of the annotation box boundaries can be enhanced against complex image backgrounds.

[0093] In some embodiments, the outer border and the inner border can use different line types. For example, the outer border can be a dashed border and the inner border can be a solid border; or, the outer border can be a solid border and the inner border can be a dashed border; or, both the outer border and the inner border can be solid borders, dashed borders, dotted-dash borders, or other line types that can distinguish the boundaries. This application does not limit the specific line types of the outer border and the inner border, as long as they can work together to improve the visibility of the target area boundary.

[0094] In some embodiments, the inner border can be located inside the outer border, and the line width of the inner border can be less than or equal to the line width of the outer border. Preferably, the line width of the inner border can be less than the line width of the outer border. In this way, the outer border can provide a more obvious area indication, while the inner border can further enhance the boundary contour, allowing users to more clearly distinguish the annotation boundaries from the original image content when observing the annotation results. Thus, the double-layered border can simultaneously serve both visual guidance and boundary identification.

[0095] In some embodiments, when drawing the outer and inner borders, the border line width can be calculated in reverse based on the current scaling ratio to obtain the actual drawn line width. Specifically, the actual drawn line width can be equal to the border line width divided by the current scaling ratio. The border line width can be the line width set by the user through the border line width setting control. For example, when the border line width is set to 3 points and the current scaling ratio is 2, the actual drawn line width can be 1.5 points; when the border line width is set to 3 points and the current scaling ratio is 0.5, the actual drawn line width can be 6 points. In this way, although the display ratio of the image to be annotated in the image interaction area changes, the visual thickness of the annotation box observed by the user can remain relatively consistent, avoiding the border appearing too thick when zoomed in or too thin when zoomed out.

[0096] In some embodiments, the outer border can be drawn according to the actual drawn line width, and the inner border can be drawn according to an inner line width less than or equal to the actual drawn line width. The inner line width can be determined based on the actual drawn line width according to a preset ratio, such as one-half, two-thirds, or other ratios of the actual drawn line width; the inner line width can also be determined based on preset rules. Thus, the outer border and the inner border can maintain a coordinated visual display effect at different scaling levels.

[0097] In some embodiments, by drawing the region mask onto a separate mask canvas and drawing outer and inner borders within the annotation box area, the pixel-level range and overall boundary range of the target region can be visualized simultaneously. The region mask can display the actual coverage area of ​​the target region, the outer border can provide clear visual guidance, the inner border can enhance boundary recognition, and the reverse line width conversion can ensure consistent visual thickness of the annotation box at different scaling levels.

[0098] In other embodiments, alternatively, the double-border style of the annotation box can also adopt a different hierarchical configuration than that in the aforementioned embodiments. For example, the outer border can be a dashed border, and the inner border can be a solid border; or, the outer border can be a solid border, and the inner border can be a dashed border. When the outer border is a solid border and the inner border is a dashed border, an outer solid border can be drawn first within the annotation box area, and the outer solid border can use the outer border color to form a stable outline indication of the target area's outer boundary; then, an inner dashed border can be drawn inside the outer solid border, and the inner dashed border can use the inner border color to provide auxiliary visual guidance for the target area.

[0099] Of course, the dashed and solid lines of the double-layer border are not limited to fixed inner and outer layer positions, and the colors of the outer and inner borders are not limited to corresponding to a fixed line type. Depending on the image background, user preferences, or annotation display requirements, the line types, colors, and line widths of the outer and inner borders can be interchanged or combined. Any implementation that enhances the visibility and recognizability of the target area boundary through the superposition of different line types, colors, or line widths can be considered an optional embodiment of this invention.

[0100] In this invention application, by performing reverse mapping on the click coordinates, it can be ensured that the starting point of the target area identification accurately corresponds to the original pixel data of the image to be labeled; by drawing the area mask, outer border and inner border in the mask canvas, and performing reverse conversion on the border line width according to the current scaling ratio, the positional accuracy, boundary recognition and scaling display consistency of the labeling results can be improved, thereby improving the visualization effect and interactive experience of image area labeling.

[0101] Secondly, such as Figure 3 As shown, an image annotation system, which may or may not employ any of the image annotation methods described in the first aspect above, includes: The page provides module 100, which is configured to provide an image annotation interactive page. The image annotation interactive page includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations. The image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. Image acquisition module 200 is configured to respond to the user's image upload operation in the operation control area, acquire the image to be labeled, and display the image to be labeled in the image interaction area; The parameter determination module 300 is configured to respond to the user's annotation parameter setting operation in the operation control area and determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter. The region recognition module 400 is configured to respond to a user's click operation on the image to be labeled, determine the image pixel position corresponding to the click operation, and identify a target region that is similar in color and continuous with the pixel position based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter. The annotation drawing module 500 is configured to determine the area masking range based on the target area, and to determine the annotation frame range by the boundary of the target area; to draw the area mask within the area masking range according to the annotation fill color parameter and the transparency parameter, and to draw the annotation frame within the annotation frame range according to the border style parameter.

[0102] In some embodiments, the image annotation system of this application can also be used as a standalone image annotation tool, or it can be applied to browser-based image annotation tools, image data processing platforms, artificial intelligence training data annotation platforms, or other electronic devices capable of image display, parameter configuration, and click interaction. The image annotation system can be implemented through software programs, web page programs, browser scripts, Canvas drawing units, image processing components, or combinations of the above structures. Exemplarily, the image annotation system can be deployed in personal computers, servers, tablet computers, mobile terminals, or other electronic devices with image display and data processing capabilities; this application does not limit this.

[0103] In some embodiments, the page providing module 100 can generate or load an image annotation interactive page, the image acquisition module 200 can cooperate with the image upload control provided by the page providing module 100, the parameter determination module 300 can determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter, the region recognition module 400 can respond to the user's click operation on the image to be annotated, determine the image pixel position corresponding to the click operation, and can identify the target region based on the color value of the pixel corresponding to the image pixel position and the color tolerance parameter, the annotation drawing module 500 can determine the region mask range based on the target region obtained by the region recognition module 400, and determine the annotation box range by the boundary of the target region. The region mask range can correspond to the actual pixel set in the target region, and the annotation box range can be determined by the outer boundary of the target region. The region mask range can be used to draw the region mask, and the annotation box range can be used to draw the annotation box. The annotation drawing module 500 can also draw the region mask within the region mask range according to the annotation fill color parameter and transparency parameter. The region mask can cover the pixel position corresponding to the target region to highlight the selected continuous area with similar colors. Since region masking can have transparency, it can highlight the target area while retaining some visibility of the underlying image content of the image to be labeled. The labeling drawing module 500 can also draw the label box within the label box range according to the border style parameters.

[0104] In some embodiments, the page providing module 100, image acquisition module 200, parameter determination module 300, region recognition module 400, and annotation drawing module 500 can be independent software functional modules, or they can be integrated into the same image annotation program, web page script, front-end component, image processing component, or browser application. These modules can interact with each other through function calls, event listeners, state management objects, shared data caching, or other software communication methods. For example, the image acquisition module 200 can provide the image to be annotated and its original pixel data to the region recognition module 400; the parameter determination module 300 can provide color tolerance parameters, annotation fill color parameters, transparency parameters, and border style parameters to the region recognition module 400 and the annotation drawing module 500; and the region recognition module 400 can provide the target region, region boundary, or pixel set to the annotation drawing module 500.

[0105] In some embodiments, the configuration of the page providing module 100, the image acquisition module 200, the parameter determination module 300, the region recognition module 400, and the annotation drawing module 500 can be found in the same or related technical content in the first aspect, and will not be repeated here. That is to say, the descriptions in the first aspect regarding the image annotation interaction page, operation control area, image interaction area, image upload operation, annotation parameter setting operation, click operation, color tolerance recognition, region masking range, annotation box range, region mask drawing, and annotation box drawing can all be applied to the image annotation system of the embodiments of this application.

[0106] Therefore, in the image annotation system of this invention, the page providing module 100 can provide an interactive image annotation page for user operation; the image acquisition module 200 can acquire and display the image to be annotated; the parameter determination module 300 can determine the annotation parameters set by the user; the region recognition module 400 can identify target regions with similar and continuous colors based on the user's click position and color tolerance parameters; and the annotation drawing module 500 can draw region masks and annotation boxes based on the target regions. Through the cooperation of the above modules, similarly, users only need to upload images, set annotation parameters, and click on the target position to complete the target region recognition and annotation result drawing, thereby reducing the operational burden of manual selection and drawing of boundaries, and improving the interactive efficiency, recognition efficiency, and visualization display effect of image region annotation.

[0107] Optionally, the image annotation system further includes: a canvas management module configured to draw the image to be annotated on the original canvas and to create a mask canvas above the original canvas, the mask canvas being set independently of the original canvas and carrying the drawing content of the region mask and the annotation box; and / or a pixel caching module configured to read the original pixel data of the image to be annotated and cache the original pixel data in memory; And / or, the region recognition module 400 is further configured to combine the current zoom level and canvas offset to perform reverse mapping on the screen coordinates corresponding to the user click operation, thereby obtaining the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; using a breadth-first search method, the diffusion spreads from the diffusion starting point to the four neighboring pixels, and uses the color difference value and the color tolerance parameter as the pixel inclusion condition to determine the target region; when a pixel is included in the target region, the boundary coordinates of the target region are updated synchronously. And / or, the annotation drawing module 500 is further configured to perform a reverse conversion on the border line width based on the current scaling ratio to obtain the actual drawing line width, wherein the actual drawing line width is equal to the expected screen visual line width divided by the current scaling ratio; the outer border is drawn according to the actual drawing line width, and the inner border is drawn according to the inner line width which is less than or equal to the actual drawing line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

[0108] In some embodiments, the canvas management module can draw the image to be annotated on the original canvas and create a mask canvas on top of the original canvas. The original canvas can hold the original image display content of the image to be annotated, while the mask canvas can hold the annotation content such as region masks and annotation boxes. By setting the original canvas and mask canvas in layers, the display content of the image to be annotated and the annotation content can be distinguished from each other, making it easier to manage the original image display and the annotation display separately.

[0109] In some embodiments, the masking canvas can be set independently of the original canvas and overlaid on the original canvas in the image interaction area. The masking canvas can be located above the original canvas, allowing the region mask and annotation boxes to be overlaid on the image to be annotated. This allows the user to observe both the original image content and the region mask and annotation boxes generated based on the target region. Furthermore, because the annotation content is contained within the masking canvas, the drawing, clearing, or updating of the region mask and annotation boxes can be completed within the masking canvas, thereby reducing the impact of annotation display processing on the original image content.

[0110] In some embodiments, the pixel caching module can read the raw pixel data of the image to be labeled and cache the raw pixel data in memory. The raw pixel data may include the color value corresponding to each pixel in the image to be labeled, such as RGB color value or RGBA color value. By caching the raw pixel data, the region recognition module 400 can directly read the color value of the corresponding pixel from memory when recognizing the target region in subsequent steps, without having to reread the pixel data of the entire image after each click operation.

[0111] In some embodiments, the region recognition module 400 can also combine the current scaling ratio and canvas offset to perform reverse mapping of the screen coordinates corresponding to the user's click operation, obtaining the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled. Specifically, when a user clicks on the image to be labeled in the image interaction area, since the image to be labeled may be in a zoomed-in, zoomed-out, or panned display state, the screen coordinates corresponding to the user's click position are not necessarily directly equivalent to the pixel coordinates in the original image. Therefore, the region recognition module 400 can first eliminate the translation effect based on the canvas offset, and then eliminate the scaling effect based on the current scaling ratio, thereby converting the screen coordinates into the original pixel coordinates.

[0112] In some embodiments, after obtaining the original pixel coordinates, the region recognition module 400 can also determine the recognition method of the target region based on the original image size of the image to be labeled and a preset size threshold. When the width and / or height of the image to be labeled is greater than or equal to the preset size threshold, the region recognition module 400 can use an off-screen canvas for scaled-down recognition; when the width and height of the image to be labeled are both less than the preset size threshold, the region recognition module 400 can directly perform recognition based on the original pixel data of the image to be labeled.

[0113] In some embodiments, when using an off-screen canvas for zoom-out recognition, the region recognition module 400 can convert the original pixel coordinates into zoomed-out pixel coordinates in the off-screen canvas according to a preset zoom-out ratio, and use the pixel corresponding to the zoomed-out pixel coordinates as the off-screen diffusion starting point. The region recognition module 400 can obtain the base color value of the off-screen diffusion starting point and use a breadth-first search method to diffuse from the off-screen diffusion starting point to the four neighboring pixels. The four neighboring pixels can include the pixel above, below, to the left, and to the right of the current pixel. For each four neighboring pixel, the region recognition module 400 can calculate the color difference value between the color value of the four neighboring pixels and the base color value, and use the color difference value and the color tolerance parameter as pixel inclusion conditions to determine whether the four neighboring pixels belong to the zoom-out target region. When the color difference value corresponding to a certain four neighboring pixel is not greater than the color tolerance parameter, the region recognition module 400 can include the four neighboring pixels in the zoom-out target region and continue to diffuse outward based on the four neighboring pixels; when the color difference value is greater than the color tolerance parameter, the region recognition module 400 can exclude the four neighboring pixels from the zoom-out target region. Therefore, the region recognition module 400 can expand layer by layer along the spatially continuous adjacent pixels from the off-screen diffusion starting point in the off-screen canvas, thereby obtaining a reduced target region that is similar in color to the off-screen diffusion starting point and is spatially continuous.

[0114] In some embodiments, the region recognition module 400 can map the reduced target region back to the original coordinate system of the image to be labeled according to a preset reduction ratio, and determine the mapped region as the target region. For example, if the pixel coordinates in the reduced target region are coordinates in the off-screen canvas coordinate system, the region recognition module 400 can divide these coordinates by the preset reduction ratio to obtain their corresponding coordinates in the original coordinate system of the image to be labeled. Therefore, even if the region diffusion process is performed off-screen, the final target region can still correspond to the original pixel coordinates of the image to be labeled, facilitating subsequent determination of the region masking range and the annotation box range based on the target region.

[0115] In some embodiments, when the width and height of the image to be labeled are both less than a preset size threshold, the region identification module 400 can use the pixel corresponding to the original pixel coordinates as the diffusion starting point and obtain the base color value of the diffusion starting point from the original pixel data of the image to be labeled. The region identification module 400 can use a breadth-first search method to diffuse from the diffusion starting point to the four neighboring pixels and calculate the color difference between the color value of the adjacent pixels and the base color value. When the color difference value is not greater than the color tolerance parameter, the region identification module 400 can include the corresponding adjacent pixel in the target region and continue to diffuse outward based on the adjacent pixel; when the color difference value is greater than the color tolerance parameter, the region identification module 400 can choose not to include the adjacent pixel in the target region. In this way, the region identification module 400 can directly identify target regions that are similar in color to the diffusion starting point and are spatially continuous based on the original pixel data of the image to be labeled.

[0116] In some embodiments, when a pixel is included in the target region or the target region is reduced, the region identification module 400 can also synchronously update the boundary coordinates of the corresponding region. The boundary coordinates may include the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the corresponding region. That is, during the pixel diffusion and color difference judgment process performed by the region identification module 400, whenever a new pixel is included in the target region or the target region is reduced, the region identification module 400 can compare the x-coordinate and y-coordinate of that pixel with the current boundary coordinates and update the boundary coordinates of the corresponding region based on the comparison result. Therefore, when the target region or the reduced target region is identified, the boundary of the corresponding region can be obtained synchronously without having to traverse the pixel set in the target region or the reduced target region again.

[0117] In some embodiments, the annotation drawing module 500 can also draw an outer border and an inner border located inside the outer border within the annotation box area. Specifically, the outer border can be drawn according to the actual drawing line width, and the inner border can be drawn according to an inner line width less than or equal to the actual drawing line width. The outer border can provide visual guidance for the target area, enabling users to quickly observe the approximate location and overall extent of the target area; the inner border can form a clearer boundary outline, allowing users to more accurately identify the boundary of the target area against a complex background. The outer and inner borders can use different colors, or colors that create visual contrast, to improve the visibility and recognizability of the annotation box.

[0118] In some embodiments, the annotation drawing module 500 can also perform reverse calculation of the border line width based on the current scaling ratio to obtain the actual drawn line width. The actual drawn line width can be equal to the border line width divided by the current scaling ratio, so that the annotation box maintains a consistent visual thickness at different scaling levels. For example, when the current scaling ratio increases, the actual drawn line width can be decreased accordingly; when the current scaling ratio decreases, the actual drawn line width can be increased accordingly. Thus, even if the user zooms in or out of the image to be annotated, the line thickness of the annotation box can remain relatively stable in the user's vision, avoiding the problem of the border being too thick when zoomed in or too thin when zoomed out.

[0119] In some embodiments, the configurations of the canvas management module, pixel cache module, region recognition module 400, and annotation drawing module 500 can be found in the same or related technical content as described in the first aspect, and will not be repeated here. The canvas management module, pixel cache module, region recognition module 400, and annotation drawing module 500 can cooperate with each other. The canvas management module can realize the layered display of the original canvas and the mask canvas. The pixel cache module can provide a stable source of original pixel data for region recognition. The region recognition module 400 can accurately determine the click position in zoom or pan mode and identify spatially continuous target areas based on color tolerance parameters. The annotation drawing module 500 can improve the display recognition of the annotation box and the consistency of zoomed display by using double-layer borders and line width reverse conversion.

[0120] Optionally, the image annotation system further includes an interactive control module, which is configured to respond to zoom and / or pan operations performed by a user in the image interactive area. And / or, in response to a user's one-click clear operation in the operation control area, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas; or, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas, and restore the color tolerance parameter, the annotation fill color parameter, the transparency parameter, and the border style parameter to the default annotation configuration parameters.

[0121] In some embodiments, the configuration of the interactive control module can also refer to the same or related technical content in the first aspect, and will not be repeated here.

[0122] In some embodiments, the interactive control module can respond to user zooming and / or panning operations within the image interaction area. Zooming operations may include at least one of mouse wheel zooming, touchpad zooming, touchscreen gesture zooming, and zooming triggered by page controls; panning operations may include at least one of mouse drag panning, touch drag panning, and other interactive operations capable of changing the display position of the image to be annotated. By responding to zooming and / or panning operations, the interactive control module can adjust the display ratio and / or display position of the image to be annotated within the image interaction area.

[0123] In some embodiments, when a user performs a zoom operation, the interaction control module can update the current zoom ratio. For example, the interaction control module can use the mouse cursor position or the touch position as the zoom center to enlarge or reduce the display of the image to be annotated. After the current zoom ratio is updated, it can be used by the region recognition module 400 for reverse mapping of click coordinates, or by the annotation drawing module 500 for reverse conversion of the border line width. Therefore, the zoom operation not only affects the display size of the image to be annotated, but also affects the subsequent determination of the click position and the display effect of the annotation box.

[0124] In some embodiments, when a user performs a panning operation, the interaction control module can update the canvas offset. The canvas offset represents the offset position of the image to be annotated or the displayed content on the canvas relative to the image interaction area. When the user moves the image to be annotated by dragging, the interaction control module can update the canvas offset based on the drag start point, drag end point, and drag displacement. The updated canvas offset can be used in conjunction with the current zoom level to participate in the click coordinate reverse mapping, so that when the user clicks on the image to be annotated in the panned display position, they can still accurately obtain the corresponding original pixel coordinates.

[0125] In some embodiments, the interactive control module can transform the display of the original canvas and the mask canvas based on the same current scaling ratio and canvas offset. That is, when the user zooms and / or pans the image to be annotated, the image to be annotated in the original canvas and the region mask and annotation box in the mask canvas can be zoomed and / or panned synchronously. Therefore, the region mask and annotation box can maintain their positional correspondence with the image to be annotated, avoiding misalignment between the annotation content and the original image content.

[0126] In some embodiments, the one-click clear operation can be triggered by a clear control, a combination of a clear control and a reset control, or a clear / reset control. When a user triggers the one-click clear operation, such as using the clear control or the clear / reset control, the interactive control module can clear the region mask and annotation boxes in the mask canvas, and clear the annotation status data corresponding to the region mask and annotation boxes. The annotation status data may include the pixel set of the target region, the boundary coordinates of the target region, the region mask range, the annotation box range, coordinate information, size information, or other data corresponding to the generated annotation results.

[0127] In other embodiments, upon responding to a one-click clear operation, such as using a reset control or a clear reset control, the interactive control module can also restore the color tolerance parameters, annotation fill color parameters, transparency parameters, and border style parameters to the default annotation configuration parameters. The default annotation configuration parameters can be parameters preset by the system or default parameters saved by the user. For example, the default annotation configuration parameters may include a default color tolerance value, a default area mask color, a default transparency, a default outer border color, a default inner border color, and a default border line width. By restoring the default annotation configuration parameters, users can quickly return to the initial annotation state after clearing the annotation results, facilitating the re-annotation of images.

[0128] In some embodiments, the one-click clear operation can only clear the area mask, annotation box, and corresponding annotation status data in the mask canvas, while retaining the image to be annotated in the original canvas; alternatively, it can clear the annotation status data while restoring the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter to the default annotation configuration parameters. These two clearing methods can be preset by the image annotation system or selected by the user through a clear control, a reset control, or a clear / reset control; this application does not limit the specific method used.

[0129] In some embodiments, after a one-click clear operation is completed, the interactive control module can restore the image interaction area to a state where no annotations are displayed. At this time, the original canvas can still display the image to be annotated, the area mask and annotation box in the mask canvas are cleared, the annotation status data is reset, and the annotation configuration parameters are restored to the default annotation configuration parameters. Users can continue to perform annotation parameter setting operations and click operations on the same image to be annotated, or they can re-upload another image to be annotated.

[0130] In this invention application, the interactive control module responds to zoom and / or pan operations, allowing users to adjust the display ratio and position of the image to be annotated according to their observation needs. The current zoom ratio and canvas offset maintain the correspondence between the user's click position and the original pixel coordinates. Furthermore, the interactive control module responds to a one-click clear operation, reducing the burden on users to delete annotation content or restore parameters item by item. It can quickly clear the generated annotation display content and annotation status data, and restore the default annotation configuration parameters, simplifying the annotation result clearing and parameter restoration process. This allows users to quickly restart the annotation process, thereby improving the interactive convenience and efficiency of the image annotation system.

[0131] Thirdly, this application provides an image annotation device, including a memory and a processor connected in communication, wherein the memory is used to store a computer program, and the processor is used to read the computer program and execute any of the image annotation methods described in the first aspect above.

[0132] Those skilled in the art will understand that the image annotation apparatus includes: a processor, a memory, and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, it implements the steps of the image annotation method according to any one of the first aspects described above.

[0133] Fourthly, this application provides a computer-readable storage medium storing instructions that, when executed on a computer, perform any of the image annotation methods described in the first aspect above.

[0134] The processor can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor can be a microprocessor or any conventional processor. The processor is the control center of the terminal device, connecting all parts of the terminal device via various interfaces and lines.

[0135] The memory can be used to store the computer programs and / or modules. The processor implements various functions of the terminal device by running or executing the computer programs and / or modules stored in the memory and by calling data stored in the memory. The memory may mainly include a program storage area and a data storage area. The program storage area may store the operating system, at least one application program required for a function (such as sound playback function, image playback function, etc.), etc.; the data storage area may store data created according to the use of the mobile phone (such as audio data, phonebook, etc.). In addition, the memory may include high-speed random access memory, and may also include non-volatile memory, such as hard disk, memory, plug-in hard disk, smart media card (SMC), secure digital (SD) card, flash card, at least one disk storage device, flash memory device, or other volatile solid-state storage device.

[0136] Wherein, if the modules / units integrated in the terminal device are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, all or part of the processes in the methods of the above embodiments of the present invention can also be implemented by a computer program instructing related hardware. The computer program can be stored in a computer-readable storage medium, and when executed by a processor, it can implement the steps of the various method embodiments described above. The computer program includes computer program code, which can be in the form of source code, object code, executable files, or certain intermediate forms. The computer-readable medium can include: any entity or device capable of carrying the computer program code, recording media, USB flash drives, portable hard drives, magnetic disks, optical disks, computer memory, read-only memory (ROM), random access memory (RAM), electrical carrier signals, telecommunication signals, and software distribution media, etc.

[0137] It should be noted that the system embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. Furthermore, in the accompanying drawings of the device embodiments provided by this invention, the connection relationships between modules indicate that they have communication connections, which can be specifically implemented as one or more communication buses or signal lines. Those skilled in the art can understand and implement this without creative effort.

[0138] The above description represents the preferred embodiments of the present invention. It should be noted that those skilled in the art can make various improvements and modifications without departing from the principles of the present invention, and these improvements and modifications are also considered to be within the scope of protection of the present invention.

Claims

1. A method for annotating images, characterized in that, include: An image annotation interactive page is provided, which includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations, and the image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. In response to the user's image upload operation in the operation control area, the system retrieves the image to be labeled and displays the image to be labeled in the image interaction area. In response to the user's annotation parameter setting operation in the operation control area, determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter; In response to a user's click on the image to be labeled, determine the pixel position of the image corresponding to the click operation; Based on the color value of the pixel corresponding to the pixel position in the image and the color tolerance parameter, identify a target area that is similar in color to and continuous with the pixel. The region masking range is determined based on the target region, and the annotation box range is determined by the boundary of the target region; Draw an area mask within the area masking range according to the specified fill color parameters and transparency parameters, and draw a label box within the specified label box range according to the specified border style parameters; Based on the color value of the pixel corresponding to the pixel position in the image and the color tolerance parameter, identify a target region that is similar in color to and continuous with the pixel, including: Using the pixel corresponding to the image pixel position as the diffusion starting point, and obtaining the base color value of the diffusion starting point; using a breadth-first search method, diffusion is performed from the diffusion starting point to the four neighboring pixels above, below, left, and right; the color difference value between the color value of the adjacent pixel and the base color value is calculated; when the color difference value is not greater than the color tolerance parameter, the corresponding adjacent pixel is included in the target area; the adjacent pixel judgment and diffusion are repeated until there are no adjacent pixels that satisfy the color tolerance parameter; In the process of responding to the user's image upload operation in the operation control area, obtaining the image to be labeled, and displaying the image to be labeled in the image interaction area, an off-screen canvas that is not visible to the user is created, and the image to be labeled is drawn onto the off-screen canvas according to a preset scaling ratio, wherein the preset scaling ratio is less than 1. During the identification of the target region, when the width and / or height of the image to be labeled is greater than or equal to a preset size threshold, the original pixel coordinates of the image pixels in the original coordinate system of the image to be labeled are converted into reduced pixel coordinates in the off-screen canvas according to the preset reduction ratio. Using the reduced pixel coordinates as the starting point of off-screen diffusion, a breadth-first search is used to diffuse to the four neighboring pixels in the off-screen canvas to identify the reduced target region with a similar and continuous color to the pixel corresponding to the reduced pixel coordinates. According to the preset reduction ratio, the reduced target region is mapped back to the original coordinate system of the image to be labeled, and the mapped region is determined as the target region. When the width and height of the image to be labeled are both less than the preset size threshold, the image pixel position is used as the diffusion starting point in the original pixel data of the image to be labeled, and the diffusion is carried out to the four neighboring pixels in a breadth-first search manner to identify the target area. In the process of identifying the target region or narrowing the target region using a breadth-first search method, a pre-allocated fixed-size queue is used to store the pixels to be diffused, and an access flag array corresponding to the number of pixels in the image data to be diffused is used to record the pixel access status; the access flag array marks the accessed pixels to avoid the same pixel being judged repeatedly; the fixed-size queue stores and retrieves the pixels to be diffused in the order of breadth-first search. When a pixel is included in the target region, the minimum x-coordinate, maximum x-coordinate, minimum y-coordinate, and maximum y-coordinate of the target region are updated synchronously to obtain the boundary of the target region during the region recognition process.

2. The image annotation method according to claim 1, characterized in that, Responding to a user's image upload operation in the operation control area, obtaining the image to be labeled, and displaying the image to be labeled in the image interaction area, including: The image to be labeled is drawn on the original canvas; a mask canvas is created above the original canvas, the mask canvas is set independently of the original canvas, and carries the drawing content of the region mask and the label box; the original pixel data of the image to be labeled is read and cached in memory; the display state of the image to be labeled is initialized, the display state includes the original image size, the current scaling ratio and the canvas offset.

3. The image annotation method according to claim 2, characterized in that, Responding to a user's click on the image to be labeled, determining the image pixel position corresponding to the click operation includes: Obtain the screen coordinates of the click operation in the image interaction area; combine the current zoom level and canvas offset to perform reverse mapping on the screen coordinates to obtain the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; use the original pixel coordinates as the pixel position of the image; wherein, the original pixel coordinates correspond one-to-one with the original pixel data of the image to be labeled; And / or, the border style parameters include the outer border color, the inner border color, and the border line width; according to the annotation fill color parameters and the transparency parameters, draw an area mask within the area masking range, and according to the border style parameters, draw an annotation box within the annotation box range, including: The pixels within the masked area are drawn onto the mask canvas with the color corresponding to the annotation fill color parameter and the transparency corresponding to the transparency parameter. Draw an outer border within the area of ​​the marked box, using the same color as the outer border, to visually guide the target area. An inner border is drawn inside the annotation drawing module. The inner border uses an inner border color that visually contrasts with the outer border to enhance the boundary recognition of the target area. The border line width is reverse-calculated based on the current scaling ratio to obtain the actual drawn line width, which is equal to the border line width divided by the current scaling ratio. The outer border is drawn according to the actual drawn line width, and the inner border is drawn according to the inner line width which is less than or equal to the actual drawn line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

4. An image annotation system, employing the image annotation method according to any one of claims 1-3, characterized in that, include: The page provides a module configured to provide an image annotation interactive page. The image annotation interactive page includes an operation control area and an image interaction area. The operation control area is configured to receive image upload operations and annotation parameter setting operations. The image interaction area is configured to display the image to be annotated and receive click operations on the image to be annotated. The image acquisition module is configured to respond to the user's image upload operation in the operation control area, acquire the image to be labeled, and display the image to be labeled in the image interaction area; The parameter determination module is configured to respond to the user's annotation parameter setting operation in the operation control area and determine the color tolerance parameter, annotation fill color parameter, transparency parameter, and border style parameter; The region recognition module is configured to respond to a user's click operation on the image to be labeled and determine the image pixel position corresponding to the click operation. Based on the color value of the pixel corresponding to the pixel position in the image and the color tolerance parameter, identify a target area that is similar in color to and continuous with the pixel. The annotation drawing module is configured to determine the area masking range based on the target area, and to determine the annotation frame range by the boundary of the target area; draw the area mask within the area masking range according to the annotation fill color parameter and the transparency parameter, and draw the annotation frame within the annotation frame range according to the border style parameter.

5. The image annotation system according to claim 4, characterized in that, The image annotation system also includes: The canvas management module is configured to draw the image to be annotated on the original canvas and to create a mask canvas above the original canvas. The mask canvas is set independently of the original canvas and carries the drawing content of the area mask and the annotation box. And / or, a pixel caching module is configured to read the raw pixel data of the image to be labeled and cache the raw pixel data in memory; And / or, the region recognition module is further configured to combine the current zoom level and canvas offset to perform reverse mapping of the screen coordinates corresponding to the user click operation, thereby obtaining the original pixel coordinates of the click operation in the original coordinate system of the image to be labeled; using a breadth-first search method, the diffusion spreads from the diffusion starting point to the four neighboring pixels, and uses the color difference value and the color tolerance parameter as the pixel inclusion condition to determine the target region; when a pixel is included in the target region, the boundary coordinates of the target region are updated synchronously. And / or, the annotation drawing module is also configured to perform reverse conversion of the border line width based on the current scaling ratio to obtain the actual drawing line width, wherein the actual drawing line width is equal to the border line width divided by the current scaling ratio; draw the outer border according to the actual drawing line width, and draw the inner border according to the inner line width which is less than or equal to the actual drawing line width, so that the annotation box maintains a consistent visual thickness under different scaling levels.

6. The image annotation system according to claim 5, characterized in that, The image annotation system also includes an interactive control module, which is configured to respond to zoom and / or pan operations performed by the user in the image interactive area. And / or, in response to a user's one-click clear operation in the operation control area, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas; or, clear the area mask, annotation box, and corresponding annotation status data in the mask canvas, and restore the color tolerance parameter, the annotation fill color parameter, the transparency parameter, and the border style parameter to the default annotation configuration parameters.

7. An image annotation device, characterized in that, Including processor and memory, The memory stores a computer program, and when the processor executes the computer program, it performs the image annotation method according to any one of claims 1 to 3.

8. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, which, when executed by a processor, performs the image annotation method according to any one of claims 1 to 3.

Citation Information

Patent Citations

  • Signal lamp marking method and device

    CN117746389A

  • Scene text recognition method and device

    WO2023083280A1