Method for drawing curves in graphics and related equipment
By determining the curve equation and discrete it into line segments and triangles, the problem that the graph drawing tool cannot draw curves is solved, and effective drawing of curves is achieved.
Patent Information
- Application Number
- CN202210253955.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-03-15
- Publication Date
- 2025-05-13
- Estimated Expiration
- 2042-03-15
AI Technical Summary
Existing graphics drawing tools cannot directly draw complex graphics units such as curves.
By determining the equation of the curve, discrete it into line segments and process it into multiple triangles, the curve is drawn using the WebGL drawing tool.
It implements the conversion of complex curves into graphic units that can be drawn by the graphics drawing tool, solving the problem that curves cannot be drawn directly.
Smart Images

Figure CN114782582B_ABST
Abstract
Description
Technical Field
[0001] The present disclosure relates to the field of computer technology, and in particular to a method for drawing a curve in a graph and related equipment. Background Art
[0002] In the field of computer technology, there are various graphics drawing tools. However, some graphics drawing tools can only draw graphics based on simple graphic units (such as points, line segments, triangles, etc.), but cannot draw more complex graphic units (such as curves). Summary of the invention
[0003] The present disclosure provides a method for drawing a curve in a graph and a related device to solve or partially solve the above-mentioned problem.
[0004] In a first aspect of the present disclosure, a method for drawing a curve in a graph is provided, comprising:
[0005] Determine the equation of the curve according to the curve type and key point information of the curve in the graph;
[0006] According to the first discretization interval, combined with the equation of the curve, at least two line segments are obtained;
[0007] Processing the at least two line segments to obtain a plurality of triangles; and
[0008] The curve is drawn based on the plurality of triangles.
[0009] In a second aspect of the present disclosure, a device for drawing a curve in a graph is provided, comprising:
[0010] A determination module is configured to: determine the equation of the curve according to the curve type and key point information of the curve in the graph;
[0011] A processing module is configured to: obtain at least two line segments according to the first discretization interval and in combination with the equation of the curve; and process the at least two line segments to obtain a plurality of triangles; and
[0012] The drawing module is configured to draw the curve based on the multiple triangles.
[0013] In a third aspect of the present disclosure, a computer device is provided, comprising one or more processors, a memory; and one or more programs, wherein the one or more programs are stored in the memory and executed by the one or more processors, and the programs include instructions for executing the method described in the first aspect.
[0014] According to a fourth aspect of the present disclosure, a non-volatile computer-readable storage medium containing a computer program is provided. When the computer program is executed by one or more processors, the processors execute the method described in the first aspect.
[0015] In a fifth aspect of the present disclosure, a computer program product is provided, comprising computer program instructions, which, when executed on a computer, cause the computer to execute the method described in the first aspect.
[0016] The method and related equipment for drawing curves in graphics provided by the present disclosure can process the curves in the graphic file into graphic units that can be drawn by a graphic drawing tool, and then provide them to the graphic drawing tool for drawing, thereby solving the problem that the curves cannot be drawn by the graphic drawing tool. BRIEF DESCRIPTION OF THE DRAWINGS
[0017] In order to more clearly illustrate the technical solutions in the present disclosure or related technologies, the drawings required for use in the embodiments or related technical descriptions are briefly introduced below. Obviously, the drawings described below are only embodiments of the present disclosure. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.
[0018] Figure 1 A schematic diagram of the hardware structure of an exemplary computer device provided in an embodiment of the present disclosure is shown.
[0019] Figure 2A A schematic diagram showing an exemplary curve according to an embodiment of the present disclosure is shown.
[0020] Figure 2B A schematic diagram of an exemplary discretized line segment according to an embodiment of the present disclosure is shown.
[0021] Figure 2C A schematic diagram showing an exemplary line segment processing process according to an embodiment of the present disclosure is shown.
[0022] Figure 2D A schematic diagram showing an exemplary line segment expanding into a rectangle according to an embodiment of the present disclosure is shown.
[0023] Figure 2E A schematic diagram of filling an exemplary gap according to an embodiment of the present disclosure is shown.
[0024] Figure 2F A schematic diagram showing exemplary end smoothing according to an embodiment of the present disclosure is shown.
[0025] Figure 3 A flowchart of an exemplary method provided by an embodiment of the present disclosure is shown.
[0026] Figure 4 A schematic diagram of an exemplary device provided by an embodiment of the present disclosure is shown. DETAILED DESCRIPTION
[0027] In order to make the objectives, technical solutions and advantages of the present disclosure more clearly understood, the present disclosure is further described in detail below in combination with specific embodiments and with reference to the accompanying drawings.
[0028] It should be noted that, unless otherwise defined, the technical terms or scientific terms used in the embodiments of the present disclosure should be understood by people with ordinary skills in the field to which the present disclosure belongs. The "first", "second" and similar words used in the embodiments of the present disclosure do not indicate any order, quantity or importance, but are only used to distinguish different components. "Including" or "comprising" and similar words mean that the elements or objects appearing before the word cover the elements or objects listed after the word and their equivalents, without excluding other elements or objects. "Connect" or "connected" and similar words are not limited to physical or mechanical connections, but can include electrical connections, whether direct or indirect. "Up", "down", "left", "right" and the like are only used to indicate relative positional relationships. When the absolute position of the described object changes, the relative positional relationship may also change accordingly.
[0029] Figure 1 FIG. 1 is a schematic diagram of the hardware structure of an exemplary computer device 100 provided in an embodiment of the present disclosure. The computer device 100 can be used to implement the method for drawing a curve in a graph in an embodiment of the present disclosure. Figure 1 As shown, the computer device 100 may include: a processor 102, a memory 104, a network module 106, a peripheral interface 108 and a bus 110. The processor 102, the memory 104, the network module 106 and the peripheral interface 108 are connected to each other in communication within the computer device 100 through the bus 110.
[0030] Processor 102 may be a central processing unit (CPU), an image processor, a neural network processor (NPU), a microcontroller (MCU), a programmable logic device, a digital signal processor (DSP), an application specific integrated circuit (ASIC), or one or more integrated circuits. Processor 102 may be used to perform functions related to the technology described in this disclosure. In some embodiments, processor 102 may also include multiple processors integrated into a single logical component. For example, Figure 1 As shown, the processor 102 may include a plurality of processors 102a, 102b, and 102c.
[0031] The memory 104 may be configured to store data (eg, instructions, computer code, etc.). Figure 1 As shown, the data stored in the memory 104 may include program instructions (e.g., program instructions for implementing the method of drawing a curve in a graph in an embodiment of the present disclosure) and data to be processed (e.g., the memory may store configuration files of other modules, etc.). The processor 102 may also access the program instructions and data stored in the memory 104, and execute the program instructions to operate on the data to be processed. The memory 104 may include a volatile storage device or a non-volatile storage device. In some embodiments, the memory 104 may include a random access memory (RAM), a read-only memory (ROM), an optical disk, a magnetic disk, a hard disk, a solid-state drive (SSD), a flash memory, a memory stick, etc.
[0032] The network interface 106 can be configured to provide the computer device 100 with communication with other external devices via a network. The network can be any wired or wireless network capable of transmitting and receiving data. For example, the network can be a wired network, a local wireless network (e.g., Bluetooth, WiFi, near field communication (NFC)), a cellular network, the Internet, or a combination thereof. It is understood that the type of network is not limited to the above specific examples.
[0033] The peripheral interface 108 may be configured to connect the computer device 100 to one or more peripheral devices to implement information input and output. For example, the peripheral devices may include input devices such as a keyboard, a mouse, a touch pad, a touch screen, a microphone, and various sensors, and output devices such as a display, a speaker, a vibrator, and an indicator light.
[0034] The bus 110 may be configured to transmit information between various components of the computer device 100 (e.g., the processor 102, the memory 104, the network interface 106, and the peripheral interface 108), such as an internal bus (e.g., a processor-memory bus), an external bus (USB port, PCI-E bus), etc.
[0035] It should be noted that, although the architecture of the above-mentioned computer device 100 only shows the processor 102, the memory 104, the network interface 106, the peripheral interface 108 and the bus 110, in the specific implementation process, the architecture of the computer device 100 may also include other components necessary for normal operation. In addition, it can be understood by those skilled in the art that the architecture of the above-mentioned computer device 100 may also only include the components necessary for implementing the embodiments of the present disclosure, and does not necessarily include all the components shown in the figure.
[0036] The computer device 100 can draw graphics based on the graphics file. However, the graphics file may include graphic units that cannot be directly drawn by the graphics drawing tool.
[0037] For example, WebGL is a graphics rendering technology that is usually used to draw 3D or 2D graphics. Generally, the graphics described by a graphics file can be composed of points, lines, and surfaces. In WebGL, points, line segments, and triangles can be directly drawn. However, WebGL cannot directly draw a curve in a graphic.
[0038] In view of this, the computer device 100 can process some graphic units in the graphic file into graphic units that can be drawn by the graphic drawing tool, and then provide them to the graphic drawing tool for drawing. For example, for WebGL, the computer device 100 can process the type and line width of the curve as needed, and decompose the curve into a combination of points, line segments, and triangles, so that it can be drawn by WebGL.
[0039] Figure 2A A schematic diagram of an exemplary curve 200 according to an embodiment of the present disclosure is shown.
[0040] Curve 200 can be any curve. Figure 2A As shown, the curve 200 may be a Bezier curve. In a graphic file (e.g., an SVG file or a JSON file converted from an SVG file), a Bezier curve is described by a starting point (startPoint), an end point (endPoint), a first control point (controlPoint1), and a second control point (controlPoint2). If WebGL is used to draw a Bezier curve, the Bezier curve needs to be processed first.
[0041] Therefore, after receiving the graphic file to be drawn, the computer device 100 can first determine the curve and the corresponding curve type (e.g., circle, ellipse, arc, Bezier curve, etc.) therein, so as to process the curve according to the curve type. For example, in the graphic file, each type of curve can have a corresponding name (e.g., circle, ellipse, arc, Bezier curve, etc.), and the computer device 100 can know the type of curve to be processed by identifying these names in the graphic file.
[0042] Then, the computer device 100 may determine the curve equation corresponding to the curve according to the curve type and key point information.
[0043] For example, if the curve 200 is a Bezier curve, the graphic file may describe the Bezier curve through drawing information such as the starting point (startPoint), the end point (endPoint), the first control point (controlPoint1), and the second control point (controlPoint2). Therefore, after the computer device 100 recognizes the name of the curve and knows the type of the curve, it can further parse the graphic file to know the information of these key points of the Bezier curve, and then determine the corresponding curve equation.
[0044] After obtaining the equation of the curve, the computer device 100 may process the equation of the curve according to the first discretization interval to obtain at least two line segments.
[0045] like Figure 2A As shown, the curve equation can be separated according to the first discretization interval d1, and then a plurality of discrete segmentation points (these discrete segmentation points are data that can form the curve equation) are obtained as the starting point and end point of the line segment. Figure 2A As shown, the first discretization interval d1 can be the spacing d1 in the x-axis direction. That is, the distances between the multiple discrete points obtained in the x-axis direction are equal. It can be understood that the first discretization interval d1 can also be the distance between points, that is, the distances between the multiple discrete points obtained by processing are equal, or the lengths of each line segment obtained by processing are equal. The specific setting method can be set as needed and is not specifically limited here.
[0046] The value of the first discretization interval d1 may be a value input by the user or a default value. The specific value may be set as required and is not specifically limited here.
[0047] Furthermore, based on these discrete segmentation points, the adjacent segmentation points are used as the endpoints of the line segments, and multiple end-to-end connected line segments can be obtained, such as Figure 2B shown.
[0048] Then, the computer device 100 may process these line segments to obtain a plurality of triangles, and further draw the curve 200 based on these triangles.
[0049] Below Figure 2B The first line segment 202 and the second line segment 204 in FIG. 2 are used to describe the process of obtaining a triangle.
[0050] Figure 2C A schematic diagram showing an exemplary line segment processing process according to an embodiment of the present disclosure is shown.
[0051] like Figure 2CAs shown, the computer device 100 may first expand the first line segment 202 and the second line segment 204 into a first rectangle 2022 and a second rectangle 2042 .
[0052] In some embodiments, Figure 2C As shown, the computer device 100 can expand the first line segment 202 and the second line segment 204 along the line width direction of the line segment to obtain the first rectangle 2022 and the second rectangle 2042. Figure 2C As shown, the expansion method can be to expand to both sides with the line segment as the center line, and the expansion widths on both sides can be equal, for example, both are w / 2. It can be understood that the value of the line width w can be arbitrary, and the value can be different according to different actual needs, and there is no limitation here.
[0053] After the first rectangle 2022 and the second rectangle 2042 are expanded, the computer device 100 may perform triangulation processing on the first rectangle 2022 and the second rectangle 2042, for example, splitting the first rectangle 2022 and the second rectangle 2042 into two first triangles 206, such as Figure 2D In some embodiments, Figure 2D As shown, the rectangle can be split into two triangles along the diagonal line of the rectangle. It can be understood that after the rectangle is obtained by expanding the line segment, the coordinates of the four vertices of the rectangle can be obtained based on the coordinates of the starting point and the end point of the line segment and the line width. In this way, when splitting the triangle, the vertex coordinates of these triangles can also be obtained accordingly.
[0054] In this way, through the above method, Figure 2B All line segments corresponding to the curve shown in the figure are split into triangles, and then the curve 200 can be drawn based on the split triangles. For example, if WebGL is used to draw the curve, the triangles can be drawn based on the vertex coordinates of these triangles using a shader to complete the curve drawing.
[0055] It can be seen that when there is a non-180° angle between adjacent line segments, there will be a gap between the two generated rectangles (the connecting part). For example, Figure 2C The gap 208. If the gap is not processed, the line segments in the final drawn curve will not be smooth enough.
[0056] Therefore, the computer device 100 may also perform a smoothing process on the gap. For example, in some embodiments, the computer device 100 may generate at least one second triangle that fills the gap 208 formed by the connection between the first rectangle 2022 and the second rectangle 2042 .
[0057] Figure 2EA schematic diagram of filling an exemplary gap according to an embodiment of the present disclosure is shown.
[0058] In some embodiments, Figure 2E As shown, a sector 2082 filling the gap 208 may be formed with the connection point p of the first line segment 202 and the second line segment 204 as the center and half the line width w / 2 of the first rectangle as the radius.
[0059] In this way, because of the coordinates of the center of the sector (coordinates of point p), the radius (w / 2), and the coordinates of the two endpoints of the arc of the sector (respectively a vertex of the first rectangle 2022 and the second rectangle 2042), the computer device 100 can determine the equation of the arc of the sector 2082.
[0060] Then, the computer device 100 obtains at least two first sub-line segments ( Figure 2E 3 first sub-line segments are shown in FIG. 1 ). Next, the computer device 100 uses the first sub-line segment as the base and the radius of the fan 2082 as the side to generate at least two second triangles 2084 ( Figure 2E Three second triangles 2084 are shown in FIG.
[0061] In this way, the gap 208 is filled with the second triangle 2084, thereby smoothing the final drawn curve.
[0062] In order to improve the smoothing effect, in some embodiments, such as Figure 2E As shown, the second discretization interval d2 can be selected as the distance between two points, that is, the lengths of the obtained multiple first sub-line segments are equal. In this way, the shapes of the triangles finally obtained are completely the same, and the corresponding smoothing effect is better.
[0063] In some embodiments, the ends of the drawn curve may be smoothed to optimize the final drawn curve. Therefore, the ends of the line segments located at the head and the tail of the plurality of line segments obtained after the curve 200 is discretized may be smoothed.
[0064] Figure 2F A schematic diagram showing exemplary end smoothing according to an embodiment of the present disclosure is shown.
[0065] like Figure 2F As shown, the first line segment 202 may also be the third line segment 210 because it is located at the head of the curve 200 .
[0066] Similarly, the computer device 100 may also first expand the third line segment 210 into a third rectangle 2102. The expansion method is as described in the above embodiment and will not be described in detail here.
[0067] Then, the computer device can form a semicircle 2104 at the end of the third rectangle 2102 with the line width w of the third rectangle 2102 as the diameter. Similarly, the equation of the arc of the semicircle 2104 can also be determined, and then at least two second sub-line segments ( Figure 2F 6 second sub-line segments are shown in FIG. 1 ). Then, the computer device can generate at least two third triangles 212 ( Figure 2F Six third triangles 212 are shown in FIG.
[0068] Similarly, the third line segment at the tail may also be smoothed in the above manner, which will not be described in detail here.
[0069] In this way, the end portion is smoothed by using the third triangle 212, so that the curve finally drawn is smoothed.
[0070] In order to improve the smoothing effect, in some embodiments, such as Figure 2F As shown, the third discretization interval d3 can also be selected as the distance between two points, that is, the lengths of the obtained multiple second sub-line segments are equal. In this way, the shapes of the triangles finally obtained are completely the same, and the corresponding smoothing effect is better.
[0071] At this point, the curve 200 is decomposed into a plurality of triangles. When WebGL draws the curve based on these triangles, it can draw the curve 200 by using a shader to draw these triangles based on vertex information of these triangles.
[0072] It is understandable that a graphic file may include many curves, and these curves may be processed in the aforementioned manner so that WebGL can complete the curve drawing, which will not be described in detail here.
[0073] As can be seen from the above embodiments, the embodiments of the present disclosure convert the curve into a curve equation, and then divide the curve into multiple discrete points by discretization, connect two adjacent points, expand the line segment according to the line width, perform smooth transition processing on the connection and endpoints, and then triangulate the line segment and the transition part, and finally obtain a series of vertex data applicable to WebGL and draw it by WebGL through the shader program controlled by the shader. For WebGL that does not have the native ability to support strokes, after adopting the solution provided by the embodiments of the present disclosure, it will be possible to draw strokes in WebGL, from scratch, as the basis for drawing various graphics.
[0074] The embodiment of the present disclosure also provides a method for drawing a curve in a graph. Figure 3FIG. 3 is a flow chart of an exemplary method 300 provided by an embodiment of the present disclosure. The method 300 may be Figure 1 The computer device 100 is implemented as follows, and Figure 3 As shown, the method 300 may further include the following steps.
[0075] In step 302, the equation of the curve may be determined according to the curve type and key point information of the curve in the graph.
[0076] In step 304, at least two line segments may be obtained according to the first discretization interval and in combination with the equation of the curve.
[0077] In some embodiments, at least two line segments are obtained according to the first discretization interval in combination with the equation of the curve, including: segmenting the equation of the curve according to the first discretization interval to obtain multiple segmentation points; and using adjacent segmentation points among the multiple segmentation points as endpoints of the line segments to obtain the at least two line segments.
[0078] In step 306, the at least two line segments may be processed to obtain a plurality of triangles.
[0079] In some embodiments, the at least two line segments include a connected first line segment and a second line segment; the at least two line segments are processed to obtain multiple triangles, including: expanding the first line segment and the second line segment into a first rectangle and a second rectangle, respectively; splitting the first rectangle and the second rectangle into two first triangles, respectively; and generating at least one second triangle to fill the gap formed at the connection between the first rectangle and the second rectangle.
[0080] In some embodiments, expanding the first line segment and the second line segment into a first rectangle and a second rectangle respectively includes: expanding the first line segment and the second line segment respectively along the line width direction of the line segment to obtain the first rectangle and the second rectangle.
[0081] In some embodiments, generating at least one second triangle filling the gap formed by the connection between the first rectangle and the second rectangle includes: forming a fan-shaped shape filling the gap with the connection point between the first line segment and the second line segment as the center and half the line width of the first rectangle as the radius; determining the equation of the arc of the fan-shaped shape; obtaining at least two first sub-line segments according to the second discretization interval and the equation of the arc of the fan-shaped shape; and generating at least two second triangles with the first sub-line segment as the base and the radius of the fan-shaped shape as the side. In this way, the smoothing of the gap can be achieved better.
[0082] In some embodiments, the at least two line segments include a third line segment located at the head or tail; the at least two line segments are processed to obtain a plurality of triangles, including: expanding the third line segment into a third rectangle; forming a semicircle at the end of the third rectangle with the line width of the third rectangle as the diameter; determining the equation of the arc of the semicircle; obtaining at least two second sub-line segments according to the third discretization interval and the equation of the arc of the semicircle; and generating at least two third triangles with the second sub-line segment as the base and the radius of the semicircle as the side. In this way, the smoothing of the end of the curve can be achieved better.
[0083] In step 308, the curve may be drawn based on the plurality of triangles.
[0084] In some embodiments, drawing the curve based on the plurality of triangles includes: drawing the curve based on the plurality of triangles using WebGL.
[0085] In some embodiments, drawing the curve based on the plurality of triangles using WebGL includes: determining vertex information of the plurality of triangles; and drawing the plurality of triangles using a shader to draw the curve based on the vertex information of the plurality of triangles.
[0086] It should be noted that the method of the embodiment of the present disclosure can be performed by a single device, such as a computer or a server. The method of the present embodiment can also be applied in a distributed scenario and completed by multiple devices cooperating with each other. In the case of such a distributed scenario, one of the multiple devices can only perform one or more steps in the method of the embodiment of the present disclosure, and the multiple devices will interact with each other to complete the described method.
[0087] It should be noted that the above describes some embodiments of the present disclosure. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the above embodiments and still achieve the desired results. In addition, the processes depicted in the accompanying drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.
[0088] The embodiment of the present disclosure also provides a device for detecting a frame rate. Figure 4 A schematic diagram of an exemplary device 400 provided by an embodiment of the present disclosure is shown. The device 400 may include the following structure.
[0089] The determination module 402 is configured to: determine the equation of the curve according to the curve type and key point information of the curve in the graph;
[0090] The processing module 404 is configured to: obtain at least two line segments according to the first discretization interval and in combination with the equation of the curve; and process the at least two line segments to obtain a plurality of triangles; and
[0091] The drawing module 406 is configured to draw the curve based on the multiple triangles.
[0092] In some embodiments, the processing module 404 is configured to: segment the equation of the curve according to the first discretization interval to obtain multiple segmentation points; and use adjacent segmentation points among the multiple segmentation points as endpoints of line segments to obtain the at least two line segments.
[0093] In some embodiments, the at least two line segments include a connected first line segment and a second line segment; the processing module 404 is configured to: expand the first line segment and the second line segment into a first rectangle and a second rectangle, respectively; split the first rectangle and the second rectangle into two first triangles, respectively; and generate at least one second triangle to fill the gap formed at the connection between the first rectangle and the second rectangle.
[0094] In some embodiments, the processing module 404 is configured to: expand the first line segment and the second line segment along the line width direction of the line segment, respectively, to obtain the first rectangle and the second rectangle.
[0095] In some embodiments, the processing module 404 is configured to: form a sector filling the gap with the connection point of the first line segment and the second line segment as the center and half the line width of the first rectangle as the radius; determine the equation of the arc of the sector; obtain at least two first sub-line segments based on the second discretization interval and the equation of the arc of the sector; and generate at least two second triangles with the first sub-line segment as the base and the radius of the sector as the side.
[0096] In some embodiments, the at least two line segments include a third line segment located at the head or the tail; the processing module 404 is configured to: expand the third line segment into a third rectangle; form a semicircle at the end of the third rectangle with the line width of the third rectangle as the diameter; determine the equation of the arc of the semicircle; obtain at least two second sub-line segments based on the third discretization interval and the equation of the arc of the semicircle; and generate at least two third triangles with the second sub-line segment as the base and the radius of the semicircle as the side.
[0097] In some embodiments, the drawing module 406 is configured to draw the curve based on the multiple triangles using WebGL.
[0098] In some embodiments, the drawing module 406 is configured to: determine vertex information of the plurality of triangles; and based on the vertex information of the plurality of triangles, use a shader to draw the plurality of triangles to draw the curve.
[0099] For the convenience of description, the above device is described by dividing it into various modules according to its functions. Of course, when implementing the present disclosure, the functions of each module can be implemented in the same or multiple software and / or hardware.
[0100] The device of the above embodiment is used to implement the corresponding method 300 in any of the above embodiments, and has the beneficial effects of the corresponding method embodiment, which will not be described in detail here.
[0101] Based on the same inventive concept, corresponding to any of the above-mentioned embodiments and methods, the present disclosure also provides a non-transitory computer-readable storage medium, wherein the non-transitory computer-readable storage medium stores computer instructions, and the computer instructions are used to enable the computer to execute method 300 described in any of the above embodiments.
[0102] The computer-readable medium of this embodiment includes permanent and non-permanent, removable and non-removable media, and information storage can be implemented by any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, read-only compact disk read-only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, magnetic cassettes, magnetic tape magnetic disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device.
[0103] The computer instructions stored in the storage medium of the above embodiment are used to enable the computer to execute the method 300 described in any of the above embodiments, and have the beneficial effects of the corresponding method embodiments, which will not be repeated here.
[0104] Based on the same inventive concept, corresponding to any of the above-mentioned embodiments, the present disclosure further provides a computer program product, which includes a computer program. In some embodiments, the computer program is executable by one or more processors so that the processors execute the described method 300. Corresponding to the execution subject corresponding to each step in each embodiment of the method 300, the processor that executes the corresponding step may belong to the corresponding execution subject.
[0105] The computer program product of the above embodiment is used to enable the processor to execute the method 300 described in any of the above embodiments, and has the beneficial effects of the corresponding method embodiment, which will not be described in detail here.
[0106] Those skilled in the art should understand that the discussion of any of the above embodiments is merely illustrative and is not intended to imply that the scope of the present disclosure (including the claims) is limited to these examples. Based on the concept of the present disclosure, the technical features in the above embodiments or different embodiments may be combined, the steps may be implemented in any order, and there are many other variations of the different aspects of the embodiments of the present disclosure as described above, which are not provided in detail for the sake of simplicity.
[0107] In addition, to simplify the description and discussion, and in order not to make the embodiments of the present disclosure difficult to understand, the known power / ground connections to the integrated circuit (IC) chips and other components may or may not be shown in the provided figures. In addition, the device can be shown in the form of a block diagram to avoid making the embodiments of the present disclosure difficult to understand, and this also takes into account the fact that the details of the implementation of these block diagram devices are highly dependent on the platform on which the embodiments of the present disclosure will be implemented (that is, these details should be fully within the scope of understanding of those skilled in the art). Where specific details (e.g., circuits) are set forth to describe exemplary embodiments of the present disclosure, it is apparent to those skilled in the art that the embodiments of the present disclosure can be implemented without these specific details or with changes in these specific details. Therefore, these descriptions should be considered illustrative rather than restrictive.
[0108] Although the present disclosure has been described in conjunction with specific embodiments of the present disclosure, many replacements, modifications and variations of these embodiments will be apparent to those skilled in the art from the foregoing description. For example, other memory architectures (e.g., dynamic RAM (DRAM)) may use the embodiments discussed.
[0109] The embodiments of the present disclosure are intended to cover all such substitutions, modifications and variations that fall within the broad scope of the appended claims. Therefore, any omissions, modifications, equivalent substitutions, improvements, etc. made within the spirit and principles of the embodiments of the present disclosure should be included in the scope of protection of the present disclosure.
Claims
1. A method for drawing a curve in a graph, comprising: Determine the equation of the curve according to the curve type and key point information of the curve in the graph; According to the first discretization interval, combined with the equation of the curve, at least two line segments are obtained; Processing the at least two line segments to obtain a plurality of triangles; as well as Drawing the curve based on the plurality of triangles; The at least two line segments include a first line segment and a second line segment that are connected; the at least two line segments are processed to obtain a plurality of triangles, including: Expanding the first line segment and the second line segment into a first rectangle and a second rectangle respectively; Splitting the first rectangle and the second rectangle into two first triangles respectively; The step of expanding the first line segment and the second line segment into a first rectangle and a second rectangle respectively includes: The first line segment and the second line segment are expanded respectively along the line width direction of the line segment to obtain the first rectangle and the second rectangle.
2. The method of claim 1, wherein: According to the first discretization interval, combined with the equation of the curve, at least two line segments are obtained, including: Segmenting the equation of the curve according to the first discretization interval to obtain a plurality of segmentation points; and Adjacent segmentation points among the plurality of segmentation points are used as endpoints of line segments to obtain the at least two line segments.
3. The method of claim 1, wherein: Processing the at least two line segments to obtain a plurality of triangles further comprises: At least one second triangle is generated to fill a gap formed by a connection portion between the first rectangle and the second rectangle.
4. The method of claim 3, wherein: Generating at least one second triangle filling a gap formed by a connection portion between the first rectangle and the second rectangle, comprising: Taking the connection point of the first line segment and the second line segment as the center and half the line width of the first rectangle as the radius, a sector is formed to fill the gap; determining an equation of an arc of the sector; According to the second discretization interval, combined with the equation of the arc of the fan, at least two first sub-line segments are obtained; and At least two second triangles are generated with the first sub-line segment as a base and the radius of the fan as a side.
5. The method of claim 1, wherein: The at least two line segments include a third line segment located at the head or the tail; The at least two line segments are processed to obtain a plurality of triangles, including: Expanding the third line segment into a third rectangle; Taking the line width of the third rectangle as the diameter, a semicircle is formed at the end of the third rectangle; determining an equation of the arc of the semicircle; According to the third discretization interval, in combination with the equation of the arc of the semicircle, at least two second sub-line segments are obtained; and At least two third triangles are generated with the second sub-line segment as a base and the radius of the semicircle as a side.
6. The method of claim 1, wherein: Drawing the curve based on the plurality of triangles comprises: The curve is drawn based on the plurality of triangles using WebGL.
7. The method of claim 6, wherein: Drawing the curve based on the plurality of triangles using WebGL, comprising: Determining vertex information of the plurality of triangles; and Based on the vertex information of the plurality of triangles, the plurality of triangles are drawn using a shader to draw the curve.
8. A device for drawing a curve in a graph, comprising: A determination module is configured to: determine the equation of the curve according to the curve type and key point information of the curve in the graph; A processing module is configured to: obtain at least two line segments according to the first discretization interval and in combination with the equation of the curve; and process the at least two line segments to obtain a plurality of triangles; as well as A drawing module, configured to: draw the curve based on the plurality of triangles; The at least two line segments include a first line segment and a second line segment that are connected, and the processing module is further configured to: Expanding the first line segment and the second line segment into a first rectangle and a second rectangle respectively; Splitting the first rectangle and the second rectangle into two first triangles respectively; The step of expanding the first line segment and the second line segment into a first rectangle and a second rectangle respectively includes: The first line segment and the second line segment are expanded respectively along the line width direction of the line segment to obtain the first rectangle and the second rectangle.
9. A computer device comprising one or more processors, a memory; and one or more programs, wherein the one or more programs are stored in the memory and executed by the one or more processors, and the programs include instructions for executing the method according to any one of claims 1 to 7.
10. A non-volatile computer-readable storage medium containing a computer program, which, when executed by one or more processors, causes the processors to perform the method according to any one of claims 1 to 7.
11. A computer program product, comprising computer program instructions, which, when executed on a computer, cause the computer to execute the method according to any one of claims 1 to 7.
Citation Information
Patent Citations
Patched garbage mask border rendering method
CN101894363A
Device based on two-dimensional and three-dimensional integrated vector render engine
CN103606184A