Method and device for detecting page overlay area

Abstract

The present invention discloses a method and device for detecting page overlay areas, and relates to the field of computer technology. A specific implementation of the method includes: hiding other blocks except the target block in the page, and determining the content area boundary of the target block; obtaining a first pixel matrix of the content area of ​​the target block based on the content area boundary of the target block; restoring the display of other blocks, and extracting a second pixel matrix of the content area of ​​the target block; detecting the overlay area in the page based on the first pixel matrix and the second pixel matrix. This implementation improves accuracy and intelligence on the basis of realizing automated detection, is easy to use and operate, saves time and labor costs, and this method is universal, dynamically solves the problem of misjudgment of overlap caused by overlapping page blank margins, and can more accurately and effectively determine whether the actual content in the page is overlaid, thereby improving the overall quality of the web page and enhancing the user experience.

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a method and device for detecting page overlay areas. Background Art

[0002] When users browse the web, they obtain the information they need by browsing the text, images, and other content on the web. Therefore, a reasonable page layout of an Internet web page can facilitate users to read and obtain information on the page, which can then be converted into commercial activities. However, an unreasonable page layout may cause the page text to be partially or completely covered, thereby affecting the user's normal reading and preventing the user from obtaining effective information from the browsing page. Usually, the detection of the overlap of web page content such as text or images is completed through manual inspection. Another relatively simple detection method is to convert the web page content overlap detection into the block overlap detection where the text or image content is located. This method regards the block as a sized rectangle. When half of the sum of the length and width of two rectangles is greater than the distance between the center points of the two rectangles, it is considered that there is regional overlap of the rectangles.

[0003] In the process of implementing the present invention, the inventors discovered that the prior art has at least the following problems:

[0004] Manual inspection is time-consuming and labor-intensive, and the overlay judgment results are subjective, inaccurate, and inefficient, making them difficult to operate during multi-scenario detection and compatibility testing. The block rectangle size overlay judgment method can achieve automated detection, but blocks generally have inner and outer margins, and the outer boundary frame size of the rectangle cannot be directly used for judgment. Even if the inner and outer margins of the rectangle are taken into account and the content area size is used for comparison, since the text does not occupy the entire area of ​​the content area, using the content area size to judge the overlay is not accurate enough. Summary of the Invention

[0005] In view of this, an embodiment of the present invention provides a method and device for detecting page overlay areas, which can extract the content area boundaries of web page blocks based on canvas technology, and detect page overlays based on pixel value statistics. When judging page overlays, the method and device are not affected by the inner and outer margins of the block. The content area boundaries are completely determined by the actual content displayed in the content area. It has universal applicability and dynamically solves the overlap misjudgment problem caused by overlapping blank margins in the content area. It can more accurately and effectively judge whether there is overlap in the actual content in the block, thereby improving the overall quality of the web page and enhancing the user experience.

[0006] To achieve the above objective, according to one aspect of an embodiment of the present invention, a method for detecting page overlapping areas is provided.

[0007] A method for detecting a page overlay area comprises: hiding blocks other than a target block in a page and determining a content area boundary of the target block; obtaining a first pixel matrix of the content area of ​​the target block based on the content area boundary of the target block; restoring the display of other blocks and extracting a second pixel matrix of the content area of ​​the target block; and detecting an overlay area in the page based on the first pixel matrix and the second pixel matrix.

[0008] Optionally, before determining the content area boundary of the target block, the method further includes: performing sharpening processing on the page.

[0009] Optionally, the sharpening process includes: setting the background color of the page to white; setting the background color of the target block to a completely transparent color; and setting the content color of the target block to black.

[0010] Optionally, determining the content area boundary of the target block includes: obtaining the position and size of the content area of ​​the target block; extracting the pixel value of each pixel in the content area of ​​the target block; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtaining the content area boundary of the target block according to the binary pixel matrix.

[0011] Optionally, before obtaining the content area boundary of the target block according to the binary pixel matrix, it also includes: setting isolated 0 values ​​in the binary pixel matrix to 1 for denoising, wherein 0 is the binary value corresponding to the black point and 1 is the binary value corresponding to the white point.

[0012] Optionally, the pixel value of each pixel point in the content area of ​​the target block is a color pixel value; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block includes: converting the color pixel value into a grayscale single-channel pixel value; converting the grayscale single-channel pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block.

[0013] Optionally, extracting the pixel value of each pixel in the content area of ​​the target block includes: creating a canvas covering the page; drawing and displaying the page on the canvas based on the page rendering tree; and reading the pixel value of each pixel in the content area of ​​the target block in sequence through the canvas.

[0014] Optionally, converting the grayscale image single-channel pixel value into a binary value includes: converting the grayscale image single-channel pixel value into a binary value according to an expected value of the grayscale image single-channel pixel value.

[0015] Optionally, converting the grayscale image single channel pixel value into a binary value includes: when the grayscale image single channel pixel value is not less than the expected value of the grayscale image single channel pixel value, the binary value takes the value of 1, otherwise the binary value takes the value of 0.

[0016] Optionally, obtaining the content area boundary of the target block according to the binary pixel matrix includes: scanning the binary pixel matrix, extracting the boundary vertices of each row, the boundary vertices including the left boundary vertex and the right boundary vertex, the left boundary vertex is the point corresponding to the first 0 value appearing in a row, and the right boundary vertex is the point corresponding to the last 0 value appearing in a row, where 0 is the binary value corresponding to the black dot; connecting the boundary vertices of each row with a straight line to obtain the content area boundary of the target block.

[0017] Optionally, detecting the superimposed area in the page according to the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix, and detecting the superimposed area in the page according to the third matrix.

[0018] Optionally, detecting the superimposed area in the page based on the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to the position to obtain a third matrix; wherein the point with an element value of 1 in the third matrix is ​​the superimposed area in the page.

[0019] Optionally, detecting the superposition area in the page based on the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to the position to obtain a third matrix; counting the number of all elements in the third matrix, and the number of elements with an element value of 1; taking the percentage of the number of elements with an element value of 1 to the total number of elements as the superposition area ratio of the page; and detecting the superposition area in the page based on a preset threshold and the superposition area ratio.

[0020] According to another aspect of an embodiment of the present invention, a device for detecting a page overlapping area is provided.

[0021] A device for detecting page overlay areas includes: a boundary determination module for hiding blocks other than a target block in a page and determining the boundary of a content area of ​​the target block; a first matrix module for obtaining a first pixel matrix of the content area of ​​the target block based on the boundary of the content area of ​​the target block; a second matrix module for restoring the display of other blocks and extracting a second pixel matrix of the content area of ​​the target block; and an overlay detection module for detecting an overlay area in the page based on the first pixel matrix and the second pixel matrix.

[0022] Optionally, the device further includes a sharpening processing module, configured to perform sharpening processing on the page.

[0023] Optionally, the sharpening processing module is further configured to: set the background color of the page to white; set the background color of the target block to a completely transparent color; and set the content color of the target block to black.

[0024] Optionally, the boundary determination module is further used to: obtain the position and size of the content area of ​​the target block; extract the pixel value of each pixel in the content area of ​​the target block; convert the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtain the content area boundary of the target block based on the binary pixel matrix.

[0025] Optionally, the device further includes a denoising processing module for setting isolated 0 values ​​in the binary pixel matrix to 1 for denoising, wherein 0 is the binary value corresponding to the black point and 1 is the binary value corresponding to the white point.

[0026] Optionally, the pixel value of each pixel point in the content area of ​​the target block is a color pixel value; the boundary determination module is further used to: convert the color pixel value into a grayscale single-channel pixel value; convert the grayscale single-channel pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block.

[0027] Optionally, the boundary determination module is further configured to: create a canvas covering the page; draw and display the page on the canvas based on the page rendering tree; and sequentially read the pixel value of each pixel in the content area of ​​the target block through the canvas.

[0028] Optionally, the boundary determination module is further configured to convert the single-channel pixel value of the grayscale image into a binary value according to an expected value of the single-channel pixel value of the grayscale image.

[0029] Optionally, the boundary determination module is further configured to: when the single-channel pixel value of the grayscale image is not less than the expected value of the single-channel pixel value of the grayscale image, the binary value takes the value of 1; otherwise, the binary value takes the value of 0.

[0030] Optionally, the boundary determination module is also used to: scan the binary pixel matrix to extract the boundary vertices of each row, the boundary vertices including the left boundary vertex and the right boundary vertex, the left boundary vertex is the point corresponding to the first 0 value in a row, and the right boundary vertex is the point corresponding to the last 0 value in a row, where 0 is the binary value corresponding to the black dot; connect the boundary vertices of each row with a straight line to obtain the content area boundary of the target block.

[0031] Optionally, the overlay detection module is further configured to: perform an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix, and detect an overlay area in the page according to the third matrix.

[0032] Optionally, the overlay detection module is further used to: perform an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix; wherein the points with element values ​​of 1 in the third matrix are the overlay areas in the page.

[0033] Optionally, the overlay detection module is also used to: perform an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix; count the number of all elements in the third matrix, and the number of elements with an element value of 1; take the percentage of the number of elements with an element value of 1 to the total number of elements as the overlay area ratio of the page; and detect the overlay area in the page based on a preset threshold and the overlay area ratio.

[0034] According to yet another aspect of an embodiment of the present invention, an electronic device for detecting a page overlapping area is provided.

[0035] An electronic device for detecting page overlay areas includes: one or more processors; and a storage device for storing one or more programs. When the one or more programs are executed by the one or more processors, the one or more processors implement a method for detecting page overlay areas provided in an embodiment of the present invention.

[0036] According to yet another aspect of an embodiment of the present invention, a computer-readable medium is provided.

[0037] A computer-readable medium stores a computer program, which, when executed by a processor, implements a method for detecting page overlapping areas provided by an embodiment of the present invention.

[0038] An embodiment of the above invention has the following advantages or beneficial effects: using other blocks except the target block in the hidden page, and determining the content area boundary of the target block; obtaining the first pixel matrix of the content area of ​​the target block based on the content area boundary of the target block; restoring the display of other blocks, and extracting the second pixel matrix of the content area of ​​the target block; the technical means of detecting the superimposed area in the page based on the first pixel matrix and the second pixel matrix improves the accuracy and intelligence on the basis of realizing automatic detection, is easy to use and operate, saves time and labor costs, and this method is universal, dynamically solves the overlap misjudgment problem caused by the overlap of page blank margins, and can more accurately and effectively judge whether there is overlap in the actual content of the page, thereby improving the overall quality of the web page and enhancing the user experience.

[0039] The further effects of the above-mentioned non-conventional optional manner will be described below in conjunction with specific embodiments. BRIEF DESCRIPTION OF THE DRAWINGS

[0040] The accompanying drawings are provided for a better understanding of the present invention and are not intended to limit the present invention.

[0041] Figure 1 1 is a schematic diagram of the main steps of a method for detecting page overlay areas according to an embodiment of the present invention;

[0042] Figure 21 is a schematic diagram of a boundary extraction step of a method for detecting page overlay areas according to an embodiment of the present invention;

[0043] Figure 3 2 is a schematic diagram of pixel point extraction results according to a method for detecting page overlapping areas according to an embodiment of the present invention;

[0044] Figure 4 is a schematic diagram of a binary pixel value matrix according to a method for detecting page overlapping areas according to an embodiment of the present invention;

[0045] Figure 5 is a schematic diagram of boundary extraction results of a method for detecting page overlapping areas according to an embodiment of the present invention;

[0046] Figure 6 is a flowchart of an overlay detection method for detecting page overlay areas according to an embodiment of the present invention;

[0047] Figure 7 is a schematic diagram of a pixel value matrix according to a method for detecting page overlapping areas according to an embodiment of the present invention;

[0048] Figure 8 is a schematic diagram of an XOR processing matrix according to a method for detecting page overlapping areas according to an embodiment of the present invention;

[0049] Figure 9 is a schematic diagram of main modules of a device for detecting page overlapping areas according to an embodiment of the present invention;

[0050] Figure 10 is an exemplary system architecture diagram in which embodiments of the present invention may be applied;

[0051] Figure 11 It is a schematic diagram of the structure of a computer system of a terminal device or a server suitable for implementing an embodiment of the present invention. DETAILED DESCRIPTION

[0052] The following description of exemplary embodiments of the present invention is made in conjunction with the accompanying drawings, in which various details of the embodiments of the present invention are included to facilitate understanding. These details should be considered as merely exemplary. Therefore, it should be appreciated by those skilled in the art that various changes and modifications may be made to the embodiments described herein without departing from the scope and spirit of the present invention. Similarly, for the sake of clarity and conciseness, descriptions of well-known functions and structures are omitted in the following description.

[0053] While the Internet brings people a convenient and fast life experience, it is also quietly changing the way people obtain information and understand the world. Text is an important component of Internet (WEB) web pages. Users browse the web mainly by reading text on the Internet (WEB) to obtain the information they need. In the modern Internet business system, text, as a carrier of commercial means, is closely related to advertising creativity and business planning. The important components of Internet (WEB) web page rendering are the markup language HTML, Cascading Style Sheets CSS and the high-level programming language JS. The markup language HTML and Cascading Style Sheets CSS are combined into a rendering tree, which can determine the position and size of page elements, that is, the page layout. The page layout can directly affect the display of the content on the page.

[0054] Reasonable page layout can give users a sense of rich text and pictures, making it easier for users to read and obtain text information on the page, which can then be converted into commercial behavior. On the contrary, unreasonable page layout may cause text content to be blocked, penetrated, partially covered or completely covered, thereby affecting the user's normal reading and preventing the user from obtaining effective information from the browsing page. Common text overlays such as text-on-text overlays and text-on-image overlays can detect text overlays in the page in advance, which plays an important role in improving user experience and improving the overall quality of the page. Usually, text overlay detection can only be completed through manual inspection. A relatively simple detection method is to convert text overlay detection into block overlay detection. This method regards the block as a rectangle with a size. When half of the sum of the length and width of two rectangles is greater than the distance between the center points of the two rectangles, it is considered that there is regional overlap of the rectangles.

[0055] Compared with automatic detection, manual inspection is time-consuming and labor-intensive. Furthermore, the overlay determination results are subjective, lacking precision and intelligence, and are cumbersome to implement during multi-scenario and compatibility testing. Block rectangle size overlay determination can achieve automated detection, but suffers from the following drawbacks: Blocks typically have padding and margins, so the bounding box size cannot be directly used for determination. Even if the inner and outer margins are considered and the content box size is used for comparison, text does not occupy the entire content box. For example, it may be centered, located in the top left corner of the block, or even float anywhere within the block. This means there is a margin between the text and the content box. Furthermore, this margin is not fixed but varies depending on the text within the content. Therefore, using the content box size to determine overlay is not accurate. In other words, even if content boxes overlap, if the overlay is only in the margins of the non-text area, then the overlay cannot be determined.

[0056] This invention proposes an optimized automatic content overlay detection method based on Canvas technology. First, using the high-level programming language JavaScript, other blocks on the page where the target block is located are hidden to eliminate interference. This method is used to determine the boundaries of the target block's content area, such as text or images. Based on the determined content area boundaries, a first pixel matrix corresponding to the content area is obtained. The other hidden blocks are then displayed, and a second pixel matrix corresponding to the content area is again obtained. Finally, based on the first and second pixel matrices, it is determined whether the content area of ​​the target block is overlaid. In the embodiments of the invention, the target block's content is text, for example.

[0057] According to an embodiment of the present invention, a method for determining the text boundary of a target block is as follows: drawing the page where the target block is located through a canvas, extracting the pixel value matrix of the target block, and further extracting the minimum boundary polygon that wraps the text through a normalization operation; secondly, using the high-level programming language js to control the display of other blocks in the page, and using the same method to extract the pixel value matrix within the above-mentioned boundary polygon; finally, comparing the difference between the two groups of pixel value matrices to determine whether there is pixel intrusion, thereby achieving the purpose of determining whether there is text overlay. The present invention is not affected by the inner and outer margins of the block when determining the actual content overlay. The text boundary area is completely determined by the text display in the content area, has universal applicability, dynamically solves the overlap misjudgment problem caused by the overlapping of blank margins in the content area, and can more accurately and effectively determine whether there is text overlay.

[0058] Figure 1 FIG. 1 is a schematic diagram of the main steps of a method for detecting page overlay areas according to an embodiment of the present invention. Figure 1 As shown, the method for detecting page overlapping areas according to an embodiment of the present invention mainly includes the following steps S101 to S104.

[0059] Step S101: hiding all blocks except the target block in the page, and determining the content area boundary of the target block;

[0060] Step S102, obtaining a first pixel matrix of the content area of ​​the target block according to the content area boundary of the target block;

[0061] Step S103, resuming the display of other blocks and extracting the second pixel matrix of the content area of ​​the target block;

[0062] Step S104 : detecting an overlapping area in the page according to the first pixel matrix and the second pixel matrix.

[0063] According to the above-mentioned steps S101 to S104, the present invention proposes an Internet (WEB) page content area boundary extraction method based on canvas technology and an actual content overlay detection method based on pixel value statistics. When judging page overlay, it is not affected by the inner and outer margins of the block. The content area boundary is completely determined by the actual content display in the content area. It has universal applicability and dynamically solves the overlap misjudgment problem caused by the overlapping blank margins of the content area. It can relatively accurately and effectively judge whether the actual content in the block is overlapped, which can improve the overall quality of the web page and enhance the user experience.

[0064] According to an embodiment of the present invention, before determining the content area boundary of the target block, the method further includes: performing sharpening processing on the page.

[0065] In an embodiment of the present invention, the sharpening process includes: setting the background color of the page to white; setting the background color of the target block to a completely transparent color; and setting the content color of the target block to black.

[0066] According to another embodiment of the present invention, determining the content area boundary of the target block includes: obtaining the position and size of the content area of ​​the target block; extracting the pixel value of each pixel in the content area of ​​the target block; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtaining the content area boundary of the target block based on the binary pixel matrix.

[0067] According to another embodiment of the present invention, before obtaining the content area boundary of the target block according to the binary pixel matrix, it also includes: setting the isolated 0 values ​​in the binary pixel matrix to 1 for denoising, wherein 0 is the binary value corresponding to the black point and 1 is the binary value corresponding to the white point.

[0068] In an embodiment of the present invention, the pixel value of each pixel point in the content area of ​​the target block is a color pixel value; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block includes: converting the color pixel value into a grayscale single-channel pixel value; converting the grayscale single-channel pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block.

[0069] In an embodiment of the present invention, extracting the pixel value of each pixel in the content area of ​​the target block includes: creating a canvas covering the page; drawing and displaying the page on the canvas based on the page rendering tree; and reading the pixel value of each pixel in the content area of ​​the target block in sequence through the canvas.

[0070] According to yet another embodiment of the present invention, converting the grayscale image single-channel pixel value into a binary value includes: converting the grayscale image single-channel pixel value into a binary value according to an expected value of the grayscale image single-channel pixel value.

[0071] In an embodiment of the present invention, converting the grayscale image single channel pixel value into a binary value includes: when the grayscale image single channel pixel value is not less than the expected value of the grayscale image single channel pixel value, the binary value takes the value of 1, otherwise the binary value takes the value of 0.

[0072] In an embodiment of the present invention, obtaining the content area boundary of the target block according to the binary pixel matrix includes: scanning the binary pixel matrix to extract the boundary vertices of each row, the boundary vertices including the left boundary vertex and the right boundary vertex, the left boundary vertex is the point corresponding to the first 0 value appearing in a row, and the right boundary vertex is the point corresponding to the last 0 value appearing in a row, where 0 is the binary value corresponding to the black dot; and connecting the boundary vertices of each row with a straight line to obtain the content area boundary of the target block.

[0073] In an embodiment of the present invention, detecting the superimposed area in the page according to the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix, and detecting the superimposed area in the page according to the third matrix.

[0074] In an embodiment of the present invention, detecting the superimposed area in a page based on the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix; wherein the point with an element value of 1 in the third matrix is ​​the superimposed area in the page.

[0075] According to an embodiment of the present invention, detecting the superimposed area in a page based on the first pixel matrix and the second pixel matrix includes: performing an XOR operation on the first pixel matrix and the second pixel matrix according to the position to obtain a third matrix; counting the number of all elements in the third matrix, and the number of elements with an element value of 1; taking the percentage of the number of elements with an element value of 1 to the total number of elements as the superimposed area ratio of the page; and detecting the superimposed area in the page based on a preset threshold and the superimposed area ratio.

[0076] Figure 2 FIG is a schematic diagram of the boundary extraction step of the method for detecting page overlapping areas according to an embodiment of the present invention. The first step in determining the overlap of page areas is to determine the boundary of the content area, such as Figure 2 As shown, the boundary extraction step of the method for detecting page overlapping areas according to the embodiment of the present invention mainly includes the following steps 1 to 4.

[0077] Step 1: First, use the high-level programming language js to process the page where the target block is located and record the position and size of the content area of ​​the target block. Here, the processing of the page includes, for example: hiding other non-related blocks in the page where the target block is located to avoid interference; sharpening the page to improve the accuracy of boundary extraction and reduce noise interference, etc. In an embodiment of the present invention, the sharpening process mainly includes the following:

[0078] (1) Set the background color of the page where the target block is located to standard white (#FFF);

[0079] (2) Set the background color of the target block to completely transparent;

[0080] (3) Change the actual content color in the target block to standard black, that is, change the text color of the target block to standard black #000;

[0081] After sharpening, the position and size of the target block's content area (content-box) can be accurately obtained and recorded, i.e. (pageX, pageY, width, height), where pageX and pageY are the horizontal and vertical coordinates of the top left corner of the content-box relative to the document position, and width and height are the width and height of the content-box itself.

[0082] Through sharpening processing, we can ensure that there are only two colors on the page: white background and black content, and it will not be disturbed by unnecessary factors such as background color.

[0083] Step 2: Use canvas technology to extract pixels from the target block. Use the high-level programming language js to create a canvas covering the current page. Based on the current page rendering tree, draw the web page on the canvas and display it. Use the canvas to read the pixel value of each pixel in the rectangular area of ​​the target block content area (content-box) in sequence.

[0084] Figure 3 : is a schematic diagram of pixel extraction results of a method for detecting page overlay areas according to an embodiment of the present invention. When there is a letter O in the target block, the possible results of pixel extraction are as follows: Figure 3 As shown, each grid represents a pixel.

[0085] Step 3: The pixel value of each pixel in the content area of ​​the target block read in step 2 is a color pixel value of the RGB three channels. Each color pixel value is converted into a grayscale single channel pixel value according to the following weighted empirical formula:

[0086] Y=0.299R+0.587G+0.114B;

[0087] The pixel value extracted from each pixel point is converted from a three-channel color pixel value to a value of 0 to 255. For example, for a white point whose extracted pixel value is RGB (255, 255, 255), its grayscale image single channel pixel value Y = 0.299*255+0.587*255+0.114*255=255; for a black point whose extracted pixel value is RGB (0, 0, 0), its grayscale image single channel pixel value Y = 0.299*0+0.587*0+0.114*0=0.

[0088] Figure 4 : is a schematic diagram of a binary pixel value matrix of a method for detecting page overlay areas according to an embodiment of the present invention. To facilitate calculation, the single-channel pixel values ​​of the grayscale image are converted into binary according to the expected value E of the matrix, that is:

[0089] Z=(Y≥E)?1:0;

[0090] The meaning of the (?:) ternary operator above is that when the Y value is not less than the E value, the Z value is 1, otherwise it is 0. According to the sharpening operation in step 1, the area with a Z value of 0 can be considered to be pure black, that is, the area covered by the actual content, such as Figure 4The figure shows the result of converting the pixel extraction matrix within the target block into binary. Black dots correspond to binary values ​​of 0, and white dots correspond to binary values ​​of 1. Due to the influence of canvas drawing errors and calculation errors, the extracted pixel values ​​may be disturbed. Some denoising processing can be performed, such as setting isolated 0 values ​​to 1. If the eight pixels around a 0 are all 1, then this pixel is isolated.

[0091] Step 4: Segment the content area boundary. Scan the binary pixel value matrix and extract the boundary vertices of each row. The boundary vertices include the left boundary vertex and the right boundary vertex. The left boundary vertex is the point corresponding to the first 0 value in a row, and the right boundary vertex is the point corresponding to the last 0 value in a row. 0 is the binary value corresponding to the black dot. That is, extract the 0 value left boundary l and right boundary r of each row to obtain the polygon that wraps the minimum boundary of the text:

[0092]

[0093] In the above formula, the left edge of row i is counted as l i , the right boundary is counted as r i , where l i The first subscript with a value of 0 in this row, r i is the last subscript with a value of 0; connect the boundary vertices of each row with a straight line to obtain the content area boundary of the target block, which is the minimum boundary polygon that wraps the text.

[0094] Figure 5 FIG. 1 is a schematic diagram of a boundary extraction result of a method for detecting page overlapping areas according to an embodiment of the present invention. Figure 5 As shown in the figure, in the result of boundary extraction of the binary pixel value matrix, connecting all 0 values ​​can obtain the content area boundary, that is, the text boundary. Assuming that the coordinate of the upper left corner of the pixel matrix is ​​(1, 1), the expression describing the boundary range of the third row in the figure is {row:3,l:3,r:6}.

[0095] Figure 6 1 is a flow chart of a method for detecting page overlay areas according to an embodiment of the present invention. After determining the content area boundary, page overlay detection can be performed. That is, after determining the text boundary, text overlay detection can be performed. Figure 6 As shown, the overlay detection process mainly includes the following steps 1 to 4.

[0096] Step 1: According to the content area boundary of the target block, the first pixel matrix of the content area of ​​the target block is obtained. The text boundary of the target block is extracted according to the above method. When the text boundary is extracted, the pixel value binary matrix c in the boundary content area can be obtained, that is, ∑c ij, where ∑c ij ∈C.

[0097] Step 2: Restore the display of other blocks and extract the second pixel matrix of the content area of ​​the target block. Use the high-level programming language js to restore the display of other blocks in the page where the target block is located to reproduce the pixel overlay. After extracting the overlay using the same method as that used to obtain the binary matrix C of the target block pixel value, obtain the binary matrix D of the pixel value within the boundary polygon, and obtain ∑d ij , where ∑d ij ∈C.

[0098] Figure 7 is a schematic diagram of a pixel value matrix according to a method for detecting page overlapping areas according to an embodiment of the present invention. Figure 7 As shown, the binary pixel values ​​in the boundary content area are extracted to obtain the first pixel matrix and the second pixel matrix, that is, the c matrix is ​​the binary pixel matrix after the initial boundary extraction, and the d matrix is ​​the binary pixel matrix after the blocks in the page are superimposed. It can be seen from the figure that the marked area is the pixel intrusion point, that is, the area where there is pixel superposition.

[0099] Step 3: Perform position-wise XOR operation on the first pixel matrix and the second pixel matrix to obtain a third matrix. The points where the element value of the third matrix is ​​1 are the superimposed areas in the page. That is, perform position-wise XOR operation on the c matrix and the d matrix to obtain the third matrix e matrix, that is:

[0100] e ij =c ij xord ij

[0101] According to the XOR operation rules, when the pixel values ​​do not change before and after, the XOR operation result is 0, and when they are different, the XOR operation result is 1, that is, the area where the operation result is 1 is the area where superposition occurs.

[0102] Figure 8 : is a schematic diagram of an XOR processing matrix according to a method for detecting page overlapping areas according to an embodiment of the present invention. The XOR operation is performed on the above-mentioned c matrix and d matrix to obtain the e matrix result as shown in FIG. Figure 8 As shown, the number 0 represents no pixel overlay and 1 represents pixel overlay.

[0103] Step 4: Count the number of all elements in the third matrix and the number of elements with element value 1, and take the percentage of the number of elements with element value 1 to the total number of elements as the overlay area ratio of the page. Detect the overlay area in the page according to the preset threshold and the overlay area ratio, and count the number of elements in the boundary polygon respectively. ijThe percentage P of the superimposed area in the total number of digits and the number of digits whose operation results are 1 can be obtained. For example, by counting the above e matrix, the total number of digits is 24, of which the digit 1 appears 4 times, and the percentage of the superimposed area in the total number is 4 / 24=17%. By comparing P with a preset judgment threshold Q, if P is greater than Q, it can be considered that the pixel intrusion has reached the threshold, that is, text superposition exists; otherwise, it can be considered that the pixel intrusion can be ignored. In theory, the above threshold Q>0 means that pixel intrusion exists. In order to be compatible with errors and visual effects, the Q value can be customized by the user. The present invention is thus achieved.

[0104] Figure 9 FIG. 1 is a schematic diagram of main modules of a device for detecting page overlapping areas according to an embodiment of the present invention. Figure 9 As shown, the apparatus 900 for detecting page overlapping areas according to the embodiment of the present invention mainly includes a boundary determination module 901 , a first matrix module 902 , a second matrix module 903 , and an overlapping detection module 904 .

[0105] The boundary determination module 901 is used to hide other blocks in the page except the target block and determine the content area boundary of the target block;

[0106] A first matrix module 902 is configured to obtain a first pixel matrix of the content area of ​​the target block according to the content area boundary of the target block;

[0107] A second matrix module 903 is used to restore and display other blocks and extract a second pixel matrix of the content area of ​​the target block;

[0108] The overlay detection module 904 is configured to detect an overlay area in the page according to the first pixel matrix and the second pixel matrix.

[0109] In an embodiment of the present invention, the apparatus 900 further includes a sharpening processing module (not shown in the figure) for performing sharpening processing on the page.

[0110] According to an embodiment of the present invention, the sharpening processing module is further configured to: set the background color of the page to white; set the background color of the target block to completely transparent; and set the content color of the target block to black.

[0111] According to another embodiment of the present invention, the boundary determination module 901 is further used to: obtain the position and size of the content area of ​​the target block; extract the pixel value of each pixel in the content area of ​​the target block; convert the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtain the content area boundary of the target block based on the binary pixel matrix.

[0112] In an embodiment of the present invention, the device 900 also includes a denoising processing module (not shown in the figure), which is used to: set isolated 0 values ​​in the binary pixel matrix to 1 for denoising, where 0 is the binary value corresponding to the black point and 1 is the binary value corresponding to the white point.

[0113] In an embodiment of the present invention, the pixel value of each pixel point in the content area of ​​the target block is a color pixel value; the boundary determination module 901 is further used to: convert the color pixel value into a grayscale single-channel pixel value; convert the grayscale single-channel pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block.

[0114] According to another embodiment of the present invention, the boundary determination module 901 is further used to: create a canvas covering the page; draw and display the page on the canvas based on the page rendering tree; and read the pixel value of each pixel in the content area of ​​the target block in sequence through the canvas.

[0115] In an embodiment of the present invention, the boundary determination module 901 is further configured to convert the single-channel pixel value of the grayscale image into a binary value according to the expected value of the single-channel pixel value of the grayscale image.

[0116] In an embodiment of the present invention, the boundary determination module 901 is further configured to: when the single-channel pixel value of the grayscale image is not less than the expected value of the single-channel pixel value of the grayscale image, the binary value is 1; otherwise, the binary value is 0.

[0117] In an embodiment of the present invention, the boundary determination module 901 is further used to: scan the binary pixel matrix to extract the boundary vertices of each row, the boundary vertices including the left boundary vertex and the right boundary vertex, the left boundary vertex is the point corresponding to the first 0 value appearing in a row, and the right boundary vertex is the point corresponding to the last 0 value appearing in a row, where 0 is the binary value corresponding to the black dot; and connect the boundary vertices of each row with a straight line to obtain the content area boundary of the target block.

[0118] According to another embodiment of the present invention, the overlap detection module 904 is further configured to: perform an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix, and detect overlap areas in the page according to the third matrix.

[0119] In an embodiment of the present invention, the overlay detection module 904 is further configured to perform an XOR operation on the first pixel matrix and the second pixel matrix by position to obtain a third matrix; wherein the points with element values ​​of 1 in the third matrix are the overlay areas in the page.

[0120] In an embodiment of the present invention, the overlay detection module 904 is further used to: perform an XOR operation on the first pixel matrix and the second pixel matrix according to position to obtain a third matrix; count the number of all elements in the third matrix, and the number of elements with an element value of 1; take the percentage of the number of elements with an element value of 1 to the total number of elements as the overlay area ratio of the page; and detect the overlay area in the page based on a preset threshold and the overlay area ratio.

[0121] Figure 10 An exemplary system architecture 1000 is shown to which the method for detecting a page overlay area or the apparatus for detecting a page overlay area according to an embodiment of the present invention may be applied.

[0122] like Figure 10 As shown, system architecture 1000 may include terminal devices 1001, 1002, and 1003, a network 1004, and a server 1005. Network 1004 is used to provide a medium for communication links between terminal devices 1001, 1002, and 1003 and server 1005. Network 1004 may include various connection types, such as wired or wireless communication links or fiber optic cables.

[0123] Users can use terminal devices 1001, 1002, and 1003 to interact with server 1005 via network 1004 to receive or send messages, etc. Various client applications can be installed on terminal devices 1001, 1002, and 1003, such as web applications, overlay testing tools, search applications, etc. (only as examples).

[0124] The terminal devices 1001 , 1002 , and 1003 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop computers, and desktop computers.

[0125] Server 1005 may be a server that provides various services, such as a background management server (for example only) that supports test tools browsed by users using terminal devices 1001, 1002, and 1003. The background management server may analyze and process received data such as pixel values, and feedback the processing results (for example, whether a page overlay is generated - for example only) to the terminal device.

[0126] It should be noted that the method for detecting page overlapping areas provided in the embodiment of the present invention is generally executed by the server 1005 . Accordingly, the device for detecting page overlapping areas is generally disposed in the server 1005 .

[0127] It should be understood that Figure 10 The number of terminal devices, networks and servers in the embodiment is merely illustrative. Any number of terminal devices, networks and servers may be provided as required.

[0128] Reference below Figure 11 , which shows a structural diagram of a computer system 1100 of a terminal device or server suitable for implementing an embodiment of the present invention. Figure 11 The terminal device or server shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.

[0129] like Figure 11 As shown, the computer system 1100 includes a central processing unit (CPU) 1101, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 1102 or a program loaded from a storage unit 1108 into a random access memory (RAM) 1103. Various programs and data required for the operation of the system 1100 are also stored in the RAM 1103. The CPU 1101, the ROM 1102, and the RAM 1103 are connected to each other via a bus 1104. An input / output (I / O) interface 1105 is also connected to the bus 1104.

[0130] The following components are connected to the I / O interface 1105: an input section 1106 including a keyboard, a mouse, and the like; an output section 1107 including devices such as a cathode ray tube (CRT), a liquid crystal display (LCD), and a speaker; a storage section 1108 including a hard disk; and a communication section 1109 including a network interface card such as a LAN card or a modem. The communication section 1109 performs communication processing via a network such as the Internet. A drive 1110 is also connected to the I / O interface 1105 as needed. Removable media 1111, such as a magnetic disk, an optical disk, a magneto-optical disk, or a semiconductor memory, is installed in the drive 1110 as needed, so that computer programs read therefrom can be installed into the storage section 1108 as needed.

[0131] In particular, according to the embodiments disclosed in the present invention, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, the embodiments disclosed in the present invention include a computer program product comprising a computer program carried on a computer-readable medium, the computer program comprising program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network via the communication section 1109, and / or installed from a removable medium 1111. When the computer program is executed by the central processing unit (CPU) 1101, the above-mentioned functions defined in the system of the present invention are performed.

[0132] It should be noted that the computer-readable medium described in the present invention can be a computer-readable signal medium or a computer-readable storage medium, or any combination thereof. A computer-readable storage medium can be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of computer-readable storage media can include, but are not limited to, an electrical connection having one or more conductors, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination thereof. In the present invention, a computer-readable storage medium can be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, apparatus, or device. In the present invention, a computer-readable signal medium can include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code. This propagated data signal can take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can transmit, propagate, or transport a program for use by or in conjunction with an instruction execution system, apparatus, or device. Program code embodied on a computer-readable medium may be transmitted using any suitable medium, including but not limited to wireless, wireline, optical fiber cable, RF, or any suitable combination thereof.

[0133] The flowcharts and block diagrams in the accompanying drawings illustrate the possible implementation architecture, functions and operations of the systems, methods and computer program products according to various embodiments of the present invention. In this regard, each box in the flowchart or block diagram can represent a module, program segment, or a part of code, and the above-mentioned module, program segment, or a part of code contains one or more executable instructions for implementing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in an order different from that marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram or flowchart, and the combination of boxes in the block diagram or flowchart, can be implemented with a dedicated hardware-based system that performs the specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0134] The units or modules involved in the embodiments of the present invention may be implemented in software or in hardware. The units or modules described may also be provided in a processor. For example, they may be described as follows: a processor includes a boundary determination module, a first matrix module, a second matrix module, and an overlay detection module. The names of these units or modules do not, in certain cases, constitute limitations on the units or modules themselves. For example, the boundary determination module may also be described as a "module for hiding blocks other than a target block in a page and determining the boundaries of the content area of ​​the target block."

[0135] As another aspect, the present invention further provides a computer-readable medium, which may be included in the device described in the above embodiment; or may exist independently and not be incorporated into the device. The computer-readable medium carries one or more programs. When the one or more programs are executed by the device, the device is caused to: hide other blocks in a page except a target block and determine the content area boundary of the target block; obtain a first pixel matrix of the content area of ​​the target block based on the content area boundary of the target block; restore the display of the other blocks and extract a second pixel matrix of the content area of ​​the target block; and detect an overlapping area in the page based on the first pixel matrix and the second pixel matrix.

[0136] According to the technical solution of the embodiment of the present invention, other blocks except the target block in the hidden page are used, and the content area boundary of the target block is determined; based on the content area boundary of the target block, a first pixel matrix of the content area of ​​the target block is obtained; the other blocks are restored and displayed, and a second pixel matrix of the content area of ​​the target block is extracted; and a technical means of detecting the superimposed area in the page based on the first pixel matrix and the second pixel matrix improves the accuracy and intelligence on the basis of realizing automatic detection, is easy to use and operate, saves time and labor costs, and this method is universal, dynamically solves the overlap misjudgment problem caused by the overlap of page blank margins, and can more accurately and effectively judge whether there is overlap in the actual content of the page, thereby improving the overall quality of the web page and enhancing the user experience.

[0137] The above specific embodiments do not limit the scope of protection of the present invention. Those skilled in the art will appreciate that various modifications, combinations, sub-combinations, and substitutions may occur depending on design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of the present invention are intended to be included within the scope of protection of the present invention.

Claims

1. A method for detecting page overlay areas, characterized in that: include: Hide other blocks in the page except the target block, and determine the content area boundary of the target block; Obtaining a first pixel matrix of the content area of ​​the target block according to a content area boundary of the target block; Resuming display of the other blocks, and extracting a second pixel matrix of the content area of ​​the target block; Detecting an overlapping area in the page according to the first pixel matrix and the second pixel matrix, comprising: performing an XOR operation on the first pixel matrix and the second pixel matrix according to positions to obtain a third matrix, and detecting the overlapping area in the page according to the third matrix; Determining the content area boundary of the target block includes: obtaining the position and size of the content area of ​​the target block; extracting the pixel value of each pixel in the content area of ​​the target block; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtaining the content area boundary of the target block according to the binary pixel matrix.

2. The method according to claim 1, characterized in that Before determining the content area boundary of the target block, the method further includes: The page is sharpened.

3. The method according to claim 2, characterized in that The sharpening process includes: Setting the background color of the page to white; Setting the background color of the target block to a completely transparent color; The content color of the target block is set to black.

4. The method according to claim 1, wherein Before obtaining the content area boundary of the target block according to the binary pixel matrix, the method further includes: Isolated 0 values ​​in the binary pixel matrix are set to 1 to perform denoising, wherein 0 is the binary value corresponding to a black point and 1 is the binary value corresponding to a white point.

5. The method according to claim 1, characterized in that The pixel value of each pixel point in the content area of ​​the target block is a color pixel value; Converting the pixel values ​​into binary values ​​to obtain a binary pixel matrix corresponding to the content area of ​​the target block includes: Convert the color pixel value into a grayscale single-channel pixel value; The single-channel pixel values ​​of the grayscale image are converted into binary values ​​to obtain a binary pixel matrix corresponding to the content area of ​​the target block.

6. The method according to claim 1 or 5, characterized in that Extracting the pixel value of each pixel in the content area of ​​the target block includes: Create a canvas that covers the page; Drawing the page on the canvas based on the page rendering tree and displaying it; The pixel value of each pixel in the content area of ​​the target block is read in sequence through the canvas.

7. The method according to claim 5, characterized in that Converting the single-channel pixel value of the grayscale image into a binary value includes: The single-channel pixel value of the grayscale image is converted into a binary value according to the expected value of the single-channel pixel value of the grayscale image.

8. The method according to claim 5 or 7, characterized in that Converting the single-channel pixel value of the grayscale image into a binary value includes: When the pixel value of the single channel of the grayscale image is not less than the expected value of the pixel value of the single channel of the grayscale image, the binary value is 1, otherwise the binary value is 0.

9. The method according to claim 1, characterized in that Obtaining the content area boundary of the target block according to the binary pixel matrix includes: Scan the binary pixel matrix to extract boundary vertices of each row, where the boundary vertices include a left boundary vertex and a right boundary vertex, where the left boundary vertex is the point corresponding to the first 0 value in a row, and the right boundary vertex is the point corresponding to the last 0 value in a row, where 0 is the binary value corresponding to a black dot; The boundary vertices of each row are connected by straight lines to obtain the content area boundary of the target block.

10. The method according to claim 1, characterized in that The points with element values ​​of 1 in the third matrix are the overlapping areas in the page.

11. The method according to claim 1, characterized in that Detecting the superimposed area in the page according to the third matrix includes: Performing an XOR operation on the first pixel matrix and the second pixel matrix according to positions to obtain a third matrix; Counting the number of all elements in the third matrix and the number of elements whose value is 1; The percentage of the number of elements with the element value of 1 to the total number of elements is used as the overlay area ratio of the page; The overlapping area in the page is detected according to a preset threshold and the overlapping area ratio.

12. A device for detecting page overlapping areas, characterized in that: include: A boundary determination module is used to hide other blocks in the page except the target block and determine the content area boundary of the target block; A first matrix module, configured to obtain a first pixel matrix of the content area of ​​the target block according to a content area boundary of the target block; A second matrix module, configured to restore and display the other blocks and extract a second pixel matrix of the content area of ​​the target block; an overlay detection module, configured to detect an overlay area in the page based on the first pixel matrix and the second pixel matrix, comprising: performing an XOR operation on the first pixel matrix and the second pixel matrix based on positions to obtain a third matrix, and detecting the overlay area in the page based on the third matrix; Determining the content area boundary of the target block includes: obtaining the position and size of the content area of ​​the target block; extracting the pixel value of each pixel in the content area of ​​the target block; converting the pixel value into a binary value to obtain a binary pixel matrix corresponding to the content area of ​​the target block; and obtaining the content area boundary of the target block according to the binary pixel matrix.

13. An electronic device for detecting page overlap areas, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 11.

14. A computer-readable medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 11 is implemented.

Images