User track drawing method and device, computer equipment and storage medium

Abstract

The invention relates to a user track drawing method and device, computer equipment and a storage medium. The method comprises the steps that event distribution is processed through JavaScript, a full-level track is drawn on canvas through Canvas, and the full-level track comprises a plurality of level nodes and full-level track arcs used for connecting the level nodes; calculating a node coordinate of a user node according to the user growth value, and calculating a user track radian according to the starting point coordinate of the full-level track arc and the node coordinate of the user node; and according to the radian of the user track, drawing a dynamic user track in combination with a request Animation Frame function of the JavaScript. According to the embodiment of the invention, a complex and changeable animation effect can be realized by utilizing Javascript event distribution and Canvas2D drawing technologies.

Description

technical field [0001] The present application relates to the field of computers, in particular to a user trajectory drawing method, device, computer equipment and storage medium. Background technique [0002] At present, the event distribution is handled by the canvas, and the events of the drawn content need to be processed by itself, that is, the canvas does not provide a method for adding event monitoring to its internal elements. For example, to enable the elements in the Canvas to respond to events, you need to get the coordinates of the clicked element Scope monitors and makes changes to its internal elements, and because the drawing of Canvas is static, it cannot achieve cyclic redrawing. The above reasons make it impossible to draw complex and changeable animations using canvas, such as custom curves, irregular polygons such as circles Corner rectangle, and thus can not meet the needs of users. Contents of the invention [0003] Aiming at the above-mentioned defi...

AI Technical Summary

Problems solved by technology

[0002] At present, the event distribution is handled by the canvas, and the events of the drawn content need to be processed by itself, that is, the canvas does not provide a method for adding event monitoring to its internal elements. For example, to enable the elements in the Canvas to respond to events, you need to get the coordinates of the clicked element Scope monitors and makes changes to its internal elements, and because the drawing of Canvas is static, it cannot achieve cyclic redrawing. The above reasons make it impossible to draw complex and changeable animations using canvas, such as custom curves, irregular polygons such as circles Corner rectangle, which cannot meet user needs

Images