Information display method and device, electronic equipment, storage medium and program product
By overlaying visual symbols within the dialogue interface, the problem of rich text generated by large language models failing to convey emotional nuances is solved, thus improving the user reading experience and information display effect.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- BEIJING ZITIAO NETWORK TECH CO LTD
- Filing Date
- 2026-04-07
- Publication Date
- 2026-06-26
AI Technical Summary
In existing technologies, rich text content generated by large language models cannot effectively convey emotional nuances, resulting in a poor user reading experience.
By capturing sentiment markers from rich text, visual symbols are overlaid and displayed within the dialogue interface. The appearance is determined based on the dialogue content and sentiment markers, thus achieving accurate expression of emotional nuances.
It improves the amount of rich text information displayed and the user reading experience, enhances the depth of emotional information delivery, and improves the efficiency of human-computer interaction.
Smart Images

Figure CN122284875A_ABST
Abstract
Description
Technical Field
[0001] This disclosure relates to the field of computer technology, and in particular to an information display method, apparatus, electronic device, storage medium, and program product. Background Technology
[0002] Currently, with the widespread application of Large Language Models (LLMs) in content generation, dialogue interaction and other scenarios, the text output by the model is no longer just a simple carrier of information, but often contains rich soft semantic information such as emotions, tone and attitude, thereby achieving the expression of specific emotional coloring.
[0003] However, in existing technical solutions, the rich text content generated by the large model and containing soft semantic information such as emotions is still presented in plain text form within the dialog interface. This results in the client being unable to present the emotional color of the text, affecting the user's reading experience. Summary of the Invention
[0004] This disclosure provides an information display method, apparatus, electronic device, storage medium, and program product to overcome the problem of being unable to present the emotional color of text.
[0005] In a first aspect, embodiments of this disclosure provide an information display method, including:
[0006] Obtain the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and a sentiment tag corresponding to the first rich text fragment.
[0007] The first rich text is displayed in the dialogue interface, and a corresponding visual symbol is overlaid at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and the emotion marker.
[0008] Secondly, embodiments of this disclosure provide an information display device, comprising:
[0009] The acquisition module is used to acquire the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and a sentiment tag corresponding to the first rich text fragment.
[0010] The processing module is used to display the first rich text in the dialogue interface, and to overlay a corresponding visual symbol at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and the emotion marker.
[0011] Thirdly, embodiments of this disclosure provide an electronic device, including: a processor and a memory;
[0012] The memory stores computer-executed instructions;
[0013] The processor executes computer execution instructions stored in the memory, causing the at least one processor to perform the information display method as described in the first aspect and various possible designs of the first aspect.
[0014] Fourthly, embodiments of this disclosure provide a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, implement the information display method described in the first aspect and various possible designs of the first aspect.
[0015] Fifthly, embodiments of this disclosure provide a computer program product, including a computer program that, when executed by a processor, implements the information display method described in the first aspect and various possible designs of the first aspect.
[0016] The information display method, apparatus, electronic device, storage medium, and program product provided in this embodiment acquire first rich text, which represents first dialogue content. The first rich text includes a first rich text fragment and a corresponding sentiment marker. The first rich text is displayed within a dialogue interface, and a corresponding visual symbol is overlaid at the location of the first rich text fragment. The appearance of the visual symbol is determined based on the first dialogue content and the sentiment marker. By enabling the client to convert and locate the content in the rich text after receiving rich text containing sentiment markers generated by a large model, a visual symbol matching the sentiment marker and dialogue content is displayed at the location of the first rich text fragment while simultaneously displaying the first rich text. This achieves accurate expression of the emotional tone corresponding to specific content in the rich text, thereby increasing the amount and accuracy of information displayed in the rich text and improving the user's reading experience. Attached Figure Description
[0017] To more clearly illustrate the technical solutions in the embodiments of this disclosure or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of this disclosure. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0018] Figure 1 This is an application scenario diagram of the information display method provided in the embodiments of this disclosure;
[0019] Figure 2 Flowchart of the information display method provided in the embodiments of this disclosure Figure 1 ;
[0020] Figure 3 A schematic diagram illustrating the display of visual symbols provided in an embodiment of this disclosure;
[0021] Figure 4 This is a schematic diagram illustrating a process of displaying interactive information, provided as an embodiment of the present disclosure.
[0022] Figure 5 for Figure 2 A flowchart illustrating the specific implementation of step S103 in the illustrated embodiment;
[0023] Figure 6 Flowchart of the information display method provided in the embodiments of this disclosure Figure 2 ;
[0024] Figure 7 for Figure 6 A flowchart illustrating the specific implementation of step S204 in the illustrated embodiment;
[0025] Figure 8 for Figure 6 A flowchart illustrating the specific implementation of step S205 in the illustrated embodiment;
[0026] Figure 9 for Figure 8 A flowchart illustrating the specific implementation of step S2052 in the illustrated embodiment;
[0027] Figure 10 A schematic diagram illustrating the process of displaying visual symbols provided in this embodiment of the disclosure;
[0028] Figure 11 This is a structural block diagram of an information display device provided in an embodiment of the present disclosure;
[0029] Figure 12 This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present disclosure;
[0030] Figure 13 This is a schematic diagram of the hardware structure of an electronic device provided in an embodiment of this disclosure. Detailed Implementation
[0031] To make the objectives, technical solutions, and advantages of the embodiments of this disclosure clearer, the technical solutions of the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this disclosure, and not all embodiments. Based on the embodiments of this disclosure, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this disclosure.
[0032] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, data stored, data displayed, etc.) involved in this disclosure are all information and data authorized by the user or fully authorized by all parties. Furthermore, the collection, use and processing of the relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions, and corresponding operation entry points are provided for users to choose to authorize or refuse.
[0033] It is understood that before using the technical solutions disclosed in the various embodiments of this disclosure, users should be informed of the types, scope of use, and usage scenarios of the personal information involved in this disclosure in an appropriate manner in accordance with relevant laws and regulations, and user authorization should be obtained.
[0034] For example, upon receiving a user's active request, a prompt message is sent to the user to explicitly inform them that the requested operation will require the acquisition and use of the user's personal information. This allows the user to independently choose whether to provide personal information to the software or hardware, such as the electronic device, application, server, or storage medium performing the operations of this disclosed technical solution, based on the prompt message.
[0035] As an optional but non-limiting implementation, in response to a user's active request, sending a prompt message to the user can be done via a pop-up window, where the prompt message can be presented in text format. Furthermore, the pop-up window can also include a selection control allowing the user to choose "agree" or "disagree" to provide personal information to the electronic device.
[0036] It is understood that the above notification and user authorization process are merely illustrative and do not constitute a limitation on the implementation of this disclosure. Other methods that comply with relevant laws and regulations may also be applied to the implementation of this disclosure.
[0037] The application scenarios of the embodiments of this disclosure are explained below:
[0038] The information display method provided in this disclosure can be applied to applications (APPs) with rich text display capabilities, such as reading applications, note-taking applications, and text-based game applications. More specifically, it can be applied to application scenarios such as simulated journal display and game script display. The execution subject of this embodiment can be a terminal device running the aforementioned application with rich text display capabilities, a server deploying the server corresponding to the aforementioned application, or other electronic devices that perform similar functions. Specifically, when the execution subject is a terminal device, the terminal device executes the method provided in this embodiment by running the client of the aforementioned application; when the execution subject is a server, the server of the aforementioned application with rich text display capabilities can run partially or entirely on the server, and the method provided in this embodiment is executed on the server side, while the terminal device runs the client of the application. Communication between the server and the terminal device is based on server-client communication, thereby enabling the terminal device to obtain the execution result of the method provided in this embodiment and display it as needed.
[0039] In some embodiments, the terminal device or server can implement the information display method provided in this disclosure by running various computer-executable instructions or computer programs. For example, computer-executable instructions can be program-level commands, machine instructions, or software instructions. Computer programs can be native programs or software modules in an operating system; they can be local applications, i.e., programs that need to be installed in the operating system to run, or mini-programs embedded in any app, i.e., programs that run in a browser environment. In summary, the aforementioned computer-executable instructions can be any form of instruction, and the aforementioned computer programs can be any form of application, module, or plugin; the specific implementation can be configured as needed. Furthermore, in implementing the information display method provided in this disclosure, the terminal device can execute the method by running computer-executable instructions or computer programs set locally, or by calling computer-executable instructions or computer programs set in an external server. In some embodiments, the server may be an independent physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides basic cloud computing services such as cloud services, cloud storage, cloud communication, cloud database, cloud computing, cloud functions, network services, middleware services, domain name services, security services, content delivery network (CDN), and big data and artificial intelligence platforms. Among these, cloud services may be interactive processing services that can be invoked by terminal devices.
[0040] Figure 1This is an application scenario diagram of the information display method provided in the embodiments of this disclosure, with reference to... Figure 1 As shown in the diagram, taking a terminal device as an example, the terminal device runs a target application with rich text display capabilities, such as a rich text journaling app or an intelligent chat application. After a user triggers a content generation function (e.g., asking a question, chatting) through the client of this target application, the client sends a generation request to the server of the target application. The server generates the corresponding rich text by calling a large model deployed locally or externally, and returns it to the client. The client then displays the rich text in its interface, thus enabling AI chat and dialogue functionalities. Referring to the diagram, the rich text includes text content with special font formatting (represented by "X" in the diagram) and various multimedia elements, thereby achieving richer content expression.
[0041] In some related technologies, rich text content generated by large models and containing soft semantic information such as emotions can be parsed using rich text technology to achieve simple font styles such as bolding and italics. However, it cannot support richer and more expressive visual symbols, and its fixed style results in poor information presentation. In many other solutions, it is usually presented in plain text form within the dialog interface, which prevents the client from experiencing the emotional nuances of the text and affects the user's reading experience.
[0042] This disclosure provides an information display method to solve the above-mentioned problems.
[0043] refer to Figure 2 , Figure 2 Flowchart of the information display method provided in the embodiments of this disclosure Figure 1 The method of this embodiment can be applied to a terminal device or a server. In one possible implementation, for a terminal device executing the method provided in this embodiment, the terminal device can execute program code deployed locally and / or externally to implement the information display method provided in this embodiment. In another possible implementation, a server can be used to deploy functional services implemented based on the information display method provided in this embodiment, and the terminal device can access the server and call the corresponding functional services to implement the information display method provided in this embodiment. For example, the information display method provided in this embodiment includes:
[0044] Step S101: Obtain the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and the sentiment tag corresponding to the first rich text fragment.
[0045] Step S102: Display the first rich text in the dialogue interface, and overlay the corresponding visual symbol at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and sentiment marker.
[0046] refer to Figure 1 The illustrated application scenario diagram illustrates the information display method using a terminal device as the execution subject in this embodiment. For example, the terminal device runs a target application and, upon receiving a user-inputted operation request (e.g., a chat request), sends a request to the target application's server via the target application's client. The target application's server then calls a large model to generate corresponding rich text content, i.e., the first rich text. This first rich text, generated by the large model, represents the content of the first dialogue, which is the response to the user-inputted operation request (e.g., the chat request). The first rich text is then returned to the client, including a first rich text fragment and a corresponding sentiment marker. In one possible implementation, the first rich text is a Hyper Text Markup Language (HTML) code fragment, a specialized HTML code fragment for carrying rich text content, generated based on the capabilities of the large model. Specifically, the server-side large model generates the first rich text and returns it to the client via an interface. In the first rich text, a text fragment with an attached emotion needs to be included, namely the first rich text fragment. The emotion tag is used to indicate the relevant content of the emotion of the first rich text fragment. For example, the first rich text fragment is wrapped with a span tag, the style of the emotion tag is characterized by a class field, and the explanatory information used to describe the emotion of the first rich text fragment is characterized by a data-* field, which is the interactive information in subsequent embodiments.
[0047] Subsequently, upon receiving the first rich text, the client renders it within its dialog interface using appropriate functional components. This rendering is then displayed in the client's display container, a component used for content display within the dialog interface. The implementation details of this display container are omitted here. Further, during the display of the first rich text, the client generates visual symbols matching sentiment markers based on the text's content. These symbols are generated based on specific sentences, scenarios, and modes of dialogue represented by the first rich text, combined with the sentiment markers corresponding to the rich text fragments. Examples include "circle" and "wavy line" symbols. These symbols are then overlaid at the location indicated by the sentiment markers, highlighting the rich text fragments. Simultaneously, the appearance of these visual symbols is correlated with the sentiment markers; that is, the appearance of the visual symbols corresponds to the type of the associated sentiment markers, and the appearance of the visual symbols is determined by the type of the sentiment markers. In one possible implementation, the appearance of the visual symbols and the emotion types expressed by the associated emotion tags, such as happiness and sadness, correspond to different visual symbols. By overlaying the visual symbols on the location of the first rich text fragment, the emotion of the first rich text fragment can be expressed.
[0048] Figure 3 This is a schematic diagram illustrating the display of visual symbols provided in an embodiment of the present disclosure, such as... Figure 3 As shown, exemplarily, in response to the client receiving the first rich text sent by the server, within the client's interactive interface, while displaying the text content of the first rich text (represented by "X" in the figure), a set of "wavy line" symbols is displayed at specific text sections, i.e., the first rich text fragments. These "wavy line" symbols, for example, represent the emotion of "happiness." Through this method, the emotion expressed by the first rich text fragment is displayed, enhancing the information richness in rich text display scenarios.
[0049] Furthermore, in one possible implementation, after step S102, the following is also included:
[0050] Step S103: In response to the first operation, display interactive information, wherein the first operation is directed to a visual symbol and the interactive information is used to characterize the emotional description for the first rich text fragment.
[0051] For example, based on displaying the first rich text within the client's dialog interface and overlaying the corresponding visual symbol at the location of the first rich text fragment, if the user needs to further understand the meaning of the visual symbol, they can apply a first operation to the visual symbol to further display interactive information. In one possible implementation, the interactive information is used to characterize the emotional description of the first rich text fragment, such as joy, sadness, or indifference. In another possible implementation, the interactive information can also be used to characterize other supplementary explanations of the first rich text fragment, such as displaying the complete content of the first rich text fragment when it is not fully displayed in the dialog interface; or displaying a descriptive image of the first rich text fragment.
[0052] Figure 4 This is a schematic diagram illustrating a process of displaying interactive information, as provided in an embodiment of this disclosure. Figure 4 As shown, for example, the client's dialog interface displays the full text of the first rich text and overlays a corresponding visual symbol at the location of the first rich text fragment. In response to a user's click on a visual symbol (shown as a "circle" symbol in the diagram) of a specific first rich text fragment, an interactive window, or interactive pop-up, will appear at the location of the visual symbol. This interactive window will display a description of the emotion of the first rich text fragment, i.e., interactive information. For example, as shown in the diagram, the interactive information is "hysterical shouting."
[0053] Furthermore, in one possible implementation, such as Figure 5 As shown, the specific implementation of step S103 includes:
[0054] Step S1031: In response to clicking the visual symbol, an interactive event is triggered.
[0055] Step S1032: Obtain the metadata of the emotion tag based on the interaction event.
[0056] Step S1033: Present interactive information generated based on metadata in the display container.
[0057] For example, in the steps of this embodiment, the operation of clicking the visual symbol, i.e. the first operation, after the operation of clicking the visual symbol is detected, the client triggers a pre-bound interactive event. After the event is triggered, an interactive pop-up containing metadata is generated in the display container. The interactive pop-up is used to display interactive information. Specifically, metadata is extracted from the data-* attribute of the emotion tag, and then interactive information is generated in the created interactive pop-up based on the content of the metadata.
[0058] In this embodiment, the lack of interpretability of static emotional symbols (i.e., visual symbols) is solved by generating interactive events and pop-ups, forming a complete closed-loop experience of "marking-interaction-interpretation". This technique significantly enhances the depth of emotional information transmission and improves the bandwidth of human-computer interaction and user cognitive efficiency.
[0059] In this embodiment, a first rich text is acquired, representing the content of a first dialogue. This first rich text includes a first rich text fragment and a corresponding sentiment marker. The first rich text is displayed within the dialogue interface, and a corresponding visual symbol is overlaid at the location of the first rich text fragment. The appearance of the visual symbol is determined based on the first dialogue content and the sentiment marker. By enabling the client to transform and locate the content within the rich text after receiving it from a large model (containing sentiment markers), a visual symbol matching the sentiment marker is displayed at the location of the first rich text fragment while simultaneously displaying the first rich text. This expresses the emotional tone corresponding to a portion of the rich text content, thereby increasing the information display volume and efficiency of the rich text and improving the user's reading experience.
[0060] refer to Figure 6 , Figure 6 Flowchart of the information display method provided in the embodiments of this disclosure Figure 2 This embodiment is in Figure 2 Based on the illustrated embodiment, step S102 is further refined, and the information display method includes:
[0061] Step S201: Obtain the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and the sentiment tag corresponding to the first rich text fragment.
[0062] Step S202: Based on the first rich text, generate a document object model, and display the first rich text in the dialog interface based on the document object model.
[0063] Step S203: Obtain the document object model node containing the sentiment marker.
[0064] Step S204: Based on the geometric information of the document object model node, obtain the first coordinate. The first coordinate represents the relative position of the visualization symbol in the display container, which is used to display the content of the first rich text.
[0065] Step S205: Generate a visual symbol corresponding to the emotion marker in the display container based on the first coordinate.
[0066] For example, after obtaining the first rich text generated by the large model, it is first processed to convert it into a Document Object Model (DOM). The DOM is a tree-structured data structure stored in memory, and the nodes (also called element nodes) in the tree structure are DOM nodes, which are the objectified representations of tags in the first rich text content. After generating the DOM, rendering it allows the display of the text content from the first rich text. On the other hand, by filtering the DOM nodes, objects containing sentiment markers are obtained, resulting in DOM nodes with sentiment markers. For example...<spanclass="circle-selection"> ...that is, a document object model node containing sentiment tags of type "circle-selection". Steps S203-S204 above are the specific implementation methods for obtaining the first coordinates corresponding to the first rich text fragment. Here, the first coordinates represent the relative position of the visualization symbol within the display container, which is used to display the content of the first rich text. Of course, the first coordinates corresponding to the first rich text fragment can also be obtained in other ways. For example, during the generation of the first rich text, the large model simultaneously generates the first coordinates corresponding to the first rich text fragment and records them as additional information in the first rich text. When the terminal device processes the first rich text, the first coordinates can be obtained from the first rich text.
[0067] Next, the rectangular region data of the Document Object Model (DOM) node is obtained through a browser API, such as getClientRects(), including its position (left, top) and dimensions (width, height), i.e., the geometric information of the DOM node. Then, based on this geometric information, calculations are performed to obtain the position information of the rectangular region data matching the DOM node, i.e., the first coordinate. This first coordinate represents the relative position of the visual symbol within the display container. Finally, a visual symbol with the appearance matching the sentiment marker is obtained and displayed at the aforementioned first coordinate, thus achieving the overlay display effect of the visual symbols.
[0068] In one possible implementation, the specific execution process of the above steps is as follows:
[0069] (1) Obtain all document object model nodes with sentiment tags through DOM query, as the original data source for sentiment tags.
[0070] (2) For each document object model node, call to obtain its geometric information on the screen, and combine it with the extraction collection information method of the display container to calculate the relative coordinates (relativeLeft, relativeTop) to eliminate the influence of environmental factors such as scaling and scrolling.
[0071] (3) Based on relative coordinates, a visual symbol is dynamically generated in the display container, and then the visual symbol is superimposed on the precise position indicated by the sentiment marker through absolute positioning and z-index control. After the above processing, the sentiment marker and the visual symbol are pixel-level aligned in the target container (display container), ensuring the stability of the symbol in complex rich text (such as line spanning and multilingual mixing).
[0072] In this embodiment, by hierarchically parsing the document object model nodes and geometric information, and combining this with relative coordinate calculations, the problem of emotion symbol offset caused by the complexity of rich text environments (such as nested HTML tags, multilingual mixing, and cross-line text) in traditional technologies is solved. In rich text environments containing complex HTML structures, cross-line text, and multilingual mixing, pixel-level alignment of emotion symbols is achieved, providing a reliable foundation for subsequent dynamic rendering and interaction, and significantly improving the robustness of emotion visualization in complex scenarios and the user experience.
[0073] Furthermore, in one possible implementation, such as Figure 7 As shown, the specific implementation of step S204 includes:
[0074] Step S204A-1: Based on geometric information, obtain the first absolute position of the document object model node in the screen coordinate system;
[0075] Step S204A-2: Obtain the second absolute position of the display container in the screen coordinate system;
[0076] Step S204A-3: Obtain the first coordinate based on the difference between the first absolute position and the second absolute position.
[0077] First, obtain all document object model nodes that need to be processed, for example, find all nodes that need to be circled. Elements, then, for each The process begins by retrieving a list of the position matrices (i.e., the first absolute positions) of each element across all rows on the plane. Then, by analyzing the properties of the display container, the absolute position of the display container in the screen coordinate system is read; this is the second absolute position. Next, for each rectangle, its relative position with respect to the display container (parent container) is calculated; this is the first coordinate. In this embodiment, the absolute position in the screen coordinate system accurately reflects the actual position of the emotion marker in the viewport, while the absolute position of the target container provides a positioning reference. The difference between the two ensures the relative stability of the emotion marker within the target container. This technique avoids the positioning errors caused by the complexity of container hierarchies in traditional methods, further improving the robustness of emotion symbols in dynamic rich text scenarios.
[0078] In another possible implementation, the first coordinate includes at least two sub-coordinates, and the first rich text fragment corresponds to at least two multi-line text regions. For example... Figure 7 As shown, the specific implementation of step S204 includes:
[0079] Step S204B-1: Obtain the collection of cross-line text regions of the document object model node.
[0080] Step S204B-2: For each cross-line text region, calculate its sub-coordinates within the display container.
[0081] Step S204B-3: Merge the sub-coordinates of all cross-line text regions to generate the first coordinate.
[0082] For example, the set of cross-line text regions refers to multiple rectangular areas (rectangular areas are cross-line text regions) of the text covered by the emotion marker when displayed across lines, i.e., there is a problem of text wrapping. For the above text, in this embodiment, the set of cross-line text regions of the emotion marker is obtained, and then the relative coordinates of each cross-line text region in the target container are calculated. This step can be implemented using the getBoundingClientRect() function. Then, the relative coordinates (sub-coordinates) of all regions are merged to obtain complete positioning information, i.e., the first coordinate. The processing result of the above steps is the complete positioning data of the emotion marker in the cross-line text, which can be used for subsequent line-by-line overlay of symbols. By obtaining the sub-coordinates of the cross-line text regions in the display container, and then merging the sub-coordinates of all cross-line text regions to generate the first coordinate, the positioning of the first rich text fragment in the case of cross-line text is achieved. In the above implementation, the problem of emotion symbol breakage or overflow caused by single-line positioning is solved by processing the cross-line text regions line by line. The merging calculation of cross-line text regions is realized, thereby ensuring the accurate overlay of visual symbols on each line of text and avoiding symbol misalignment due to line breaks. It further enhances the stability of visual symbols for expressing emotions in complex rich texts (such as long text paragraphs and multilingual mixtures).
[0083] Furthermore, in one possible implementation, such as Figure 8 As shown, the specific implementation of step S205 includes:
[0084] Step S2051: Load the graphic template corresponding to the emotion marker.
[0085] Step S2052: Scale the graphic template horizontally to obtain the visual symbol.
[0086] Step S2053: Overlay the visual symbol onto the first coordinate in the display container for display.
[0087] For example, the graphic template refers to a predefined vector graphics file (such as SVG) used to generate the emotion symbol. By parsing the content covered by the emotion mark, a field representing the type of the emotion mark, such as "class," can be obtained. Then, based on the field value, the corresponding graphic template is obtained; for example, based on the type of the emotion mark (such as "circle" or "underline"), the corresponding graphic template is loaded. Then, in one possible implementation, step S2052 specifically includes: horizontally scaling the graphic template according to the width of the first rich text fragment to obtain the visual symbol, wherein the coverage width of the emotion mark, i.e., the width of the first rich text fragment, is used to horizontally scale the graphic template to obtain the actual displayed visual symbol, ensuring that the visual symbol covers the first rich text fragment; then, the scaled graphic template is superimposed onto a specified relative coordinate position in the display container, i.e., the first position, to achieve accurate rendering of the visual symbol on the target text fragment. In another possible implementation, the graphic template can be horizontally scaled based on device parameters such as the resolution of the terminal device to obtain a visual symbol with a width matching the device parameters.
[0088] In this embodiment, by dynamically scaling the graphic template, the visual symbols generated based on the graphic template can adapt to text fragments of any length, avoiding symbol misalignment caused by fixed size, thereby improving the expressiveness and positional accuracy of the visual symbols.
[0089] Furthermore, in one possible implementation, such as Figure 9 As shown, the specific implementation of step S2052 includes:
[0090] Step S2052-1: Identify the first language corresponding to the first dialogue content based on the language detection model.
[0091] Step S2052-2: Based on the first language, obtain the width parameter of the first rich text segment. The width parameter is used to perform width compensation for the characters in the first language.
[0092] Step S2052-3: Scale the graphic template horizontally according to the width parameter to obtain the visual symbol.
[0093] For example, in the process of adjusting the width of the graphic template based on the first rich text fragment, the language used in the text content of the first rich text is first identified using a language detection model, that is, the first language corresponding to the first dialogue content is identified. Different first languages can refer to different languages, such as English and Chinese; or different text formats, such as SimSun and KaiTi in Chinese. Then, based on this first language, the corresponding width parameter is obtained. The width parameter is used for width compensation of characters in the first language. The width parameter refers to an adjustment coefficient for the width difference of characters in different languages. For example, if the width of a Chinese character is 1.5 times that of an English character, then the width parameter for English characters is 1, and the width parameter for Chinese characters is 1.5. Since different first languages correspond to different width parameters, when the graphic template is horizontally scaled, it can be dynamically supplemented based on this width parameter, thereby achieving the technical effect of different widths for the corresponding visual symbols in different languages, improving the size matching degree between the visual symbols and the first rich text fragment. The above method first obtains the width parameter, which is determined based on the first language corresponding to the first dialogue content. Then, based on the width parameter, the graphic template is horizontally scaled to obtain a visual symbol, so that the width of the visual symbol can match the language type corresponding to the first dialogue content, thereby improving the font matching degree between the visual symbol and the first rich text and improving the display effect.
[0094] Furthermore, in this embodiment, after step S2052, the following steps are also included:
[0095] Step S2054: Parse the graphic template into a document object model object.
[0096] Step S2055: Obtain the background theme color of the dialog interface, and dynamically adjust the first attribute of the object model object based on the background theme color so that the color of the visual symbol matches the background theme color.
[0097] For example, in one possible implementation, during image rendering, the corresponding graphic template is asynchronously loaded, and relevant utility functions are used to parse the graphic template into a Document Object Model (DOM) object. Then, based on the interface provided by the DOM object, the color attribute (first attribute) of the graphic template is dynamically modified, thereby changing the color of the generated visual symbol. Specifically, the background theme color needs to be obtained first. This background theme color can be obtained through the color attribute of the currently displayed page. Then, based on this background theme color and a preset mapping logic, a threshold-matching color is determined as the target color, such as the contrast color of the background theme color. The target color is then configured as the color of the visual symbol, thus matching the color of the visual symbol with the background theme color, avoiding situations where the color of the visual symbol is the same as, similar to, or mismatched with the background theme color, which would affect the visual effect of the visual symbol. In the above embodiments, the background theme color of the dialogue interface is first obtained, and then the appearance of the visual symbol is obtained based on the background theme color, so that the appearance of the visual symbol matches the background theme color of the dialogue interface, thereby improving the visualization effect of the visual symbol; further, in one possible implementation, the background theme color of the dialogue interface is generated by the large model based on the first dialogue content. In this way, the first rich text, visual symbol and background theme color displayed in the dialogue interface are highly unified in the content dimension, improving content consistency.
[0098] In one possible implementation, before step S205, the method further includes: obtaining initialization parameters and, based on the initialization parameters, clearing existing symbol elements in the first display container, wherein the initialization parameters are used to characterize the first display container and the appearance of the visual symbols.
[0099] In this case, the specific implementation of step S205 includes:
[0100] Step S205A: Based on the first coordinates and the appearance of the visual symbol, generate a visual symbol corresponding to the emotion marker in the first display container.
[0101] For example, after receiving the first rich text, the functional component obtains and initializes itself using an initialization function. This initialization function is called with parameters such as the type and color of the mood markers, and the display container identifier. The initialization function then clears all existing symbol elements from the first display container, which is the display container indicated by the display container identifier. A graphic template is then loaded and displayed within the first display container. In one possible implementation, all generated visual symbols in the display container are given a uniform class name. When content is redrawn or the window size changes, the initialization function first removes all old markers in batches, then creates and adds all new visual markers at once. This batch DOM manipulation reduces the number of reflows and redraws, improving display speed and reducing system resource consumption.
[0102] Correspondingly, in the process of displaying visual symbols in the first display container, based on the first coordinates, the appearance of the visual symbols recorded in the initialization parameters (obtained by the type mapping of the emotion marker) is further used to generate visual symbols corresponding to the emotion markers in the first display container, thereby realizing the control of the appearance of the visual symbols, making their appearance more consistent with the emotion markers, and improving the accuracy and matching of the visual symbols.
[0103] It is understandable that the steps in step S2050 above can also be combined with the above. Figure 8 The steps of the illustrated embodiment can be further implemented in another specific way, including:
[0104] Step S2050: Obtain initialization parameters and, based on the initialization parameters, clear the existing symbol elements in the first display container. The initialization parameters are used to characterize the first display container and the appearance of the visual symbols.
[0105] Step S2051: Load the graphic template corresponding to the appearance of the visual symbol according to the initialization parameters.
[0106] Step S2052: Scale the graphic template horizontally according to the width of the first rich text fragment to obtain the visual symbol.
[0107] Step S2053: Overlay the visual symbol onto the first coordinate in the display container for display.
[0108] The steps described above in this embodiment, namely... Figure 8 Prior to the illustrated embodiment, initialization steps were added; the subsequent implementation details are similar to... Figure 8 The implementation methods of each step in the illustrated embodiment are similar and will not be repeated here. Please refer to [link to relevant documentation]. Figure 8 The relevant descriptions in the illustrated embodiments are as follows.
[0109] Figure 10 This is a schematic diagram illustrating a process for displaying visual symbols according to an embodiment of this disclosure. The following is an example... Figure 10 For example, the information display method provided in the above embodiments will be further described, such as... Figure 10 As shown, the process includes:
[0110] S1: Content generation and reception.
[0111] In response to user requests, the server-side big data model generates rich text and returns it to the client via an API for user viewing. Text fragments requiring added emotional text are... The tag is wrapped with a class to specify the style, and the data-* attributes carry explanatory information.
[0112] The client's parsing component receives the content and renders it into the div container of the content receiving and rendering component.
[0113] S2: Markup initialization and rendering.
[0114] Once the parsing component is triggered, it calls the initialization function, passing in parameters such as the tag type, color, and display container to be processed. The parsing component first clears all old tags within the container, then loads the text content from the SVG file. Next, it calls the dynamic coloring and scaling component.
[0115] S3: Text fragment alignment and markup creation.
[0116] First, find all the items that need to be circled. Element. For each The `` element is used to retrieve a list of DOM rectangles representing its position across all rows on the screen. This list is then iterated through. For each rectangle, its relative left (`relativeLeft`) and relative top (`relativeTop`) coordinates relative to its parent container are calculated. A style template creation method is called, which uses `border-image` to apply the dynamically colored SVG as a stretchable border, creating a `` element as a marker. Finally, the created marker `` element is appended to the parent container to complete the overlay rendering.
[0117] S4: Interaction triggering and pop-up state update.
[0118] The user clicks on the highlighted text. Because the event is bound to the parent container, the click event is triggered, and the event handler checks that the click occurred inside the visibility symbol. The handler calls the rectangle corresponding to the visibility symbol to get the paragraph's position and intelligently determines whether the pop-up should appear above or below it. Then, it reads the explanatory text (i.e., the interaction information) from the span element's data properties. Finally, it updates the calculated position and explanatory text in the state of the global state management component and sets its visibility to true.
[0119] S5: Pop-up rendering and display.
[0120] Because the state of the global state management component changes, the interpreter pop-up rendering component that subscribes to this context automatically re-renders. The interpreter pop-up rendering component obtains the latest position, pop-up content, visibility state, and other information. Then, based on this information, it positions itself to the precise location on the screen and renders the pop-up content.
[0121] S6: Interaction ends.
[0122] When the user taps another part of the screen, the function to close the pop-up is triggered, and the pop-up disappears. This completes one interaction loop.
[0123] In this embodiment, step S201 is implemented in the same way as in this disclosure. Figure 2 The implementation of step S101 in the illustrated embodiment is the same, and will not be described in detail here.
[0124] Corresponding to the information display method in the above embodiments, Figure 11 This is a structural block diagram of an information display device provided in an embodiment of this disclosure. The method described in the above embodiments can be executed by this information display device, which can be implemented by software and / or hardware, and can be integrated into an electronic device with certain data processing capabilities. The electronic device may include, but is not limited to, mobile terminals with big data processing capabilities, as well as fixed terminals with big data processing capabilities such as desktop computers and supercomputers.
[0125] For ease of explanation, only the parts relevant to embodiments of this disclosure are shown. (Refer to...) Figure 11 The information display device 3 includes:
[0126] The acquisition module 31 is used to acquire the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and the sentiment tag corresponding to the first rich text fragment.
[0127] The processing module 32 is used to display the first rich text in the dialogue interface, and to overlay the corresponding visual symbol at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and the emotion marker.
[0128] In one possible implementation, the processing module 32 is further configured to: display interactive information in response to a first operation, wherein the first operation is directed to a visual symbol and the interactive information is used to characterize an emotional description of a first rich text fragment.
[0129] In one possible implementation, when the processing module 32 displays interactive information in response to the first operation, it is specifically used for:
[0130] In response to clicking on a visual symbol, an interactive event is triggered; based on the interactive event, metadata of the emotion tag is obtained, and interactive information generated based on the metadata is presented in the display container.
[0131] In one possible implementation, the processing module 32 is further configured to: obtain the background theme color of the dialog interface; and obtain the appearance of the visual symbols based on the background theme color.
[0132] In one possible implementation, when the processing module 32 overlays the corresponding visual symbol at the location of the first rich text fragment, it is specifically used to: obtain the first coordinate corresponding to the first rich text fragment, the first coordinate representing the relative position of the visual symbol in the display container, the display container being used to display the content of the first rich text; and generate a visual symbol corresponding to the sentiment marker in the display container based on the first coordinate.
[0133] In one possible implementation, when the processing module 32 overlays and displays the corresponding visual symbols, it is specifically used to: obtain the graphic template corresponding to the emotion mark; scale the graphic template horizontally to obtain the visual symbol; and overlay the visual symbol onto the first coordinate position in the display container for display.
[0134] In one possible implementation, the first coordinate includes at least two sub-coordinates, and the first rich text fragment corresponds to at least two cross-line text regions. When the processing module 32 obtains the first coordinate corresponding to the first rich text fragment, it is specifically used to: obtain the sub-coordinates of the cross-line text regions in the display container; merge the sub-coordinates of all cross-line text regions to generate the first coordinate.
[0135] In one possible implementation, when processing module 32 horizontally scales the graphic template to obtain a visual symbol, it specifically performs the following steps: obtaining a width parameter, which is determined based on the first language corresponding to the first dialogue content; and horizontally scaling the graphic template according to the width parameter to obtain the visual symbol.
[0136] The acquisition module 31 and the processing module 32 are connected. The information display device 3 provided in this embodiment can execute the technical solution of the above method embodiment, and its implementation principle and technical effect are similar, so it will not be described again here.
[0137] Figure 12 This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present disclosure, such as... Figure 12 As shown, the electronic device 4 includes:
[0138] Processor 41, and memory 42 communicatively connected to processor 41;
[0139] Memory 42 stores instructions executed by the computer;
[0140] The processor 41 executes computer execution instructions stored in the memory 42 to achieve, for example, Figures 2-10 The information display method in the illustrated embodiment.
[0141] Optionally, the processor 41 and the memory 42 are connected via a bus 43.
[0142] For relevant instructions, please refer to the corresponding text. Figures 2-10 The relevant descriptions and effects of the steps in the corresponding embodiments are understood, and will not be elaborated on here.
[0143] This disclosure provides a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, are used to implement this disclosure. Figures 2-10 The information display method provided in any of the corresponding embodiments.
[0144] This disclosure provides a computer program product, including a computer program, which, when executed by a processor, implements this disclosure. Figures 2-10 The information display method provided in any of the corresponding embodiments.
[0145] To implement the above embodiments, this disclosure also provides an electronic device.
[0146] refer to Figure 13 The diagram illustrates a structural schematic of an electronic device 900 suitable for implementing embodiments of the present disclosure. The electronic device 900 can be a terminal device or a server. The terminal device can include, but is not limited to, mobile terminals such as mobile phones, laptops, digital broadcast receivers, personal digital assistants (PDAs), tablet computers, portable media players (PMPs), and in-vehicle terminals (e.g., in-vehicle navigation terminals), as well as fixed terminals such as digital TVs and desktop computers. Figure 13 The electronic device shown is merely an example and should not be construed as limiting the functionality and scope of the embodiments disclosed herein.
[0147] like Figure 13 As shown, the electronic device 900 may include a processing unit (e.g., a central processing unit, a graphics processing unit, etc.) 901, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 902 or a program loaded from a storage device 908 into a random access memory (RAM) 903. The RAM 903 also stores various programs and data required for the operation of the electronic device 900. The processing unit 901, ROM 902, and RAM 903 are interconnected via a bus 904. An input / output (I / O) interface 905 is also connected to the bus 904.
[0148] Typically, the following devices can be connected to I / O interface 905: input devices 906 including, for example, touchscreens, touchpads, keyboards, mice, cameras, microphones, accelerometers, gyroscopes, etc.; output devices 907 including, for example, liquid crystal displays (LCDs), speakers, vibrators, etc.; storage devices 908 including, for example, magnetic tapes, hard disks, etc.; and communication devices 909. Communication device 909 allows electronic device 900 to communicate wirelessly or wiredly with other devices to exchange data. Although Figure 13 An electronic device 900 with various devices is shown; however, it should be understood that it is not required to implement or possess all of the devices shown. More or fewer devices may be implemented or possessed alternatively.
[0149] In particular, according to embodiments of this disclosure, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, embodiments of this disclosure include a computer program product comprising a computer program carried on a computer-readable medium, the computer program containing program code for performing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network via a communication device 909, or installed from a storage device 908, or installed from a ROM 902. When the computer program is executed by a processing device 901, it performs the functions defined in the methods of embodiments of this disclosure.
[0150] It should be noted that the computer-readable medium described in this disclosure can be a computer-readable signal medium or a computer-readable storage medium, or any combination thereof. A computer-readable storage medium can be, for example,—but not limited to—an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of a computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination thereof. In this disclosure, a computer-readable storage medium can be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, apparatus, or device. In this disclosure, a computer-readable signal medium can include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code. Such propagated data signals can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium can be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in connection with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any suitable medium, including but not limited to: wires, optical fibers, RF (radio frequency), etc., or any suitable combination thereof.
[0151] The aforementioned computer-readable medium may be included in the aforementioned electronic device; or it may exist independently and not assembled into the electronic device.
[0152] The aforementioned computer-readable medium carries one or more programs, which, when executed by the electronic device, cause the electronic device to perform the methods shown in the above embodiments.
[0153] Computer program code for performing the operations of this disclosure can be written in one or more programming languages or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, and C++, and conventional procedural programming languages such as "C" or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone 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 remote computers, the remote computer can be connected to the user's computer via any type of network—including a Local Area Network (LAN) or a Wide Area Network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0154] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions indicated in the blocks may occur in a different order than those indicated in the drawings. For example, two consecutively indicated blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or operation, or using a combination of dedicated hardware and computer instructions.
[0155] The units or modules described in the embodiments of this disclosure can be implemented in software or hardware. The names of the units or modules do not necessarily limit the specific unit itself.
[0156] The functions described above in this document can be performed at least in part by one or more hardware logic components. For example, exemplary types of hardware logic components that can be used, without limitation, include: field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), system-on-a-chip (SoCs), complex programmable logic devices (CPLDs), and so on.
[0157] In the context of this disclosure, a machine-readable medium can be a tangible medium that may contain or store a program for use by or in conjunction with an instruction execution system, apparatus, or device. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can be, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.
[0158] Firstly, in one possible implementation, an information display method is provided, including:
[0159] Obtain the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and a corresponding sentiment marker. Display the first rich text in the dialogue interface and overlay the corresponding visual symbol at the location of the first rich text fragment. The appearance of the visual symbol is determined based on the content of the first dialogue and the sentiment marker.
[0160] In one possible implementation, the method further includes: displaying interactive information in response to a first operation, wherein the first operation is directed to a visual symbol, and the interactive information is used to characterize a sentiment description for a first rich text fragment.
[0161] In one possible implementation, a corresponding visual symbol is overlaid at the location of the first rich text fragment, including: generating a document object model based on the first rich text and obtaining a document object model node containing a sentiment marker; obtaining a first coordinate based on the geometric information of the document object model node, the first coordinate representing the relative position of the visual symbol in a display container, the display container being used to display the content of the first rich text; and generating a visual symbol corresponding to the sentiment marker in the display container according to the first coordinate.
[0162] In one possible implementation, obtaining the first coordinates based on the geometric information of the document object model node includes: obtaining the first absolute position of the document object model node in the screen coordinate system based on the geometric information; obtaining the second absolute position of the display container in the screen coordinate system; and obtaining the first coordinates based on the difference between the first absolute position and the second absolute position.
[0163] In one possible implementation, the first coordinate includes at least two sub-coordinates; obtaining the first coordinate based on the geometric information of the document object model node includes: obtaining a set of cross-line text regions of the document object model node; calculating the sub-coordinates of each cross-line text region in the display container; and merging the sub-coordinates of all cross-line text regions to generate the first coordinate.
[0164] In one possible implementation, a visual symbol corresponding to the sentiment marker is generated in the display container based on the first coordinate, including: loading a graphic template corresponding to the sentiment marker; scaling the graphic template horizontally according to the width of the first rich text fragment to obtain the visual symbol; and overlaying the visual symbol onto the first coordinate in the display container for display.
[0165] In one possible implementation, the graphic template is horizontally scaled according to the width of the first rich text fragment to obtain a visual symbol, including: identifying the first language corresponding to the first dialogue content based on a language detection model; obtaining the width parameter of the first rich text fragment according to the first language, the width parameter being used for width compensation for characters in the first language; and horizontally scaling the graphic template according to the width parameter to obtain the visual symbol.
[0166] One possible implementation also includes: parsing the graphic template into a document object model object; obtaining the background theme color; and dynamically adjusting the first property of the object model object based on the background theme color so that the color of the visual symbol matches the background theme color.
[0167] In one possible implementation, before generating the visual symbol corresponding to the emotion marker in the display container according to the first coordinate, the method further includes: obtaining initialization parameters, which characterize the first display container and the appearance of the visual symbol; clearing existing symbol elements in the first display container based on the initialization parameters; and generating the visual symbol corresponding to the emotion marker in the display container according to the first coordinate, which includes: generating the visual symbol corresponding to the emotion marker in the first display container according to the first coordinate and the appearance of the visual symbol.
[0168] In one possible implementation, in response to a first action, interactive information is displayed, including: in response to clicking a visual symbol, triggering an interactive event; based on the interactive event, obtaining metadata of the sentiment marker; and presenting the interactive information generated based on the metadata in a display container.
[0169] Secondly, in one possible implementation, an information display device is provided, comprising:
[0170] The acquisition module is used to acquire the first rich text, which represents the content of the first dialogue. The first rich text includes the first rich text fragment and the sentiment tag corresponding to the first rich text fragment.
[0171] The processing module is used to display the first rich text in the dialogue interface, and to overlay the corresponding visual symbol at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and sentiment marker.
[0172] In one possible implementation, the processing module is further configured to: display interactive information in response to a first operation, wherein the first operation is directed to a visual symbol and the interactive information is used to characterize a sentiment description for a first rich text fragment.
[0173] In one possible implementation, when the processing module overlays the corresponding visual symbol at the location of the first rich text fragment, it specifically performs the following steps: based on the first rich text, it generates a document object model and obtains a document object model node containing a sentiment marker; based on the geometric information of the document object model node, it obtains a first coordinate, which represents the relative position of the visual symbol in the display container, which is used to display the content of the first rich text; and based on the first coordinate, it generates a visual symbol corresponding to the sentiment marker in the display container.
[0174] In one possible implementation, when the processing module obtains the first coordinates based on the geometric information of the document object model node, it specifically performs the following steps: obtaining the first absolute position of the document object model node in the screen coordinate system based on the geometric information; obtaining the second absolute position of the display container in the screen coordinate system; and obtaining the first coordinates based on the difference between the first absolute position and the second absolute position.
[0175] In one possible implementation, the first coordinate includes at least two sub-coordinates; when the processing module obtains the first coordinate based on the geometric information of the document object model node, it is specifically used to: obtain a set of cross-line text regions of the document object model node; calculate the sub-coordinates of each cross-line text region in the display container; and merge the sub-coordinates of all cross-line text regions to generate the first coordinate.
[0176] In one possible implementation, when the processing module generates a visual symbol corresponding to the sentiment marker in the display container based on the first coordinate, it specifically performs the following steps: loading a graphic template corresponding to the sentiment marker; scaling the graphic template horizontally according to the width of the first rich text fragment to obtain the visual symbol; and overlaying the visual symbol onto the first coordinate in the display container for display.
[0177] In one possible implementation, when the processing module horizontally scales the graphic template based on the width of the first rich text fragment to obtain the visual symbol, it specifically performs the following: identifies the first language corresponding to the first dialogue content based on a language detection model; obtains the width parameter of the first rich text fragment based on the first language, and the width parameter is used to perform width compensation for the characters in the first language; and horizontally scales the graphic template based on the width parameter to obtain the visual symbol.
[0178] In one possible implementation, the processing module is further configured to: parse the graphic template into a document object model object; obtain the background theme color; and dynamically adjust the first property of the object model object based on the background theme color so that the color of the visual symbol matches the background theme color.
[0179] In one possible implementation, before generating the visual symbol corresponding to the emotion marker in the display container based on the first coordinate, the processing module is further configured to: obtain initialization parameters, which characterize the appearance of the first display container and the visual symbol; and clear existing symbol elements in the first display container based on the initialization parameters. When generating the visual symbol corresponding to the emotion marker in the display container based on the first coordinate, the processing module is specifically configured to: generate the visual symbol corresponding to the emotion marker in the first display container based on the first coordinate and the appearance of the visual symbol.
[0180] In one possible implementation, when the processing module displays interactive information in response to the first operation, it is specifically used to: trigger an interactive event in response to clicking a visual symbol; obtain metadata of the emotion tag based on the interactive event; and present the interactive information generated based on the metadata in a display container.
[0181] Thirdly, in one possible implementation, an electronic device is provided, comprising: at least one processor and a memory;
[0182] The memory stores the instructions that the computer executes;
[0183] At least one processor executes computer execution instructions stored in memory, causing at least one processor to perform the information display method as described in the first aspect above and various possible designs of the first aspect.
[0184] Fourthly, in one possible implementation, a computer-readable storage medium is provided, which stores computer-executable instructions that, when executed by a processor, implement the information display method described in the first aspect and various possible designs of the first aspect.
[0185] Fifthly, in one possible implementation, a computer program product is provided, comprising a computer program that, when executed by a processor, implements the information display method described in the first aspect above and various possible designs of the first aspect.
[0186] The above description is merely a preferred embodiment of this disclosure and an explanation of the technical principles employed. Those skilled in the art should understand that the scope of this disclosure is not limited to technical solutions formed by specific combinations of the above-described technical features, but should also cover other technical solutions formed by arbitrary combinations of the above-described technical features or their equivalents without departing from the above-described concept. For example, technical solutions formed by substituting the above features with (but not limited to) technical features disclosed in this disclosure that have similar functions.
[0187] Furthermore, while the operations are described in a specific order, this should not be construed as requiring these operations to be performed in the specific order shown or in a sequential order. In certain environments, multitasking and parallel processing may be advantageous. Similarly, while several specific implementation details are included in the above discussion, these should not be construed as limiting the scope of this disclosure. Certain features described in the context of individual embodiments may also be implemented in combination in a single embodiment. Conversely, various features described in the context of a single embodiment may also be implemented individually or in any suitable sub-combination in multiple embodiments.
[0188] Although the subject matter has been described using language specific to structural features and / or methodological logic, 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. Rather, the specific features and actions described above are merely illustrative examples of implementing the claims.
Claims
1. An information display method, comprising: Obtain the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and a sentiment tag corresponding to the first rich text fragment. The first rich text is displayed in the dialogue interface, and a corresponding visual symbol is overlaid at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and the emotion marker.
2. The method according to claim 1, further comprising: In response to a first operation, interactive information is displayed, wherein the first operation is directed to the visual symbol, and the interactive information is used to characterize a sentiment description for the first rich text fragment.
3. The method according to claim 2, wherein displaying interactive information in response to the first operation includes: In response to clicking the visual symbol, an interactive event is triggered; Based on the interaction event, the metadata of the emotion tag is obtained, and the interactive information generated based on the metadata is presented in the display container.
4. The method according to claim 1, further comprising: Obtain the background theme color of the dialog interface; The appearance of the visual symbol is obtained based on the background theme color.
5. The method according to claim 1, wherein overlaying and displaying the corresponding visual symbol at the location of the first rich text fragment includes: Obtain the first coordinates corresponding to the first rich text fragment, where the first coordinates represent the relative position of the visualization symbol in the display container, and the display container is used to display the content of the first rich text; Based on the first coordinates, a visual symbol corresponding to the emotion marker is generated in the display container.
6. The method according to claim 5, wherein the overlay display of the corresponding visual symbol comprises: Obtain the graphic template corresponding to the emotion marker; The graphic template is horizontally scaled to obtain the visual symbol; The visual symbol is overlaid onto the first coordinate in the display container for display.
7. The method according to claim 6, wherein horizontal scaling of the graphic template to obtain the visual symbol comprises: Obtain the width parameter, which is determined based on the first language corresponding to the first dialogue content; The graphic template is horizontally scaled according to the width parameter to obtain the visual symbol.
8. The method according to claim 5, wherein the first coordinate includes at least two sub-coordinates; the first rich text fragment corresponds to at least two cross-line text regions, and obtaining the first coordinate corresponding to the first rich text fragment includes: Obtain the sub-coordinates of the multi-line text region within the display container; Merge the sub-coordinates of all multi-line text regions to generate the first coordinate.
9. An information display device, comprising: The acquisition module is used to acquire the first rich text, which represents the content of the first dialogue. The first rich text includes a first rich text fragment and a sentiment tag corresponding to the first rich text fragment. The processing module is used to display the first rich text in the dialogue interface, and to overlay a corresponding visual symbol at the location of the first rich text fragment, wherein the appearance of the visual symbol is determined based on the first dialogue content and the emotion marker.
10. An electronic device, comprising: Processor and memory; The memory stores computer-executed instructions; The processor executes computer execution instructions stored in the memory, causing the processor to perform the information display method as described in any one of claims 1 to 8.
11. A computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, implement the information display method as described in any one of claims 1 to 8.
12. A computer program product comprising a computer program that, when executed by a processor, implements the information display method as described in any one of claims 1 to 8.