CN116610244A - Thumbnail display control method, device, equipment and storage medium - Google Patents

Thumbnail display control method, device, equipment and storage medium Download PDF

Info

Publication number
CN116610244A
CN116610244A CN202310485541.7A CN202310485541A CN116610244A CN 116610244 A CN116610244 A CN 116610244A CN 202310485541 A CN202310485541 A CN 202310485541A CN 116610244 A CN116610244 A CN 116610244A
Authority
CN
China
Prior art keywords
original image
thumbnail
size
target
end page
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202310485541.7A
Other languages
Chinese (zh)
Inventor
唐瑜
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Baidu Netcom Science and Technology Co Ltd
Original Assignee
Beijing Baidu Netcom Science and Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Baidu Netcom Science and Technology Co Ltd filed Critical Beijing Baidu Netcom Science and Technology Co Ltd
Priority to CN202310485541.7A priority Critical patent/CN116610244A/en
Publication of CN116610244A publication Critical patent/CN116610244A/en
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0483Interaction with page-structured environments, e.g. book metaphor
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06VIMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
    • G06V10/00Arrangements for image or video recognition or understanding
    • G06V10/40Extraction of image or video features
    • G06V10/46Descriptors for shape, contour or point-related descriptors, e.g. scale invariant feature transform [SIFT] or bags of words [BoW]; Salient regional features
    • G06V10/462Salient features, e.g. scale invariant feature transforms [SIFT]
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/048Indexing scheme relating to G06F3/048
    • G06F2203/04806Zoom, i.e. interaction techniques or interactors for controlling the zooming operation

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Computer Vision & Pattern Recognition (AREA)
  • Multimedia (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The disclosure provides a thumbnail display control method, device, equipment and storage medium, relates to the technical field of image processing, and in particular relates to the technical fields of image scaling, thumbnail, image generation, thumbnail display and the like, and can be applied to scenes such as webpage display of thumbnails and display of thumbnails in a forum article catalog list. The specific implementation scheme comprises the following steps: performing significance detection on an original image to obtain a significance region of the original image; cutting and scaling the original image according to the sizes of the saliency area and the front page to obtain a target thumbnail corresponding to the original image; and displaying the target thumbnail on the front-end page. The method and the device can conveniently and quickly generate high-quality thumbnails of different sizes for different front-end pages, the thumbnails can better express information contained in original pictures, and the display effect of the thumbnails on the front-end pages is greatly improved.

Description

Thumbnail display control method, device, equipment and storage medium
Technical Field
The disclosure relates to the technical field of image processing, in particular to the technical fields of image scaling, thumbnail generation, thumbnail display and the like, and can be applied to scenes such as webpage display thumbnail, forum article catalog list display thumbnail display and the like, and particularly relates to a thumbnail display control method, device, equipment and storage medium.
Background
With the development of digital technology and network technology, the use rate of pictures in various large APP (application software) is higher and higher, more and more reading scenes are accompanied with the appearance of the pictures, but the space occupied by the pictures on a screen is quite large, one picture may occupy the whole screen, and in order to enable more pictures to be loaded in one screen to present more information, thumbnail images are often used to replace original pictures.
The way in which the thumbnail is currently presented may include: and cutting out a picture with a standard size from a fixed position of the original picture to be displayed as a thumbnail, or filling and scaling the original picture to obtain an image with the standard size to be displayed as the thumbnail.
However, in the conventional manner of displaying the thumbnail, the thumbnail cannot well express the information contained in the original image, and the display effect of the thumbnail on the front page is poor.
Disclosure of Invention
The method, the device, the equipment and the storage medium for thumbnail display control can conveniently and quickly generate high-quality thumbnails of different sizes for different front-end pages, the thumbnails can better express information contained in original pictures, and the display effect of the thumbnails on the front-end pages is greatly improved.
According to a first aspect of the present disclosure, there is provided a thumbnail display control method including:
performing significance detection on an original image to obtain a significance region of the original image; cutting and scaling the original image according to the sizes of the saliency area and the front page to obtain a target thumbnail corresponding to the original image; and displaying the target thumbnail on the front-end page.
According to a second aspect of the present disclosure, there is provided a thumbnail display control apparatus including: the device comprises a detection unit, a scaling unit and a display unit.
The detection unit is used for carrying out significance detection on the original image to obtain a significance region of the original image. And the scaling unit is used for cutting and scaling the original image according to the sizes of the saliency area and the front page to obtain a target thumbnail corresponding to the original image. And the display unit is used for displaying the target thumbnail on the front-end page.
According to a third aspect of the present disclosure, there is provided an electronic device comprising: at least one processor; and a memory communicatively coupled to the at least one processor; wherein the memory stores instructions executable by the at least one processor to enable the at least one processor to perform a method as in the first aspect.
According to a fourth aspect of the present disclosure, there is provided a non-transitory computer readable storage medium storing computer instructions for causing a computer to perform the method according to the first aspect.
According to a fifth aspect of the present disclosure, there is provided a computer program product comprising a computer program which, when executed by a processor, implements the method according to the first aspect.
It should be understood that the description in this section is not intended to identify key or critical features of the embodiments of the disclosure, nor is it intended to be used to limit the scope of the disclosure. Other features of the present disclosure will become apparent from the following specification.
Drawings
The drawings are for a better understanding of the present solution and are not to be construed as limiting the present disclosure. Wherein:
fig. 1 is a schematic flow chart of a thumbnail display control method according to an embodiment of the present disclosure;
fig. 2 is a schematic flowchart of an implementation of S102 provided in an embodiment of the disclosure;
FIG. 3 is a schematic flow chart of a thumbnail display control method according to an embodiment of the present disclosure;
fig. 4 is a schematic flowchart of an implementation of the thumbnail display control method provided in the embodiment of the present disclosure applied to a terminal device for displaying a front-end page;
Fig. 5 is a schematic diagram of the composition of a thumbnail display control apparatus provided in an embodiment of the present disclosure;
fig. 6 is a schematic block diagram of an example electronic device 600 that may be used to implement embodiments of the present disclosure provided by embodiments of the present disclosure.
Detailed Description
Exemplary embodiments of the present disclosure are described below in conjunction with the accompanying drawings, which include various details of the embodiments of the present disclosure to facilitate understanding, and should be considered as merely exemplary. Accordingly, one of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the present disclosure. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.
It should be appreciated that in embodiments of the present disclosure, the character "/" generally indicates that the context associated object is an "or" relationship. The terms "first," "second," and the like are used for descriptive purposes only and are not to be construed as indicating or implying relative importance or implicitly indicating the number of technical features indicated.
With the development of digital technology and network technology, the use rate of pictures in various large application software (APP) is higher and higher, more and more reading scenes are accompanied with the appearance of the pictures, but the space occupied by the pictures on a screen is quite large, one picture may occupy the whole screen, and in order to enable more pictures to be loaded in one screen to present more information, thumbnail images are often used to replace original pictures.
Illustratively, the thumbnail is smaller in size than the original, and the thumbnail contains substantially the same information as the original, so that the content information of the original can be expressed in a generalized manner. For example, an image of a certain animal is scaled to one half of the original image in equal proportion, the animal type on the image can be identified, the image is reduced, the area of the screen occupied by the image is reduced, and the whole screen can display more images.
The way in which the thumbnail is currently presented may include: and cutting out a picture with a standard size from a fixed position of the original picture to be displayed as a thumbnail, or filling and scaling the original picture to obtain an image with the standard size to be displayed as the thumbnail.
Illustratively, cutting out a picture with standard size from a fixed position of the original image as a thumbnail for display means cutting out a partial image with standard size from the original image as a thumbnail for display with a certain point on the original image as the center; filling and scaling the original image to obtain an image with a standard size as a thumbnail for display, namely filling the background of the original image to a proper size proportion by using pure colors, and then displaying the image with the standard size by scaling the filled image in an equal proportion.
However, in the conventional manner of displaying the thumbnail, the thumbnail cannot well express the information contained in the original image, and the display effect of the thumbnail on the front page is poor.
By way of example, the manner of cutting out the standard-size picture from the fixed position of the original picture as the thumbnail for displaying is simple and direct, but the quality of the generated thumbnail is not good, because the size of the thumbnail is generally inconsistent with that of the original picture, the thumbnail obtained by cutting out the original picture is very likely to be only a small part of the original picture, and the original picture cannot be completely contained, so that a user cannot acquire sufficient information from the thumbnail and ignore corresponding related content; the thumbnail generated by filling and then scaling the original image contains the whole original image, but the visual effect of the whole display is not harmonious enough due to the existence of filling color, and the content of the whole original image is scaled into a small thumbnail, so that the content of the thumbnail becomes blurred, and the information contained in the original image cannot be expressed well.
Under the background technology, the disclosure provides a thumbnail display control method, which can generate high-quality thumbnails of different sizes for different front-end pages conveniently and rapidly, and the thumbnails can better express information contained in original pictures, and greatly improve the display effect of the thumbnails on the front-end pages.
The execution subject of the thumbnail presentation control method may be a computer or a server, or may be another device having data processing capability, for example. The subject of execution of the method is not limited herein.
In some embodiments, the server may be a single server, or may be a server cluster formed by a plurality of servers. In some implementations, the server cluster may also be a distributed cluster. The present disclosure is not limited to a specific implementation of the server.
Fig. 1 is a flowchart illustrating a thumbnail display control method according to an embodiment of the present disclosure. As shown in fig. 1, the method may include:
s101, performing saliency detection on an original image to obtain a saliency area of the original image.
For example, a deep learning algorithm or a picture saliency algorithm may be used to perform saliency detection on an original image, so as to obtain a saliency region of the original image and position information corresponding to the saliency region in the original image. The original image may be an image uploaded by the user to the image storage server and may also be a frame of image taken from a video. The position information corresponding to the saliency region in the original image may be pixel point coordinates of the saliency region in the original image.
For example, the saliency detection is performed on an image of a person, and the saliency area of the image can be obtained to be a face area.
S102, cutting and scaling the original image according to the saliency area and the size of the front page to obtain a target thumbnail corresponding to the original image.
Illustratively, taking the back-end server as an execution subject, the display device of the front-end may send a request to browse the thumbnail to the back-end server. When the back-end server receives a request for browsing the thumbnail, judging whether the corresponding thumbnail exists or not, and if the corresponding thumbnail does not exist, cutting out an image with a proper size from the corresponding original image as the thumbnail by the back-end server according to the detected saliency area, the corresponding position information of the saliency area in the original image and the size of the front-end page; the size of the front page refers to the size information of the request source page of the browsing thumbnail, and the request of browsing the thumbnail contains the size information of the request source page, that is, the request of browsing the thumbnail contains the size information of the front page.
For example, when a request for browsing the thumbnail of an image of a person is received, the image of the person is an original image, if the server does not have a corresponding thumbnail at this time, it is detected that the salient region of the image is a face region, the midpoint of the face region is the midpoint of the image, the aspect ratio of the front page is 200mm to 100mm, it is assumed that the server determines that the aspect ratio of the thumbnail is 20mm to 10mm according to the above information, and the server cuts out a rectangular image with the aspect ratio of 20mm to 10mm with the midpoint of the original image as the thumbnail of the original image and returns the rectangular image to the front for display.
S103, displaying the target thumbnail on the front-end page.
Illustratively, the back-end server returns the cropped thumbnail to the front-end, and the front-end directly displays the received thumbnail without performing other cropping operations.
According to the method for detecting the saliency of the original image, the saliency area of the original image and the position information of the saliency area in the original image can be obtained, the image with the proper size is cut out from the corresponding original image and displayed as the thumbnail according to the detected saliency area, the position information corresponding to the saliency area in the original image and the size information of the front-end page contained in the thumbnail browsing request, the high-quality thumbnail with different sizes can be conveniently and rapidly generated for each different front-end page, the information contained in the original image can be well expressed by the thumbnail, and the display effect of the thumbnail on the front-end page is greatly improved.
Fig. 2 is a schematic flowchart of an implementation of S102 provided in an embodiment of the disclosure. As shown in fig. 2, S102 may further include:
s201, acquiring the size of the front-end page and a thumbnail pattern configuration file, wherein the thumbnail pattern configuration file comprises the size proportion of the thumbnail corresponding to the front-end page.
For example, a configuration file may be preset, where the configuration file may include patterns of corresponding different thumbnails manually preset according to different front-end page sizes, for example, the configuration file may specify that the width ratio of the front-end page to the corresponding thumbnail is 2:1, the height ratio of the front-end page to the corresponding thumbnail is 3:1, and so on.
For example, it may be preset that the thumbnail corresponding to the front page with the aspect ratio of 200mm to 100mm has the aspect ratio of 20mm to 10mm, that is, the width of the front page to the corresponding thumbnail has the aspect ratio of 10 to 1, and the height of the front page to the corresponding thumbnail has the aspect ratio of 10 to 1; the thumbnail width-to-height ratio corresponding to the front page with the width-to-height ratio of 100mm to 100mm is 50mm to 20mm, and the like, the width ratio of the front page to the corresponding thumbnail is 2 to 1, and the height ratio of the front page to the corresponding thumbnail is 5 to 1.
S202, cutting and scaling the original image according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image.
The server reads the thumbnail size corresponding to the front end page size from the preset configuration file according to the front end page size contained in the browsing request after receiving the browsing thumbnail request, and then cuts out an image with a proper size from the corresponding original image as a thumbnail according to the detected saliency area, the position information corresponding to the saliency area in the original image, the size of the front end page and the thumbnail size corresponding to the size of the front end page read from the configuration file.
For example, the server receives a browse thumbnail request, the front-end page aspect ratio included in the browse request is 100mm:80mm, the corresponding thumbnail aspect ratio is 25mm:20mm when the front-end page aspect ratio specified in the configuration file is read, and then the server cuts the original image into an image with the aspect ratio of 25mm:20mm as the thumbnail of the original image according to the detected saliency area and the corresponding position information of the saliency area in the original image.
According to the embodiment, through presetting a configuration file, the configuration file can contain corresponding different thumbnail patterns artificially preset according to the sizes of different front-end pages, the proper thumbnail patterns can be flexibly configured for the front-end pages with different sizes, simultaneously, the thumbnail patterns of the different front-end pages can be uniformly managed in the configuration file, the thumbnail display effect of each page can be controlled without more additional operations, the working efficiency of thumbnail generation is improved, the time for returning the thumbnail to the front end is reduced, and the experience of a user is improved.
In some embodiments, the thumbnail style configuration file further includes first indication information; the first indication information is used for indicating whether the original image is cut and scaled; cutting and scaling the original image according to the saliency area, the size of the front page and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image, wherein the method comprises the following steps:
When the first indication information indicates that the original image is cut and scaled, the original image is cut and scaled according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page, and the target thumbnail corresponding to the original image is obtained.
The first indication information is used for indicating whether to cut and scale the original image, and when the first indication information indicates to cut and scale the original image, the server cuts and scales the original image according to the detected saliency area, the position information corresponding to the saliency area in the original image, the size of the front page and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image; when the first indication information indicates that the original image is not cut and scaled, the server directly returns the original image to the front end for display.
For example, at the mobile phone end, the mobile phone screen is smaller, a certain original image is larger in size, a thumbnail needs to be displayed, the first indication information indicates that the original image is cut and scaled, and the server cuts and scales the original image according to the detected saliency area, the position information corresponding to the saliency area in the original image, the size of the front page and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image; at the computer end, the computer screen is larger, a certain original image is smaller in size, the thumbnail does not need to be displayed, the first indication information indicates that the original image is not cut and scaled, and the server directly returns the original image to the front end for displaying.
According to the embodiment, whether the original image is cut and scaled is indicated by the first indication information according to the front-end pages with different sizes, so that the thumbnail attached to each front-end page can be generated, and the overall display effect of the front-end pages can be enhanced.
For example, taking the back-end server as an execution subject, the display device at the front-end may send a request for browsing thumbnail images to the back-end server, and may enable the back-end server to return thumbnail images of different styles according to different sources of the thumbnail image browsing request.
In some embodiments, clipping and scaling the original image according to the saliency area, the size of the front page, and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image, including:
when the size of the original image is larger than the first size and smaller than the second size, cutting and scaling the original image according to the saliency area, the size of the front page and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image.
The thumbnail display control method may further include:
and when the size of the original image is smaller than the first size or larger than the second size, scaling the original image according to the size of the front page and the size proportion of the thumbnail corresponding to the front page to obtain a target thumbnail corresponding to the original image.
For example, the first size and the second size may be a preset value, and the thumbnail obtained by clipping the original image in the range larger than the first size and smaller than the second size may achieve the expected effect, that is, the thumbnail obtained by clipping the original image in the range may express the content information of the original image more completely, and the overall visual effect is also better.
When the size of the original image is smaller than the first size, the original image is too small to be cut, and when the size of the original image is larger than the second size, the original image is too large, and at the moment, a high-quality thumbnail cannot be obtained by cutting any more; therefore, when the size of the original image is smaller than the first size or larger than the second size, the second indication information indicates that the original image is not cut, and the original image is directly scaled according to the size of the front page and the size proportion of the thumbnail corresponding to the front page, so that the target thumbnail corresponding to the original image is obtained. The second indication information is used for not clipping the original image when the size of the original image is smaller than the first size or larger than the second size.
For example, it may be provided that the first dimension width to front page width ratio is 1:50, the first dimension height to front page height ratio is 1:80, the second dimension width to front page width ratio is 40:1, the second dimension height to front page height ratio is 20:1, if the front page aspect ratio is 100mm:240mm, the first dimension aspect ratio is 2mm:3mm, and the second dimension aspect ratio is 4000mm:4800mm; when the width of the original image is larger than 2mm and smaller than 4000mm, and the height of the original image is larger than 3mm and smaller than 4800mm, the original image can be cut and scaled according to the saliency area, the size of the front page and the size proportion of the thumbnail corresponding to the front page, so that a target thumbnail corresponding to the original image is obtained; when the width of the original image is smaller than 2mm or larger than 4000mm, and the height of the original image is smaller than 3mm or larger than 4800mm, namely the size of the original image is smaller than the first size or larger than the second size, the second indication information indicates that the original image is not cut, and the original image is directly scaled according to the size of the front page and the size proportion of the thumbnail corresponding to the front page, so that the target thumbnail corresponding to the original image is obtained.
According to the embodiment, when the size of the original image is smaller than the first size or larger than the second size, the second indication information indicates that the original image is not cut, the original image is directly scaled according to the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page, the target thumbnail corresponding to the original image is obtained, special situations when the picture is too large or too small are covered, and corresponding thumbnails can be comprehensively generated for different original images according to different front-end pages.
In some embodiments, location information of a salient region of an original image and a target thumbnail are saved.
For example, after detecting the position information of the salient region of the original image corresponding to the salient region in the original image, the position information of the salient region of the original image may be stored in the database. The target thumbnail obtained after clipping can be stored while the rear end returns the target thumbnail to the front end.
According to the method and the device, the position information of the salient region of the original image is stored in the database, so that the subsequent use of the position information data of the salient region can be facilitated, and the working efficiency of generating the target thumbnail can be improved. When the rear end returns the target thumbnail obtained after cutting to the front end, by synchronously storing the target thumbnail, the thumbnail stored before can be directly returned to the front end when the same thumbnail browsing request arrives at the rear end server next time, secondary calculation is not needed, the step of displaying the thumbnail is simplified, and the efficiency of displaying the thumbnail is improved.
Fig. 3 is a schematic flow chart of a thumbnail display control method according to an embodiment of the present disclosure.
As shown in fig. 3, the thumbnail display control method may further include:
S301, identifying each target thumbnail to obtain definition of each target thumbnail and at least one piece of content attribute information.
For example, text recognition and classification recognition can be performed on each target thumbnail respectively, so as to obtain information such as definition, picture category, text content and the like of each target thumbnail. The information such as the picture category and the text content may be referred to as content attribute information.
For example, in a scenario where a forum article catalog list is displayed, the number of pictures contained in each article may be far greater than the number of thumbnails that can be displayed on a page, so that only a part of pictures can be selected for display, for example, text recognition and classification recognition are performed on each target thumbnail contained in a certain article, so as to obtain information such as definition, picture category, text content and the like of each target thumbnail.
S302, carrying out correlation detection on the target thumbnails and the front page according to at least one piece of content attribute information and the content information of the front page, and obtaining the similarity between each target thumbnail and the front page.
For example, text correlation detection can be performed on the picture category of each target thumbnail and the text content contained in the picture with the article title and content, when text correlation detection is performed, a BERT pre-training model is used to generate sentence vectors, then the similarity of the picture category of each target thumbnail and the article title and content to which the target thumbnail belongs is calculated as first similarity, the similarity of the text content contained in each target thumbnail and the article title and content to which the target thumbnail belongs is calculated as second similarity, and finally the average of the first similarity and the second similarity is calculated as the similarity of each target thumbnail and the front-end page.
For example, the similarity between the picture category of each target thumbnail and the title and content of the affiliated article is calculated to be 80%, that is, the first similarity is 80%, and the similarity between the text content of each target thumbnail and the title and content of the affiliated article is calculated to be 90%, that is, the second similarity is 90%, so that the average of the first similarity and the second similarity is 85%, so that the similarity between each target thumbnail and the front page is 85%.
S303, determining the quality fraction of the target thumbnail according to the similarity between the target thumbnail and the front-end page and the definition of the target thumbnail.
Illustratively, the average of the similarity obtained in S302 and the sharpness detected in S301 may be calculated, and the score of the final picture may be obtained based on the calculated average.
For example, assuming that the definition of a certain target thumbnail is detected to be 90%, and the similarity of the target thumbnail is calculated to be 85%, the average of the definition and the similarity of the target thumbnail is obtained to be 87.5%, the mass fraction of the target thumbnail can be determined to be 87.5.
S304, target thumbnails with the quality scores meeting preset conditions are screened from at least two target thumbnails, and the target thumbnails are displayed on a front-end page.
The preset condition may be three pictures with the top three scores, or may be pictures with scores higher than 90 scores, etc.
For example, assuming that the preset condition is three pictures with top three scores, if five target thumbnails are provided, the score of fig. 1 is 90, the score of fig. 2 is 98, the score of fig. 3 is 76, the score of fig. 4 is 80, and the score of fig. 5 is 87, then the front page of fig. 1, fig. 2, and fig. 5 is selected for display.
According to the method, the device and the system, the information such as the definition, the picture category and the text content of each target thumbnail is obtained through text recognition and classification recognition on each target thumbnail, then the picture category of each target thumbnail, the similarity of the text title and the content of the text title are calculated to be the first similarity, the similarity of the text content contained in each target thumbnail and the similarity of the text title and the content of the text title are calculated to be the second similarity, the average of the first similarity and the second similarity is used as the similarity between each target thumbnail and the front page, the quality score of the target thumbnail is determined according to the similarity between the target thumbnail and the front page and the definition of the target thumbnail, finally the target thumbnail with the quality score meeting the preset condition is screened out from at least two target thumbnails, the target thumbnail is displayed on the front page, the thumbnail with higher content relevance to be displayed on the front page can be accurately selected under the condition similar to the display scene of the article catalog list of a forum, the quality of the whole content displayed on the front page is improved, and the click rate of a user is increased.
Fig. 4 is a schematic flow chart of a thumbnail display control method applied to a terminal device for displaying a front-end page according to an embodiment of the present disclosure. As shown in fig. 4, the thumbnail display control method may further include:
s401, receiving the original image issued by the server and the position information of the salient region of the original image.
For example, the server may be configured to directly issue the original image and the location information of the salient region of the original image at a part of the front page.
For example, assuming that the original image is a certain personal image, the positional information of the salient region of the certain personal image is an aspect ratio of 1 with the midpoint of the original image as the midpoint: 1.5, when the front page needs to display the character image, the server will set the position information of the character image and the salient region of the character image, that is, the aspect ratio taking the midpoint of the original image as the midpoint is 1:1.5, and issued together to the front page.
S402, determining the salient region of the original image according to the position information of the salient region of the original image.
Illustratively, according to the original image issued by the server and the position information of the salient region of the original image, the salient region of the original image is determined, and the front-end page displays part of original image as a target thumbnail according to the salient region of the original image.
For example, the server will determine the position information of a certain character image and the salient region of the character image, that is, the aspect ratio with the midpoint of the original image as the midpoint is 1:1.5, and forward the same to the front page, the front page will have an aspect ratio of 1 with the midpoint of the original image as the midpoint: 1.5 is presented as a target thumbnail.
S403, responding to the operation of clicking the target thumbnail on the front-end page by a user, and displaying the original image locally.
Illustratively, when a user clicks on a thumbnail to view a large image, the front page will directly show the original image.
According to the method, the device and the system, the server directly sends the original image and the position information of the salient region of the original image to the front-end page, the front-end page determines the salient region of the original image according to the original image and the position information of the salient region of the original image sent by the server, and displays part of original images as target thumbnails according to the salient region of the original image.
In an exemplary embodiment, the present disclosure also provides a thumbnail display control apparatus, which may be used to implement the thumbnail display control method as in the foregoing embodiment. Fig. 5 is a schematic diagram of the composition of a thumbnail display control apparatus according to an embodiment of the present disclosure. As shown in fig. 5, the apparatus may include: a detection unit 501, a scaling unit 502, a presentation unit 503.
The detecting unit 501 is configured to perform saliency detection on an original image, so as to obtain a saliency area of the original image.
And the scaling unit 502 is configured to crop and scale the original image according to the saliency area and the size of the front page, so as to obtain a target thumbnail corresponding to the original image.
And a display unit 503, configured to display the target thumbnail on the front-end page.
Optionally, the scaling unit 502 is further configured to obtain a size of the front end page and a thumbnail style configuration file, where the thumbnail style configuration file includes a size proportion of a thumbnail corresponding to the front end page; and cutting and scaling the original image according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain the target thumbnail corresponding to the original image.
Optionally, when the first indication information indicates that the original image is cut and scaled, the scaling unit 502 is further configured to cut and scale the original image according to the saliency area, the size of the front end page, and the size scale of the thumbnail corresponding to the front end page, to obtain the target thumbnail corresponding to the original image.
Optionally, the scaling unit 502 is further configured to, when the size of the original image is greater than the first size and less than the second size, crop and scale the original image according to the saliency area, the size of the front page, and the size ratio of the thumbnail corresponding to the front page, to obtain a target thumbnail corresponding to the original image; the scaling unit 502 is further configured to scale the original image according to the size of the front page and the size ratio of the thumbnail corresponding to the front page when the size of the original image is smaller than the first size or larger than the second size, so as to obtain the target thumbnail corresponding to the original image.
Alternatively, the position information of the salient region of the original image and the target thumbnail are saved.
Optionally, the display unit 503 is further configured to identify each target thumbnail, so as to obtain definition of each target thumbnail and at least one content attribute information; performing correlation detection on the target thumbnails and the front page according to at least one piece of content attribute information and the content information of the front page to obtain the similarity of each target thumbnail and the front page; determining the mass fraction of the target thumbnail according to the similarity between the target thumbnail and the front-end page and the definition of the target thumbnail; and screening target thumbnails with the mass fraction meeting the preset condition from at least two target thumbnails, and displaying the target thumbnails on a front-end page.
Optionally, the detecting unit 501 is further configured to apply the method to a terminal device for displaying a front-end page, and receive an original image sent by a server and location information of a salient region of the original image before performing salient detection on the original image to obtain the salient region of the original image; the detecting unit 501 is further configured to determine a salient region of the original image according to position information of the salient region of the original image; the display unit 503 is further configured to locally display the original image in response to an operation of clicking the target thumbnail on the front page by the user.
In the technical scheme of the disclosure, the acquisition, storage, application and the like of the related user personal information all conform to the regulations of related laws and regulations, and the public sequence is not violated.
According to embodiments of the present disclosure, the present disclosure also provides an electronic device, a readable storage medium, a computer program product.
In an exemplary embodiment, an electronic device includes: at least one processor; and a memory communicatively coupled to the at least one processor; wherein the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method as described in the above embodiments.
In an exemplary embodiment, the readable storage medium may be a non-transitory computer readable storage medium storing computer instructions for causing a computer to perform the method according to the above embodiment.
In an exemplary embodiment, the computer program product comprises a computer program which, when executed by a processor, implements the method according to the above embodiments.
Fig. 6 illustrates a schematic block diagram of an example electronic device 600 that may be used to implement embodiments of the present disclosure. Electronic devices are intended to represent various forms of digital computers, such as laptops, desktops, workstations, personal digital assistants, servers, blade servers, mainframes, and other appropriate computers. The electronic device may also represent various forms of mobile devices, such as personal digital processing, cellular telephones, smartphones, wearable devices, and other similar computing devices. The components shown herein, their connections and relationships, and their functions, are meant to be exemplary only, and are not meant to limit implementations of the disclosure described and/or claimed herein.
As shown in fig. 6, the electronic device 600 includes a computing unit 601 that can perform various appropriate actions and processes according to a computer program stored in a Read Only Memory (ROM) 602 or a computer program loaded from a storage unit 608 into a Random Access Memory (RAM) 603. In the RAM 603, various programs and data required for the operation of the electronic device 600 can also be stored. The computing unit 601, ROM 602, and RAM 603 are connected to each other by a bus 604. An input/output (I/O) interface 605 is also connected to bus 604.
A number of components in the electronic device 600 are connected to the I/O interface 605, including: an input unit 606 such as a keyboard, mouse, etc.; an output unit 607 such as various types of displays, speakers, and the like; a storage unit 608, such as a magnetic disk, optical disk, or the like; and a communication unit 609 such as a network card, modem, wireless communication transceiver, etc. The communication unit 609 allows the electronic device 600 to exchange information/data with other devices through a computer network, such as the internet, and/or various telecommunication networks.
The computing unit 601 may be a variety of general and/or special purpose processing components having processing and computing capabilities. Some examples of computing unit 601 include, but are not limited to, a Central Processing Unit (CPU), a Graphics Processing Unit (GPU), various specialized Artificial Intelligence (AI) computing chips, various computing units running machine learning model algorithms, a Digital Signal Processor (DSP), and any suitable processor, controller, microcontroller, etc. The computing unit 601 performs the respective methods and processes described above, such as a thumbnail display control method. For example, in some embodiments, the thumbnail display control method may be implemented as a computer software program tangibly embodied on a machine-readable medium, such as the storage unit 608. In some embodiments, part or all of the computer program may be loaded and/or installed onto the electronic device 600 via the ROM 602 and/or the communication unit 609. When the computer program is loaded into the RAM 603 and executed by the computing unit 601, one or more steps of the thumbnail presentation control method described above may be performed. Alternatively, in other embodiments, the computing unit 601 may be configured to perform the thumbnail display control method by any other suitable means (e.g., by means of firmware).
Various implementations of the systems and techniques described here above may be implemented in digital electronic circuitry, integrated circuit systems, field Programmable Gate Arrays (FPGAs), application Specific Integrated Circuits (ASICs), application Specific Standard Products (ASSPs), systems On Chip (SOCs), load programmable logic devices (CPLDs), computer hardware, firmware, software, and/or combinations thereof. These various embodiments may include: implemented in one or more computer programs, the one or more computer programs may be executed and/or interpreted on a programmable system including at least one programmable processor, which may be a special purpose or general-purpose programmable processor, that may receive data and instructions from, and transmit data and instructions to, a storage system, at least one input device, and at least one output device.
Program code for carrying out methods of the present disclosure may be written in any combination of one or more programming languages. These program code may be provided to a processor or controller of a general purpose computer, special purpose computer, or other programmable data processing apparatus such that the program code, when executed by the processor or controller, causes the functions/operations specified in the flowchart and/or block diagram to be implemented. The program code may execute entirely on the machine, partly on the machine, as a stand-alone software package, partly on the machine and partly on a remote machine or entirely on the remote machine or server.
In the context of this disclosure, a machine-readable medium may be a tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. The machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples of a machine-readable storage medium would include an electrical connection based on one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.
To provide for interaction with a user, the systems and techniques described here can be implemented on a computer having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to a user; and a keyboard and pointing device (e.g., a mouse or trackball) by which a user can provide input to the computer. Other kinds of devices may also be used to provide for interaction with a user; for example, feedback provided to the user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user may be received in any form, including acoustic input, speech input, or tactile input.
The systems and techniques described here can be implemented in a computing system that includes a background component (e.g., as a data server), or that includes a middleware component (e.g., an application server), or that includes a front-end component (e.g., a user computer having a graphical user interface or a web browser through which a user can interact with an implementation of the systems and techniques described here), or any combination of such background, middleware, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: local Area Networks (LANs), wide Area Networks (WANs), and the internet.
The computer system may include a client and a server. The client and server are typically remote from each other and typically interact through a communication network. The relationship of client and server arises by virtue of computer programs running on the respective computers and having a client-server relationship to each other. The server may be a cloud server, a server of a distributed system, or a server incorporating a blockchain.
It should be appreciated that various forms of the flows shown above may be used to reorder, add, or delete steps. For example, the steps recited in the present disclosure may be performed in parallel, sequentially, or in a different order, provided that the desired results of the disclosed aspects are achieved, and are not limited herein.
The above detailed description should not be taken as limiting the scope of the present disclosure. It will be apparent to those skilled in the art that various modifications, combinations, sub-combinations and alternatives are possible, depending on design requirements and other factors. Any modifications, equivalent substitutions and improvements made within the spirit and principles of the present disclosure are intended to be included within the scope of the present disclosure.

Claims (17)

1. A thumbnail display control method, the method comprising:
performing significance detection on an original image to obtain a significance region of the original image;
cutting and scaling the original image according to the sizes of the saliency area and the front page to obtain a target thumbnail corresponding to the original image;
and displaying the target thumbnail on the front-end page.
2. The method of claim 1, wherein the cropping and scaling the original image according to the sizes of the saliency area and the front page to obtain the target thumbnail corresponding to the original image, includes:
Acquiring the size of a front-end page and a thumbnail pattern configuration file, wherein the thumbnail pattern configuration file comprises the size proportion of a thumbnail corresponding to the front-end page;
and cutting and scaling the original image according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image.
3. The method of claim 2, the thumbnail style profile further comprising first indication information;
the first indication information is used for indicating whether the original image is cut and scaled;
the clipping and scaling the original image according to the saliency area, the size of the front end page and the size proportion of the thumbnail corresponding to the front end page to obtain a target thumbnail corresponding to the original image, including:
when the first indication information indicates that the original image is cut and scaled, the original image is cut and scaled according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page, and the target thumbnail corresponding to the original image is obtained.
4. The method according to claim 2 or 3, wherein the cropping and scaling the original image according to the saliency area, the size of the front end page, and the size ratio of the thumbnail corresponding to the front end page to obtain the target thumbnail corresponding to the original image includes:
when the size of the original image is larger than the first size and smaller than the second size, cutting and scaling the original image according to the size proportion of the saliency area, the size of the front-end page and the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image;
the method further comprises the steps of:
and when the size of the original image is smaller than the first size or larger than the second size, scaling the original image according to the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image.
5. The method of any of claims 1-4, saving location information of a salient region of the original image and the target thumbnail.
6. The method of any of claims 1-5, the target thumbnail comprising at least two sheets; the displaying the target thumbnail on the front-end page comprises the following steps:
Identifying each target thumbnail to obtain definition of each target thumbnail and at least one piece of content attribute information;
performing correlation detection on the target thumbnail and the front page according to the at least one content attribute information and the content information of the front page to obtain the similarity between each target thumbnail and the front page;
determining the mass fraction of the target thumbnail according to the similarity between the target thumbnail and the front-end page and the definition of the target thumbnail;
and screening target thumbnails with the quality scores meeting preset conditions from the at least two target thumbnails, and displaying the target thumbnails on the front-end page.
7. The method according to any one of claims 1-6, applied to a terminal device for displaying the front-end page, wherein before performing saliency detection on an original image to obtain a saliency area of the original image, the method further comprises:
receiving the original image and the position information of the salient region of the original image, which are issued by a server;
the performing saliency detection on the original image to obtain a saliency area of the original image includes:
Determining the salient region of the original image according to the position information of the salient region of the original image;
the method further comprises the steps of:
and responding to the operation of clicking the target thumbnail on the front-end page by a user, and displaying the original image locally.
8. A thumbnail display control apparatus, the apparatus comprising:
the detection unit is used for carrying out significance detection on the original image to obtain a significance region of the original image;
the scaling unit is used for cutting and scaling the original image according to the sizes of the saliency area and the front page to obtain a target thumbnail corresponding to the original image;
and the display unit is used for displaying the target thumbnail on the front-end page.
9. The apparatus of claim 8, the scaling unit further to:
acquiring the size of a front-end page and a thumbnail pattern configuration file, wherein the thumbnail pattern configuration file comprises the size proportion of a thumbnail corresponding to the front-end page;
and cutting and scaling the original image according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image.
10. The apparatus of claim 9, the thumbnail style configuration file further comprising first indication information;
the first indication information is used for indicating whether the original image is cut and scaled;
the scaling unit is further configured to:
when the first indication information indicates that the original image is cut and scaled, the original image is cut and scaled according to the saliency area, the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page, and the target thumbnail corresponding to the original image is obtained.
11. The apparatus according to claim 9 or 10, the scaling unit further being configured to:
when the size of the original image is larger than the first size and smaller than the second size, cutting and scaling the original image according to the size proportion of the saliency area, the size of the front-end page and the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image;
the scaling unit is further configured to:
and when the size of the original image is smaller than the first size or larger than the second size, scaling the original image according to the size of the front-end page and the size proportion of the thumbnail corresponding to the front-end page to obtain a target thumbnail corresponding to the original image.
12. The apparatus according to any one of claims 8 to 11, wherein position information of a salient region of the original image and the target thumbnail are saved.
13. The apparatus of claims 8-12, the target thumbnail comprising at least two sheets, the presentation unit further to:
identifying each target thumbnail to obtain definition of each target thumbnail and at least one piece of content attribute information;
performing correlation detection on the target thumbnail and the front page according to the at least one content attribute information and the content information of the front page to obtain the similarity between each target thumbnail and the front page;
determining the mass fraction of the target thumbnail according to the similarity between the target thumbnail and the front-end page and the definition of the target thumbnail;
and screening target thumbnails with the quality scores meeting preset conditions from the at least two target thumbnails, and displaying the target thumbnails on the front-end page.
14. The apparatus of claims 8-13, the detection unit further to:
the method is applied to terminal equipment for displaying the front-end page, and the method receives the original image and the position information of the salient region of the original image, which are issued by a server, before the salient region of the original image is obtained by carrying out salient detection on the original image;
The detection unit is further used for:
determining the salient region of the original image according to the position information of the salient region of the original image;
the display unit is further configured to:
and responding to the operation of clicking the target thumbnail on the front-end page by a user, and displaying the original image locally.
15. An electronic device, comprising: at least one processor; and a memory communicatively coupled to the at least one processor;
wherein the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of any one of claims 1-7.
16. A non-transitory computer readable storage medium storing computer instructions for causing a computer to perform the method of any one of claims 1-7.
17. A computer program product comprising a computer program which, when executed by a processor, implements the method according to any of claims 1-7.
CN202310485541.7A 2023-04-28 2023-04-28 Thumbnail display control method, device, equipment and storage medium Pending CN116610244A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202310485541.7A CN116610244A (en) 2023-04-28 2023-04-28 Thumbnail display control method, device, equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202310485541.7A CN116610244A (en) 2023-04-28 2023-04-28 Thumbnail display control method, device, equipment and storage medium

Publications (1)

Publication Number Publication Date
CN116610244A true CN116610244A (en) 2023-08-18

Family

ID=87684586

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202310485541.7A Pending CN116610244A (en) 2023-04-28 2023-04-28 Thumbnail display control method, device, equipment and storage medium

Country Status (1)

Country Link
CN (1) CN116610244A (en)

Similar Documents

Publication Publication Date Title
US10089957B2 (en) Page display method and terminal
CN112882678B (en) Image-text processing method, image-text processing display method, image-text processing device, image-text processing equipment and storage medium
EP3876197A2 (en) Portrait extracting method and apparatus, electronic device and storage medium
CN113657396B (en) Training method, translation display method, device, electronic equipment and storage medium
CN115719356A (en) Image processing method, apparatus, device and medium
CN113837194B (en) Image processing method, image processing apparatus, electronic device, and storage medium
CN113780297B (en) Image processing method, device, equipment and storage medium
CN115578486A (en) Image generation method and device, electronic equipment and storage medium
CN114610295A (en) Layout method, device, equipment and medium for page container
CN113313066A (en) Image recognition method, image recognition device, storage medium and terminal
CN113626113A (en) Page rendering method and device
CN114549303B (en) Image display method, image processing method, image display device, image processing apparatus, image display device, image processing program, and storage medium
CN115082298A (en) Image generation method, image generation device, electronic device, and storage medium
CN116610244A (en) Thumbnail display control method, device, equipment and storage medium
CN115643468A (en) Poster generation method and device, electronic equipment and storage medium
CN115564976A (en) Image processing method, apparatus, medium, and device
CN112861504A (en) Text interaction method, device, equipment, storage medium and program product
CN113420176B (en) Question searching method, question frame drawing device, question searching equipment and storage medium
CN114329278B (en) Processing method and device of search result page, electronic equipment and storage medium
CN114549697B (en) Image processing method, device, equipment and storage medium
CN112667880B (en) Search result display method, device, equipment and storage medium
US20230119741A1 (en) Picture annotation method, apparatus, electronic device, and storage medium
CN113691866B (en) Video processing method, device, electronic equipment and medium
CN114219945A (en) Thumbnail obtaining method and device, electronic equipment and storage medium
CN115878248A (en) Image processing method, device, equipment and storage medium

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination