Information drawing processing method, device, electronic device and storage medium

Abstract

The disclosed embodiments relate to an information drawing processing method, device, electronic device and storage medium, wherein the method comprises: receiving drawing information of at least part of the video frames corresponding to the first client in real time, storing the drawing information in the stroke queue to be drawn by the second client, obtaining a set of drawing information of the first client video frames that matches the preset video frame threshold number from the stroke queue, using the set of drawing information as a drawing information group for drawing the current video frame of the second client, drawing the current video frame content of the second client according to the drawing information group corresponding to the current video frame and displaying the corresponding image. By adopting the above technical solution, the drawing information of the first client is received in real time and stored in the stroke queue, and different drawing information groups are obtained from the stroke queue based on different scenes to draw the image displayed by the second client, so that the first client and the second client can display the same image at the same time, further improving the real-time synchronous display effect of the image.

Description

Technical Field

[0001] The present disclosure relates to the field of information processing technology, and in particular to an information rendering processing method, device, electronic device and storage medium. Background Art

[0002] With the rapid development of Internet technology and smart clients, more and more scenarios require synchronizing a user's local drawing content to other users in real time.

[0003] In the related art, sending the completed drawing data to other users for data restoration and display cannot meet the demand for real-time synchronization of drawing content. Summary of the invention

[0004] In order to solve the above technical problem or at least partially solve the above technical problem, the present disclosure provides an information rendering processing method, device, electronic device and storage medium.

[0005] The present disclosure provides an information drawing processing method, including:

[0006] Receiving in real time drawing information of at least a portion of the video frame corresponding to the first client;

[0007] Storing the drawing information in a stroke queue to be drawn on the second client;

[0008] Acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client;

[0009] The current video frame content of the second client is drawn according to the drawing information group corresponding to the current video frame and a corresponding image is displayed.

[0010] In an optional implementation manner, the method further includes:

[0011] Receive drawing information of at least part of the video frame corresponding to the first client video frame broadcasted in real time by the server, wherein the drawing information is the drawing information of at least part of the video frame sent by the first client to the server in real time.

[0012] In an optional implementation manner, the method further includes:

[0013] After drawing the current video frame content of the second client, continue to draw the next video frame content of the second client according to the drawing information group corresponding to the next video frame;

[0014] All drawn video frames are stitched together to generate a target image for display.

[0015] In an optional implementation manner, the real-time receiving of drawing information of at least part of the video frame corresponding to the first client includes:

[0016] receiving in real time drawing stroke information of at least part of the video frame corresponding to the first client, the drawing stroke information including: the coordinates of the starting point of the stroke used to draw the video frame content of the first client and the coordinates of the corresponding end point of the stroke, as well as the thickness of the stroke and the color of the stroke;

[0017] The step of drawing the current video frame content of the second client according to the drawing information group corresponding to the current video frame and displaying the corresponding image includes:

[0018] Obtaining the stroke starting point coordinates and corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color, which are contained in the drawing information group corresponding to the current video frame and are used by the first client to draw different video frame contents;

[0019] The current video frame content of the second client is drawn according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, and the corresponding image is displayed.

[0020] In an optional implementation, drawing the current video frame content of the second client according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color and displaying the corresponding image includes:

[0021] Determine a first vector between the pixel point and the stroke starting point coordinates according to the position coordinates of the pixel point in the current video frame to be drawn by the second client, and determine a second vector between the stroke starting point coordinates and the corresponding stroke ending point coordinates;

[0022] According to the first vector and the corresponding second vector and the corresponding stroke thickness, it is determined whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the end point coordinates, and the pixel point is drawn according to the determination result.

[0023] In an optional implementation, judging whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the end point coordinates according to the first vector and the corresponding second vector and the corresponding stroke thickness, and drawing the pixel point according to the judgment result, including:

[0024] Determine the distance between the pixel point and the stroke line according to the first vector and the corresponding second vector;

[0025] Determining whether the pixel point is on the stroke line according to the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line;

[0026] If the pixel point is on the stroke line, the pixel color of the pixel point is set to the stroke color;

[0027] If the pixel point is not on the stroke line, the transparency of the pixel color of the pixel point is set to null.

[0028] In an optional implementation manner, the method further includes:

[0029] Determine a third vector between the pixel point and the stroke end point coordinates according to the position coordinates of the pixel point;

[0030] According to the first vector, the corresponding third vector and the stroke thickness, it is determined whether the pixel point is on both ends of the stroke line, and the pixel point is drawn according to the determination result.

[0031] In an optional implementation, judging whether the pixel point is at both ends of the stroke line according to the first vector and the corresponding third vector and the stroke thickness, and drawing the pixel point according to the judgment result, includes:

[0032] Determine whether the length of the first vector is less than the stroke thickness, or whether the length of the third vector is less than the stroke thickness;

[0033] If the length of the first vector or the length of the third vector is smaller than the stroke thickness, the pixel point is determined to be on both ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

[0034] The present disclosure also provides an information drawing processing device, including:

[0035] A first receiving module, configured to receive in real time drawing information of at least a portion of video frames corresponding to a first client;

[0036] A storage module, used for storing the drawing information into a stroke queue to be drawn on the second client;

[0037] an acquisition module, configured to acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client;

[0038] A drawing and display module is used to draw the current video frame content of the second client according to the drawing information group corresponding to the current video frame and display the corresponding image.

[0039] An embodiment of the present disclosure also provides an electronic device, comprising: a processor; a memory for storing executable instructions of the processor; the processor is used to read the executable instructions from the memory and execute the instructions to implement the information drawing processing method provided in the first aspect embodiment and the second aspect embodiment of the present disclosure.

[0040] An embodiment of the present disclosure further provides a computer-readable storage medium, wherein the storage medium stores a computer program, and the computer program is used to execute the information drawing processing method provided by the first and second embodiments of the present disclosure.

[0041] The technical solution provided by the embodiment of the present disclosure has the following advantages over the prior art: the information drawing processing solution provided by the embodiment of the present disclosure receives the drawing information of at least part of the video frame corresponding to the first client in real time, stores the drawing information in the stroke queue to be drawn of the second client, obtains a set of drawing information of the first client video frame that matches the preset video frame threshold number from the stroke queue, uses the set of drawing information as a drawing information group for drawing the current video frame of the second client, draws the current video frame content of the second client according to the drawing information group corresponding to the current video frame and displays the corresponding image. By adopting the above technical solution, the drawing information of the first client is received in real time and stored in the stroke queue, and different drawing information groups are obtained from the stroke queue based on different scenes to draw the image displayed by the second client, so that the first client and the second client can display the same image at the same time, further improving the real-time synchronous display effect of the image. BRIEF DESCRIPTION OF THE DRAWINGS

[0042] The above and other features, advantages and aspects of the embodiments of the present disclosure will become more apparent with reference to the following detailed description in conjunction with the accompanying drawings. Throughout the accompanying drawings, the same or similar reference numerals represent the same or similar elements. It should be understood that the drawings are schematic and the originals and elements are not necessarily drawn to scale.

[0043] Figure 1 An application scenario diagram of an information drawing processing method provided by an embodiment of the present disclosure;

[0044] Figure 2 A flowchart of an information drawing processing method provided by an embodiment of the present disclosure;

[0045] Figure 3 A flowchart of another information drawing processing method provided by an embodiment of the present disclosure;

[0046] Figure 4 A schematic diagram of another information drawing process provided by an embodiment of the present disclosure;

[0047] Figure 5 An example diagram of an information drawing processing scenario provided by an embodiment of the present disclosure;

[0048] Figure 6 An example diagram of another information drawing processing scenario provided by an embodiment of the present disclosure;

[0049] Figure 7 A schematic diagram of the structure of an information drawing processing device provided in an embodiment of the present disclosure;

[0050] Figure 8 A schematic diagram of the structure of an electronic device provided in an embodiment of the present disclosure. DETAILED DESCRIPTION

[0051] Embodiments of the present disclosure will be described in more detail below with reference to the accompanying drawings. Although certain embodiments of the present disclosure are shown in the accompanying drawings, it should be understood that the present disclosure can be implemented in various forms and should not be construed as being limited to the embodiments described herein, which are instead provided for a more thorough and complete understanding of the present disclosure. It should be understood that the drawings and embodiments of the present disclosure are only for exemplary purposes and are not intended to limit the scope of protection of the present disclosure.

[0052] It should be understood that the various steps described in the method embodiments of the present disclosure may be performed in different orders and / or in parallel. In addition, the method embodiments may include additional steps and / or omit the steps shown. The scope of the present disclosure is not limited in this respect.

[0053] The term "including" and its variations used herein are open inclusions, i.e., "including but not limited to". The term "based on" means "based at least in part on". The term "one embodiment" means "at least one embodiment"; the term "another embodiment" means "at least one additional embodiment"; the term "some embodiments" means "at least some embodiments". The relevant definitions of other terms will be given in the following description.

[0054] It should be noted that the concepts such as "first" and "second" mentioned in the present disclosure are only used to distinguish different devices, modules or units, and are not used to limit the order or interdependence of the functions performed by these devices, modules or units.

[0055] It should be noted that the modifications of "one" and "plurality" mentioned in the present disclosure are illustrative rather than restrictive, and those skilled in the art should understand that unless otherwise clearly indicated in the context, it should be understood as "one or more".

[0056] The names of the messages or information exchanged between multiple devices in the embodiments of the present disclosure are only used for illustrative purposes and are not used to limit the scope of these messages or information.

[0057] The information drawing processing method provided by the present disclosure can be applied to Figure 1 In the application environment shown. Figure 1 This is an application scenario diagram of an information drawing processing method provided by an embodiment of the present disclosure. The application environment includes a first client 101 and a second client 102.

[0058] In which, drawing information of at least part of the video frame corresponding to the first client 101 is received in real time, the drawing information is stored in the stroke queue to be drawn by the second client 102, a set of drawing information of the video frame of the first client 101 matching the preset video frame threshold number is obtained from the stroke queue, the set of drawing information is used as a drawing information group for drawing the current video frame of the second client 102, and the current video frame content of the second client 102 is drawn according to the drawing information group corresponding to the current video frame and the corresponding image is displayed. In which, the first client 101 refers to an electronic device for drawing content, and the second client 102 can be one or more, and refers to an electronic device that simultaneously displays the drawing content.

[0059] The first client 101 and the second client 102 may be, but are not limited to, various personal computers, laptops, smart phones, tablet computers, and portable wearable devices.

[0060] It should be noted that Figure 1 The system also includes a server 103. The first client 101 and the second client 102 can communicate directly or through the server 103. The server 103 can be implemented by an independent server or a server cluster composed of multiple servers.

[0061] In actual application scenarios, such as the game of "You Draw, I Guess", it is necessary to synchronize a user's local drawing content with other players in the game, and the synchronized image needs to have a relatively high degree of restoration; for example, calligraphy practice, online invigilation and other scenarios all require real-time drawing content synchronization.

[0062] In the disclosed embodiment, while the first client displays an image corresponding to the drawing content according to the input drawing information, the drawing information is sent to the second client in real time. The second client can select a drawing information group based on the actual scene to synchronously draw the content and display the image. That is to say, the second client synchronously renders the drawing content in real time and displays the image. From the user's vision, the first client and the second client simultaneously draw and display images of the same drawing content, so that multiple clients can display images of the same drawing content at the same time, which meets the needs of various scenes for drawing synchronization and further improves the image synchronization effect under the drawing scene.

[0063] Specifically, Figure 2 The present invention provides a flowchart of an information drawing processing method provided by an embodiment of the present invention. The method can be executed by an information drawing processing device, wherein the device can be implemented by software and / or hardware and can generally be integrated in an electronic device. Figure 2 As shown, the method comprises:

[0064] Step 101: Receive in real time drawing information of at least a portion of video frames corresponding to a first client.

[0065] Among them, different drawing scenes correspond to different drawing information. For example, in a painting scene, the drawing information refers to drawing stroke information, drawing shape controls, etc., such as one or more of stroke coordinate position, stroke thickness and stroke color; for another example, in a calligraphy practice scene, the drawing information refers to writing information, such as one or more of writing coordinate position and color.

[0066] In the embodiment of the present disclosure, real-time reception of drawing information of at least part of the video frames corresponding to the first client means that the drawing information corresponding to each video frame in the first client is sent to the second client in real time; wherein each video frame refers to each drawing stroke, that is, each drawing stroke of the brush from the starting position to the ending position on the first client is regarded as each video frame.

[0067] In actual application scenarios, the first terminal receives a trigger operation on a drawing control, obtains input drawing information based on the trigger operation of the drawing control, or detects a trigger operation on the screen, and obtains input drawing information based on the trigger operation on the screen. Both can respond to the drawing information input by the drawing user, draw corresponding drawing content based on the drawing information, display the corresponding image, and send the drawing information to the second terminal in real time.

[0068] In the embodiments of the present disclosure, there are many ways to receive in real time the drawing information of at least a portion of the video frames corresponding to the first client. In some embodiments, the drawing information of at least a portion of the video frames corresponding to the video frames of the first client broadcasted in real time by the server is received, wherein the drawing information is the drawing information of at least a portion of the video frames sent by the first client to the server in real time.

[0069] In some other implementations, the drawing information of at least part of the video frame sent by the first client is directly received. The above are only two examples of receiving the drawing information of at least part of the video frame corresponding to the first client in real time. The embodiment of the present disclosure does not specifically limit the manner of receiving the drawing information of at least part of the video frame corresponding to the first client in real time.

[0070] Specifically, drawing stroke information of at least part of the video frame corresponding to the first client is received in real time, and the drawing stroke information includes: stroke starting point coordinates and corresponding stroke ending point coordinates used for drawing the video frame content of the first client, as well as stroke thickness and stroke color.

[0071] Step 102: Store the drawing information into a stroke queue to be drawn on the second client.

[0072] In the embodiment of the present disclosure, the second client has a stroke queue, and after receiving the drawing information of at least part of the video frame sent by the first client in real time, the drawing information is sequentially stored in the stroke queue according to the receiving time.

[0073] Step 103: Acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client.

[0074] Step 104: draw the current video frame content of the second client according to the drawing information group corresponding to the current video frame and display the corresponding image.

[0075] In the disclosed embodiments, the real-time performance of receiving drawing information corresponding to different application scenarios may vary. Therefore, the threshold number of video frames may be set according to different application scenarios.

[0076] In the embodiment of the present disclosure, a set of drawing information of the first client video frame matching the preset video frame threshold number is obtained from the stroke queue, that is, a set of drawing information corresponding to the first client video frame is obtained from the stroke queue according to the preset video frame threshold number, that is, a set of drawing information corresponding to multiple video frames can be directly obtained at one time as a drawing information group for drawing the current video frame of the second client. Thus, a set of drawing information corresponding to multiple video frames can be directly obtained on the second client as a drawing information group for the current video frame of the second client.

[0077] Furthermore, the current video frame content of the second client is drawn according to the drawing information group corresponding to the current video frame and the corresponding image is displayed. That is, the second client can directly complete multiple drawing strokes at one time to realize the image of the drawing content synchronously displayed with the first client.

[0078] In the embodiments of the present disclosure, different drawing information may result in different ways of displaying the current video frame content of the second client and the corresponding image. In some embodiments, the drawing information is drawing stroke information, and the drawing stroke information includes: the stroke starting point coordinates and the corresponding stroke ending point coordinates used to draw the video frame content of the first client, as well as the stroke thickness and the stroke color; drawing the current video frame content of the second client and displaying the corresponding image according to the drawing information group corresponding to the current video frame includes: obtaining the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, used by the first client to draw different video frame contents contained in the drawing information group corresponding to the current video frame; drawing the current video frame content of the second client and displaying the corresponding image according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color.

[0079] In other embodiments, the drawing information is a shape drawing control, and the current video frame content of the second client is drawn according to the drawing information group corresponding to the current video frame and the corresponding image is displayed, including: obtaining the shape drawing control used by the first client to draw different video frame contents contained in the drawing information group corresponding to the current video frame, drawing the current video frame content of the second client according to the shape drawing control and displaying the corresponding image.

[0080] As an example of a scenario, in the game of "You Draw, I Guess", for example, there are two second clients X and Y at the beginning. The two second clients X and Y display the images of the drawn content synchronously in real time. After the first client draws multiple video frames, the game has not ended yet, and a new second client Z is added. Multiple groups of drawing information of the first client's video frames can be sent to the second client Z at one time. The second client Z uses the multiple groups of drawing information as the drawing information groups for drawing the current video frame of the second client Z, and draws the current video frame content of the second client Z according to the drawing information groups corresponding to the current video frame and displays the corresponding image, thereby realizing image synchronization between the first client and the second clients X, Y and Z. When the game is in progress, when a new second client joins or a message of a previously connected second client disconnecting and reconnecting is received, all drawing information will be immediately given to the corresponding second client, further improving the image synchronization effect in the drawing scenario.

[0081] As an example of another scenario, during the online proctoring process, the second client, as the proctoring end, no longer only uses the test results as the basis for evaluation. It can obtain the drawing techniques of the first client in real time for real-time evaluation and scoring, just like proctoring on site, further enriching the information drawing scenarios, meeting the needs of various scenarios, and improving the information drawing processing effect.

[0082] The information drawing processing scheme provided by the embodiment of the present disclosure receives drawing information of at least part of the video frame corresponding to the first client in real time, stores the drawing information in the stroke queue to be drawn by the second client, obtains a set of drawing information of the first client's video frame that matches a preset video frame threshold number from the stroke queue, uses the set of drawing information as a drawing information group for drawing the current video frame of the second client, draws the current video frame content of the second client according to the drawing information group corresponding to the current video frame, and displays the corresponding image. By adopting the above technical scheme, the drawing information of the first client is received in real time and stored in the stroke queue, and different drawing information groups are obtained from the stroke queue based on different scenes to draw the image displayed by the second client, so that the first client and the second client can display the same image at the same time, further improving the real-time synchronous display effect of the image.

[0083] In some embodiments, drawing information of at least a portion of the video frame corresponding to the first client video frame broadcasted in real time by the server is received, wherein the drawing information is the drawing information of at least a portion of the video frame sent by the first client to the server in real time.

[0084] Among them, the drawing information of at least part of the video frame corresponding to the first client video frame is sent to one or more second clients by real-time broadcasting of the server. It can be understood that in different application scenarios, different second clients access and synchronously draw content and display corresponding images. For example, in the game of "You Draw, I Guess", multiple second clients can access to play the game.

[0085] In the above solution, the drawing information of at least part of the video frame corresponding to the first client video frame is received by the server in real-time broadcasting, so that the drawing information is received more timely and effectively, and the effect of information drawing processing is further improved.

[0086] In some embodiments, after drawing the current video frame content of the second client, continue to draw the next video frame content of the second client according to the drawing information group corresponding to the next video frame, and splice the corresponding video frame contents of all drawn video frames to generate a target image for display.

[0087] Specifically, after the second client receives the drawing information of at least part of the video frame corresponding to the first client, it stores the drawing information in a stroke queue to be drawn, reads the stroke queue to be drawn for each video frame, obtains a set of matching drawing information of the first client video frame as the drawing information group of the current video frame of the second client, and passes it into the multi-stroke shader to complete the drawing of the content of the current video frame.

[0088] Furthermore, the next video frame content of the second client is continued to be drawn according to the drawing information group corresponding to the next video frame, and the video frame contents corresponding to all the drawn video frames are spliced ​​to generate a target image for display. That is to say, after the content drawing of each current video frame is completed, it is superimposed on the drawing content of the previous video frame to realize content drawing and display the corresponding image.

[0089] In the above scheme, a multi-stroke drawing effect can be achieved, retaining all the details in the painter's stroke information, and further improving the real-time synchronous display effect of the image.

[0090] In some embodiments, real-time receiving of drawing information of at least a portion of the video frame corresponding to the first client includes: real-time receiving of drawing stroke information of at least a portion of the video frame corresponding to the first client, the drawing stroke information including: stroke starting point coordinates and corresponding stroke ending point coordinates used to draw the first client video frame content, as well as stroke thickness and stroke color.

[0091] In some embodiments, the current video frame content of the second client is drawn according to the drawing information group corresponding to the current video frame and the corresponding image is displayed, including: obtaining the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, contained in the drawing information group corresponding to the current video frame, used by the first client to draw different video frame contents, and drawing the current video frame content of the second client according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, and displaying the corresponding image.

[0092] Specifically, the corresponding position coordinates when the two adjacent video frames trigger the screen are respectively used as the stroke starting point coordinates and stroke ending point coordinates of each video frame. The content of each video frame is drawn in sequence according to the stroke starting point coordinates and stroke ending point coordinates of each video frame, as well as the stroke thickness and stroke color. The drawn contents of all video frames are spliced ​​to generate an image and display it.

[0093] Among them, drawing per video frame refers to drawing per stroke, that is, drawing per stroke of the brush from the starting position to the ending position on the first client is regarded as drawing per video frame. The corresponding position when the two adjacent video frames trigger the screen can be understood as the touch screen position coordinates of the previous video frame and the current video frame. Therefore, the corresponding position coordinates of the drawing user when the two adjacent video frames trigger the screen are respectively used as the brush starting coordinates and brush ending coordinates of each video frame, so that the rendering path corresponding to the brush can be obtained according to the brush starting coordinates and brush ending coordinates.

[0094] Among them, the content of each video frame can be drawn according to the stroke starting point coordinates and stroke ending point coordinates, stroke thickness and stroke color drawn in each video frame, that is, the rendering result corresponding to each stroke drawing, so that the rendering results of all stroke drawing can be obtained and spliced ​​to display the corresponding image.

[0095] In the embodiments of the present disclosure, there are many ways to draw the current video frame content of the second client and display the corresponding image based on the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color. In some embodiments, the stroke starting point coordinates, the stroke ending point coordinates and the pixel point position coordinates are directly calculated based on a preset calculation formula or algorithm, and the pixel point is located on the stroke straight line corresponding to the stroke starting point to the stroke ending point, and the pixel color of the pixel point is set to the stroke color. If the pixel point is at both ends of the stroke straight line, the pixel color of the pixel point is set to the stroke color. If the pixel point is not on the stroke straight line and both ends, the transparency of the pixel color of the pixel point is set to empty.

[0096] In some embodiments, a first vector between a pixel point and the stroke starting point coordinates is determined based on the position coordinates of a pixel point in a video frame to be drawn by the second client, and a second vector between the stroke starting point coordinates and the corresponding stroke ending point coordinates is determined. Based on the first vector and the corresponding second vector and the corresponding stroke thickness, it is determined whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates and the ending point coordinates, and the pixel point is drawn based on the judgment result.

[0097] Among them, the current video frame to be drawn refers to the stroke that is currently being drawn and has not yet been rendered and displayed. First, the position coordinates of the pixel points in the current video frame to be drawn are obtained. According to the brush starting point coordinates and the pixel point position coordinates, the straight line from the stroke starting point to the pixel point can be determined as the first vector, and the straight line from the stroke starting point coordinates to the stroke end point coordinates can be determined as the second vector. Therefore, according to the first vector, the second vector and the stroke thickness, it is determined whether the pixel point is located on the stroke straight line corresponding to the stroke starting point to the stroke end point, and the pixel point is drawn according to the judgment result.

[0098] Among them, according to the first vector, the second vector and the stroke thickness, it is judged whether the pixel point is located on the stroke straight line corresponding to the stroke start point to the stroke end point. There are many ways to draw the pixel point according to the judgment result. In some embodiments, the first vector, the second vector and the stroke thickness are directly calculated according to a preset formula or algorithm. If the pixel point is located on the stroke straight line corresponding to the stroke start point to the stroke end point, the pixel color of the pixel point is set to the stroke color. If the pixel point is not on the stroke straight line, the transparency of the pixel color of the pixel point is set to empty.

[0099] In some embodiments, based on the first vector and the second vector and the corresponding stroke thickness, it is determined whether the pixel point is located on the stroke line corresponding to the stroke start point to the stroke end point, and the pixel point is drawn according to the determination result, including: determining the distance between the pixel point and the stroke line based on the first vector and the second vector, and determining whether the pixel point is on the stroke line based on the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line; if the pixel point is on the stroke line, the pixel color of the pixel point is set to the stroke color; if the pixel point is not on the stroke line, the transparency of the pixel color of the pixel point is set to empty.

[0100] Among them, whether the pixel point is on the stroke line is judged based on the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line. It can be understood that if the distance is less than the stroke thickness and the angle between the first vector and the second vector is greater than 0 degrees and less than 90 degrees, and the projection length is less than the distance value corresponding to the second vector, then the pixel point is determined to be on the stroke line, and the pixel color of the pixel point is set to the stroke color; otherwise, if the pixel point is determined not to be on the stroke line, the transparency of the pixel color of the pixel point is set to empty.

[0101] In some embodiments, a third vector between a pixel point and an end point of a brush stroke is determined based on the position coordinates of the pixel point and the end point coordinates of the brush. Based on the first vector, the third vector and the stroke thickness, it is determined whether the pixel point is at both ends of the stroke line. The pixel point is drawn based on the determination result.

[0102] Among them, according to the coordinates of the stroke end point and the position coordinates of the pixel point, the straight line pointing from the pixel point to the stroke end point can be determined as the third vector, and further according to the first vector, the third vector and the stroke thickness, it is judged whether the pixel point is at the two ends of the stroke straight line, and the pixel point is drawn according to the judgment result.

[0103] In the embodiments of the present disclosure, whether the pixel point is at the two ends of the stroke line is determined based on the first vector, the third vector and the stroke thickness. There are many ways to draw the pixel point based on the determination result. In some implementations, the first vector, the third vector and the stroke thickness are directly calculated according to a preset formula or algorithm to determine whether the pixel point is at the two ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

[0104] In some embodiments, it is determined whether the length of the first vector is less than the stroke thickness, or whether the length of the third vector is less than the stroke thickness. If the length of the first vector or the length of the third vector is less than the stroke thickness, it is determined that the pixel point is at both ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

[0105] In the above scheme, if the pixel point is on a stroke line, the pixel color of the pixel point is set to the stroke color in the drawing attribute information; if the pixel point is not on a stroke line, the transparency of the pixel color of the pixel point is set to empty; and the pixel point is determined to be at both ends of the stroke line, and the pixel color of the pixel point is set to the stroke color in the drawing attribute information, thereby further ensuring the accuracy of the first content display, improving the flexibility of drawing, and ensuring the brush synchronization effect, thereby ensuring that each client displays the same image in real time and synchronously.

[0106] Figure 3 This is a flow chart of another information drawing processing method provided by the embodiment of the present disclosure. Based on the above embodiment, this embodiment further optimizes the above information drawing processing method. Figure 3 As shown, the method includes:

[0107] Step 201: Receive in real time drawing stroke information of at least part of the video frame corresponding to the first client, the drawing stroke information including: stroke starting point coordinates and corresponding stroke ending point coordinates used to draw the video frame content of the first client, as well as stroke thickness and stroke color.

[0108] Step 202: store the drawing stroke information into a stroke queue to be drawn on the second client, obtain a set of drawing stroke information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing stroke information as a drawing information group for drawing the current video frame of the second client.

[0109] Step 203 , obtaining the stroke starting point coordinates and corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color, which are contained in the drawing information group corresponding to the current video frame and are used by the first client to draw different video frame contents.

[0110] Step 204: Draw the current video frame content of the second client according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color, and display the corresponding image.

[0111] In some embodiments, the current video frame content of the second client is drawn and the corresponding image is displayed based on the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, including: determining the first vector between the pixel point and the stroke starting point coordinates according to the position coordinates of the pixel point in the current video frame to be drawn by the second client, and determining the second vector between the stroke starting point coordinates and the corresponding stroke ending point coordinates, judging whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the ending point coordinates according to the first vector and the corresponding second vector and the corresponding stroke thickness, and drawing the pixel point according to the judgment result.

[0112] In some embodiments, based on the first vector and the corresponding second vector and the corresponding stroke thickness, it is determined whether the pixel point is located on the stroke line corresponding to the starting point coordinates to the end point coordinates, and the pixel point is drawn according to the determination result, including: determining the distance between the pixel point and the stroke line according to the first vector and the corresponding second vector, and determining whether the pixel point is on the stroke line according to the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line; if the pixel point is on the stroke line, the pixel color of the pixel point is set to the stroke color; if the pixel point is not on the stroke line, the transparency of the pixel color of the pixel point is set to empty.

[0113] In some embodiments, a third vector between the pixel point and the stroke end point coordinates is determined based on the position coordinates of the pixel point and the stroke end point coordinates, and based on the first vector, the third vector and the stroke thickness, it is determined whether the pixel point is at both ends of the stroke straight line, and the pixel point is drawn based on the determination result.

[0114] In some embodiments, based on the first vector, the third vector and the stroke thickness, it is determined whether the pixel point is at the two ends of the stroke line, and the pixel point is drawn according to the determination result, including: determining whether the length of the first vector is less than the stroke thickness, or whether the length of the third vector is less than the stroke thickness; if the length of the first vector or the length of the third vector is less than the stroke thickness, it is determined that the pixel point is at the two ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

[0115] For example, Figure 4 A schematic diagram of another information drawing process provided by an embodiment of the present disclosure, such as Figure 4As shown, including the starting point coordinates A, the end point coordinates B and the position coordinates C of the pixel point, first obtain the first vector V1 and the second vector V2, determine the distance L1 between the pixel point and the stroke line according to V1 and V2, and judge whether the pixel point is on the stroke line L2 according to the relationship between L1 and the stroke thickness, the angle θ between V1 and V2, and the projection length of V1 to the stroke line L2. If the pixel point is on the stroke line, set the pixel color of the pixel point to the stroke color. If the pixel point is not on the stroke line, set the transparency of the pixel color of the pixel point to empty.

[0116] In addition, obtain the third vector V3 and determine whether the length of V1 or V3 is less than the stroke thickness. If the length of V1 or V3 is less than the stroke thickness, determine that the pixel point is at both ends of the stroke line and set the pixel color of the pixel point to the stroke color.

[0117] Specifically, the coordinates of the stroke starting point and the corresponding stroke ending point are obtained, and the coordinates of the stroke starting point and the stroke ending point as well as the basic stroke information (color, thickness, etc.) are passed into the single stroke shader for pixel-by-pixel calculation to complete the single-stroke drawing of a single frame, and the single-stroke drawing effect is completed in each frame, and superimposed on the drawing content of the previous frame to achieve stroke drawing. Therefore, drawing directly through the shader layer has higher flexibility and scalability.

[0118] Among them, the first client needs to send the drawing information of the current frame to the server for each frame of stroke drawing. The server records all the drawing information received until it receives a state change of clearing the canvas or ending the game. After receiving each drawing message, the server will immediately broadcast it to other online second clients. For example, when the game is in progress, when a new player joins or an old player disconnects and reconnects, all the recorded drawing information will be immediately broadcast to the corresponding player.

[0119] Therefore, the server still retains the drawing information after broadcasting the message, which can provide a better gaming experience for disconnected players and players who join in the middle of the game, and further meet user needs.

[0120] Step 205, after drawing the current video frame content of the second client, continue to draw the next video frame content of the second client according to the drawing information group corresponding to the next video frame, and splice the corresponding video frame contents of all drawn video frames to generate a target image for display.

[0121] As an example scenario, Figure 5As shown, the first client inputs the starting and ending points of each frame of strokes and other drawing attribute information according to the touch screen position, inputs a single stroke shader to draw a stroke, and encapsulates the frame of drawing information and sends it to the server; the server maintains a drawing information queue, and when drawing information is received, it adds it to the queue, and broadcasts the drawing information to the second client; the second client maintains a drawing information queue, and when drawing information is received, it adds it to the queue, and each frame takes a certain amount of drawing information from the head of the queue in turn, inputs a multi-stroke shader to draw multi-end strokes, and deletes the drawn stroke information from the drawing information queue.

[0122] Specifically, for example, in the game of "I Draw You Guess", Figure 6 As shown, drawing is performed on the first client, and the drawing interface is such as display interface 1, which is displayed synchronously in real time on the second client such as display interface 2. It can be seen that the contents of display interface 1 and display interface 2 are displayed synchronously. It should be noted that if a second client is newly added at this time, the currently displayed content can be rendered and displayed at one time on the display interface of the newly connected second client, so that all second clients can display images synchronously with the first client in real time, further meeting user needs and improving the user experience of drawing scenes.

[0123] The information drawing processing scheme provided by the embodiment of the present disclosure receives drawing stroke information of at least part of the video frame corresponding to the first client in real time, wherein the drawing stroke information includes: the stroke starting point coordinates and the corresponding stroke ending point coordinates used for drawing the video frame content of the first client, as well as the stroke thickness and the stroke color; the drawing stroke information is stored in the stroke queue to be drawn of the second client; a set of drawing stroke information of the video frame of the first client matching the preset video frame threshold number is obtained from the stroke queue; the set of drawing stroke information is used as a drawing information group for drawing the current video frame of the second client; the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, used by the first client to draw different video frame contents contained in the drawing information group corresponding to the current video frame are obtained; the current video frame content of the second client is drawn according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, and the corresponding image is displayed; after drawing the current video frame content of the second client, the next video frame content of the second client is continued to be drawn according to the drawing information group corresponding to the next video frame; the corresponding video frame contents of all drawn video frames are spliced ​​to generate a target image for display. By adopting the above technical solution, the second client synchronously receives the drawing information in real time to draw the content and display the image, so that the first client and the second client can display the same drawing content at the same time. Without using various interfaces, stroke synchronization can be performed to meet the needs of various scenarios.

[0124] Figure 7This is a schematic diagram of the structure of an information drawing processing device provided by an embodiment of the present disclosure. The device can be implemented by software and / or hardware and can generally be integrated into an electronic device. Figure 7 As shown, the device is applied to a first client and includes:

[0125] A first receiving module 301 is used to receive in real time drawing information of at least part of the video frame corresponding to the first client;

[0126] The storage module 302 is used to store the drawing information into a stroke queue to be drawn on the second client;

[0127] An acquisition module 303 is used to acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client;

[0128] The drawing and display module 304 is used to draw the current video frame content of the second client according to the drawing information group corresponding to the current video frame and display the corresponding image.

[0129] Optionally, the device further includes: a second receiving module, configured to:

[0130] Receive drawing information of at least part of the video frame corresponding to the first client video frame broadcasted in real time by the server, wherein the drawing information is the drawing information of at least part of the video frame sent by the first client to the server in real time.

[0131] Optionally, the device further includes:

[0132] A drawing module, configured to, after drawing the current video frame content of the second client, continue to draw the next video frame content of the second client according to the drawing information group corresponding to the next video frame;

[0133] The splicing module is used to splice all the drawn video frames corresponding to the video frame content to generate a target image for display.

[0134] Optionally, the first receiving module 301 includes:

[0135] receiving in real time drawing stroke information of at least part of the video frame corresponding to the first client, the drawing stroke information including: the coordinates of the starting point of the stroke used to draw the video frame content of the first client and the coordinates of the corresponding end point of the stroke, as well as the thickness of the stroke and the color of the stroke;

[0136] Optionally, the drawing and display module 304 is specifically used to:

[0137] an acquisition unit, configured to acquire the stroke starting point coordinates and corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color, contained in the drawing information group corresponding to the current video frame, used by the first client to draw different video frame contents;

[0138] A drawing unit is used to draw the current video frame content of the second client and display the corresponding image according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color.

[0139] Optionally, the drawing unit includes:

[0140] A first determining subunit is used to determine a first vector between the pixel point and the stroke starting point coordinates according to the position coordinates of the pixel point in the current video frame to be drawn by the second client, and to determine a second vector between the stroke starting point coordinates and the corresponding stroke ending point coordinates;

[0141] The first judgment processing subunit is used to judge whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the end point coordinates based on the first vector and the corresponding second vector and the corresponding stroke thickness, and to draw the pixel point based on the judgment result.

[0142] Optionally, the first judgment processing subunit is specifically configured to:

[0143] Determine the distance between the pixel point and the stroke line according to the first vector and the corresponding second vector;

[0144] Determining whether the pixel point is on the stroke line according to the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line;

[0145] If the pixel point is on the stroke line, the pixel color of the pixel point is set to the stroke color;

[0146] If the pixel point is not on the stroke line, the transparency of the pixel color of the pixel point is set to null.

[0147] Optionally, the drawing unit further includes:

[0148] A second determining subunit, configured to determine a third vector between the pixel point and the stroke end point coordinates according to the position coordinates of the pixel point;

[0149] The second judgment processing subunit is used to judge whether the pixel point is at both ends of the stroke line according to the first vector and the corresponding third vector and the stroke thickness, and perform drawing processing on the pixel point according to the judgment result.

[0150] Optionally, the second judgment processing subunit is specifically used to:

[0151] Determine whether the length of the first vector is less than the stroke thickness, or whether the length of the third vector is less than the stroke thickness;

[0152] If the length of the first vector or the length of the third vector is smaller than the stroke thickness, the pixel point is determined to be on both ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

[0153] The information drawing processing device provided in the embodiments of the present disclosure can execute the information drawing processing method provided in any embodiment of the present disclosure, and has the corresponding functional modules and beneficial effects of the execution method.

[0154] The information drawing processing device provided in the embodiments of the present disclosure can execute the information drawing processing method provided in any embodiment of the present disclosure, and has the corresponding functional modules and beneficial effects of the execution method.

[0155] The embodiments of the present disclosure further provide a computer program product, including a computer program / instruction, which implements the information drawing processing method provided by any embodiment of the present disclosure when the computer program / instruction is executed by a processor.

[0156] Figure 8 This is a schematic diagram of the structure of an electronic device provided by an embodiment of the present disclosure. Figure 8 , which shows a schematic diagram of the structure of an electronic device 400 suitable for implementing the embodiment of the present disclosure. The electronic device 400 in the embodiment of the present disclosure may include, but is not limited to, mobile clients such as mobile phones, laptop computers, digital broadcast receivers, PDAs (personal digital assistants), PADs (tablet computers), PMPs (portable multimedia players), vehicle-mounted clients (such as vehicle-mounted navigation clients), etc., and fixed clients such as digital TVs, desktop computers, etc. Figure 8 The electronic device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present disclosure.

[0157] like Figure 8As shown, the electronic device 400 may include a processing device (e.g., a central processing unit, a graphics processing unit, etc.) 401, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 402 or a program loaded from a storage device 408 into a random access memory (RAM) 403. In the RAM 403, various programs and data required for the operation of the electronic device 400 are also stored. The processing device 401, the ROM 402, and the RAM 403 are connected to each other via a bus 404. An input / output (I / O) interface 405 is also connected to the bus 404.

[0158] Typically, the following devices may be connected to the I / O interface 405: an input device 406 including, for example, a touch screen, a touch pad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc.; an output device 407 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; a storage device 408 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 409. The communication device 409 may allow the electronic device 400 to communicate with other devices wirelessly or by wire to exchange data. Although Figure 8 The electronic device 400 is shown with various devices, but it should be understood that it is not required to implement or possess all the devices shown. More or fewer devices may be implemented or possessed instead.

[0159] In particular, according to an embodiment of the present disclosure, the process described above with reference to the flowchart can be implemented as a computer software program. For example, an embodiment of the present disclosure includes a computer program product, which includes a computer program carried on a non-transitory computer-readable medium, and the computer program contains a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication device 409, or installed from the storage device 408, or installed from the ROM 402. When the computer program is executed by the processing device 401, the above-mentioned functions defined in the information drawing processing method of the embodiment of the present disclosure are executed.

[0160] It should be noted that the computer-readable medium disclosed above may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, 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 disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present disclosure, a computer-readable storage medium may be any tangible medium containing or storing a program that may be used by or in combination with an instruction execution system, device or device. In the present disclosure, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, in which a computer-readable program code is carried. This propagated data signal may take a variety of forms, including but not limited to an electromagnetic signal, an optical signal, or any suitable combination of the above. The computer readable signal medium may also be any computer readable medium other than a computer readable storage medium, which may send, propagate or transmit a program for use by or in conjunction with an instruction execution system, apparatus or device. The program code contained on the computer readable medium may be transmitted using any suitable medium, including but not limited to: wires, optical cables, RF (radio frequency), etc., or any suitable combination of the above.

[0161] In some embodiments, the client and the server may communicate using any currently known or future developed network protocol such as HTTP (Hyper Text Transfer Protocol), and may be interconnected with any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include a local area network ("LAN"), a wide area network ("WAN"), an internet (e.g., the Internet), and a peer-to-peer network (e.g., an ad hoc peer-to-peer network), as well as any currently known or future developed network.

[0162] The computer-readable medium may be included in the electronic device, or may exist independently without being incorporated into the electronic device.

[0163] The above-mentioned computer-readable medium carries one or more programs. When the above-mentioned one or more programs are executed by the electronic device, the electronic device: receives an information display trigger operation from a user during video playback; obtains at least two target information associated with the video; displays a first target information among the at least two target information in an information display area on a playback page of the video, wherein the size of the information display area is smaller than the size of the playback page; receives a first switching trigger operation from a user, and switches the first target information displayed in the information display area to the second target information among the at least two target information.

[0164] Computer program code for performing the operations of the present disclosure may be written in one or more programming languages ​​or a combination thereof, including, but not limited to, object-oriented programming languages, such as Java, Smalltalk, C++, and conventional procedural programming languages, such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., through the Internet using an Internet service provider).

[0165] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present disclosure. In this regard, each square box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some implementations as replacements, the functions marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two square 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 square box in the block diagram and / or flow chart, and the combination of the square boxes in the block diagram and / or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0166] The units involved in the embodiments described in the present disclosure may be implemented by software or hardware, wherein the name of a unit does not, in some cases, limit the unit itself.

[0167] The functions described above herein may be performed at least in part by one or more hardware logic components. For example, without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chips (SOCs), complex programmable logic devices (CPLDs), and the like.

[0168] In the context of the present disclosure, a machine-readable medium may be a tangible medium that may contain or store a program for use by or in conjunction with an instruction execution system, device, or equipment. A machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or equipment, or any suitable combination of the foregoing. A more specific example of a machine-readable storage medium may include an electrical connection based on one or more lines, a portable computer disk, 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 disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

[0169] According to one or more embodiments of the present disclosure, the present disclosure provides an electronic device, including:

[0170] processor;

[0171] a memory for storing instructions executable by the processor;

[0172] The processor is used to read the executable instructions from the memory and execute the instructions to implement any information drawing processing method provided by the present disclosure.

[0173] According to one or more embodiments of the present disclosure, the present disclosure provides a computer-readable storage medium, wherein the storage medium stores a computer program, and the computer program is used to execute any information drawing processing method provided by the present disclosure.

[0174] The above description is only a preferred embodiment of the present disclosure and an explanation of the technical principles used. Those skilled in the art should understand that the scope of disclosure involved in the present disclosure is not limited to the technical solutions formed by a specific combination of the above technical features, but should also cover other technical solutions formed by any combination of the above technical features or their equivalent features without departing from the above disclosed concept. For example, the above features are replaced with the technical features with similar functions disclosed in the present disclosure (but not limited to) by each other to form a technical solution.

[0175] In addition, although each operation is described in a specific order, this should not be understood as requiring these operations to be performed in the specific order shown or in a sequential order. Under certain circumstances, multitasking and parallel processing may be advantageous. Similarly, although some specific implementation details are included in the above discussion, these should not be interpreted as limiting the scope of the present disclosure. Some features described in the context of a separate embodiment can also be implemented in a single embodiment in combination. On the contrary, the various features described in the context of a single embodiment can also be implemented in multiple embodiments individually or in any suitable sub-combination mode.

[0176] Although the subject matter has been described in language specific to structural features and / or methodological logical actions, it should be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or actions described above. On the contrary, the specific features and actions described above are merely example forms of implementing the claims.

Claims

1. An information drawing processing method, characterized in that: include: receiving in real time drawing information of at least part of the video frames corresponding to the first client; wherein each drawing stroke of the brush from the starting position to the ending position on the first client is used as each frame of the video, and the drawing information corresponding to different drawing scenes is different; Storing the drawing information in a stroke queue to be drawn on the second client; Acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client; The current video frame content of the second client is drawn according to the drawing information group corresponding to the current video frame and a corresponding image is displayed.

2. The method according to claim 1, characterized in that Also includes: Receive drawing information of at least part of the video frame corresponding to the first client video frame broadcasted in real time by the server, wherein the drawing information is the drawing information of at least part of the video frame sent by the first client to the server in real time.

3. The method according to claim 1, characterized in that Also includes: After drawing the current video frame content of the second client, continue to draw the next video frame content of the second client according to the drawing information group corresponding to the next video frame; All drawn video frames are stitched together to generate a target image for display.

4. The method according to claim 1, characterized in that: The real-time receiving of drawing information of at least a portion of the video frames corresponding to the first client includes: receiving in real time drawing stroke information of at least part of the video frame corresponding to the first client, the drawing stroke information including: the coordinates of the starting point of the stroke used to draw the video frame content of the first client and the coordinates of the corresponding end point of the stroke, as well as the thickness of the stroke and the color of the stroke; The step of drawing the current video frame content of the second client according to the drawing information group corresponding to the current video frame and displaying the corresponding image includes: Obtaining the stroke starting point coordinates and corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color, which are contained in the drawing information group corresponding to the current video frame and are used by the first client to draw different video frame contents; The current video frame content of the second client is drawn according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and the stroke color, and the corresponding image is displayed.

5. The method according to claim 4, characterized in that Drawing the current video frame content of the second client according to the stroke starting point coordinates and the corresponding stroke ending point coordinates, as well as the stroke thickness and stroke color and displaying the corresponding image includes: Determine a first vector between the pixel point and the stroke starting point coordinates according to the position coordinates of the pixel point in the current video frame to be drawn by the second client, and determine a second vector between the stroke starting point coordinates and the corresponding stroke ending point coordinates; According to the first vector and the corresponding second vector and the corresponding stroke thickness, it is determined whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the end point coordinates, and the pixel point is drawn according to the determination result.

6. The method according to claim 5, characterized in that According to the first vector and the corresponding second vector and the corresponding stroke thickness, determining whether the pixel point is located on the stroke straight line corresponding to the starting point coordinates to the end point coordinates, and performing drawing processing on the pixel point according to the determination result, including: Determine the distance between the pixel point and the stroke line according to the first vector and the corresponding second vector; Determining whether the pixel point is on the stroke line according to the relationship between the distance and the stroke thickness, the angle between the first vector and the second vector, and the projection length of the first vector onto the stroke line; If the pixel point is on the stroke line, the pixel color of the pixel point is set to the stroke color; If the pixel point is not on the stroke line, the transparency of the pixel color of the pixel point is set to null.

7. The method according to claim 5, characterized in that Also includes: Determine a third vector between the pixel point and the stroke end point coordinates according to the position coordinates of the pixel point; According to the first vector, the corresponding third vector and the stroke thickness, it is determined whether the pixel point is on both ends of the stroke line, and the pixel point is drawn according to the determination result.

8. The method according to claim 7, characterized in that The step of judging whether the pixel point is at both ends of the stroke line according to the first vector, the corresponding third vector and the stroke thickness, and performing drawing processing on the pixel point according to the judging result includes: Determine whether the length of the first vector is less than the stroke thickness, or whether the length of the third vector is less than the stroke thickness; If the length of the first vector or the length of the third vector is smaller than the stroke thickness, the pixel point is determined to be on both ends of the stroke line, and the pixel color of the pixel point is set to the stroke color.

9. An information drawing processing device, characterized in that: include: A first receiving module is used to receive in real time drawing information of at least part of the video frame corresponding to the first client; wherein each drawing stroke of the brush from the starting position to the ending position on the first client is used as each frame of the video frame, and the drawing information corresponding to different drawing scenes is different; A storage module, used for storing the drawing information into a stroke queue to be drawn on the second client; an acquisition module, configured to acquire a set of drawing information of the first client video frame that matches a preset video frame threshold number from the stroke queue, and use the set of drawing information as a drawing information group for drawing the current video frame of the second client; A drawing and display module is used to draw the current video frame content of the second client according to the drawing information group corresponding to the current video frame and display the corresponding image.

10. An electronic device, characterized in that: The electronic device comprises: processor; a memory for storing instructions executable by the processor; The processor is used to read the executable instructions from the memory and execute the instructions to implement the information drawing processing method described in any one of claims 1 to 8.

11. A computer-readable storage medium, characterized in that: The storage medium stores a computer program, and the computer program is used to execute the information drawing processing method according to any one of claims 1 to 8.

Images