Tag：canvas
-
Wind Field Visualization: Drawing Particles
Primer learnWind field dataAfter that, move on to how to draw particles. source:webgl-wind Origin My GitHub draw map particles Looking at the source library, I found that there is a single Canvas to draw the map, and the obtained world map coastline coordinates, the main format is as follows: { “type”: “FeatureCollection”, “features”: [ { […]
-
Talk about the Canvas event mechanism (non-API layer, partial framework design)
The following analysis usesSigmajsThe source code of the framework is analyzed, and interested students can check it out. This article mainly introduces the event mechanism of Canvas and some design ideas. Graphic events, design ideas and implementation introduction. Graphics events need to support the following: Support various event types event trigger mechanism event collision problem […]
-
Flutter ChartSpace: Implementing a chart library through cross-end Canvas
Based on the Flutter-based graphic grammar library, the Javascript-based graphic grammar library ChartSpace is extended to the Flutter side through the cross-end Canvas Author: Bytedance Terminal Technology – Hooper background The data platform has a graph library based on the grammar of graphicsChartSpace, support web/h5/mini program, now received business demands, to support to the Flutter […]
-
Begin to understand native webGL from a mouse drawing point
WebGL tutorials for the web front-end, the tutorials on the Internet are all based on the assumption of computer graphics, which is not very friendly to web developers, so this pit is opened final effect https://codepen.io/chendonmin… Mouse click draws a point. How webGL displays a point First of all, you need to know how webGL […]
-
Wind Field Visualization: Plotting Trajectories
Primer learndraw particlesAfter that, move on to how to draw particle trajectories. source:webgl-wind Origin My GitHub draw track It is mentioned in the original post that the way to draw the trail is to draw the particles into a texture, then use that texture as a background (slightly darkened) on the next frame, and swap […]
-
Comparison between WebGL and WebGPU [8] – Summary and thoughts at the end of the series
Postscript to the end of the series Lin Lin always wrote some articles to compare the conventional functions of WebGL and WebGPU. Maybe he is a bit amateurish in understanding the API, and even does not rule out that there are mistakes in the expression, but I hope that the correct part will inspire readers […]
-
Comparison of WebGL and WebGPU [7] – the destination of rendering
1. Overview In fact, the comparison of the basic conventional APIs in the sixth article is almost finished (except for GPGPU and query APIs that are not involved), but there is one detail that is still worth thinking about and recording in a comparison article. is where to render. The context object of WebGL is […]
-
[live streaming] CG&WebGL&Threejs knowledge and learning thinking sharing.
For a transcript transcript of a live share (It is recommended to watch the video), Video cloud disk linkThe whole article is mainly divided into several directions: Computer Graphics related WebGL related Threejs related Q&A not recorded yet Note that there may be slight differences between the following content and the live content. Computer Graphics […]
-
Wind Field Visualization: Random Reset
Primer existdraw trackIn the effect, after a period of time, you will find that there are only a few fixed tracks left in the end.originalThis phenomenon is also mentioned in , and a solution is also provided. Personally, I still want to take a look at the source code. source:webgl-wind Origin My GitHub reason Over […]
-
How to simulate a laser pointer with a mobile phone
introduction Have you noticed that in recent years we have seen less and less speeches where speakers use laser pointers to indicate to the audience what they are talking about. Let me talk about the laser pointer first. The working principle of the laser pointer is to emit a beam of laser light, shine it […]
-
JavaScript WebGL Matrix
Primer I thought I could start trying 3D effects, but after checking the information, I found that I need to understand the matrix first. Collect the relevant basic knowledge points here. Origin My GitHub Introduction Simply put, a matrix is a rectangular arrangement of numbers in rows and columns. Generally describe the row first and […]
-
Canvas table interaction you don’t know
background S2 is AntV’s solution in the field of multi-dimensional cross analysis tables, mainly used for data analysis, S2 adoptscanvasfor table drawing (based on an easy-to-use, efficient, and powerful 2D visual rendering engineG) , and a large number of built-ininteractive abilityTo assist users to see the number, such asRow and column linkage highlighting Single/Multiple Selection […]