• The first step in developing webgl


    By Aral Roca Crazy technology house Original text: https://aralroca.com/blog/fir… No reprint without permission In this article, we’ll learn what webgl is and how to draw “triangles” by talking to the GPU. Although there are better ways to implement the examples in this article, such as using canvas with 2D context and even CSS, let’s start […]

  • CSS hollowed out triangle style


    preface Dialog box – hollowed out triangle style principle 1) Using pseudo element: before: after 2) : before, border 3) : after, border make small triangle style 4) The small triangle’s white style covers the large triangle’s style, forming a hollow out Triangle hollowed out html <div id=”talkTop”> Cut out triangle on top </div> <div […]

  • Explaining texture rendering of OpenGL es in IOS from zero


    This article mainly introduces how to use OpenGL es to render an image. The content includes: basic concept explanation, how to use glkit to render texture, how to use glsl to render texture. preface OpenGL(Open Graphics Library)It is developed and maintained by the Khronos group, a graphics software and hardware industry association that focuses on […]

  • The number of effective triangles


    Topic address (611. Number of effective triangles) https://leetcode-cn.com/probl… Title Description Given an array containing nonnegative integers, your task is to count the number of triples that can form the three sides of a triangle. Example 1: Input: [2,2,3,4] Output: 3 Explanation: The effective combination is: 2,3,4 (use the first 2) 2,3,4 (use second 2) 2,2,3 […]

  • Making a gear animation with webgl


    Original text: Aral Roca Crazy technology house https://aralroca.com/blog/how… No reprint without permission This article continues with the first step of webgl. In the last article, I described what webgl is and how it works, including: shaders, programs, buffers, how to link data from the CPU to the GPU, and finally how to render triangles. In […]

  • Maximum triangle area shoelace formula & Helen formula


    Given a set containing multiple points, three points are taken to form a triangle, and the area of the largest triangle that can be formed is returned. Example: Input: points = [[0,0], [0,1], [1,0], [0,2], [2,0]] Output: 2 Explanation: These five points are shown in the figure below. The orange triangle is the largest and […]

  • Canvas basic learning


    Section 1: simple creation moveTo(0,0) starting point lineTo(0,0) Final point lineWidth=0 Thickness of connecting wire strokeStyle=”#000″ The color of the line stroke Show the final effect <canvas id=”mx” style=”border: 1px solid #ccc;”></canvas> <script> var a = document.getElementById(‘mx’); a.width = 800 a.height = 800 var cc = a.getContext(‘2d’); cc.moveTo(0, 0) cc.lineTo(200, 700) cc.lineWidth = 10 cc.strokeStyle […]

  • Realization of triangle by CSS


    In a recent project page, there are many triangle icons. Without considering ie compatibility, CSS is used to implement triangles. Record the code. 1. Solid triangle angle, use transparent to realize triangle (1) Set the line width 50px, div width height 0, the effect is as shown in the following figure, there are multiple triangles. […]

  • Collision detection: Triangle


    Introduction stayCollision Detection :PolygonThis paper mainly introduces the polygon related collision detection, and then look at the situation of triangles. Triangles also belong to polygons, so polygon method is applicable to triangles. Here’s another way of thinking. The following examples are not checked for compatibility and are recommended to be viewed in the latest chrome […]

  • Android realizes triangle border of picture


    One can be shown on one side of each imageBorder view of triangleIt’s oursTriangle label view。 This view is more commonly used in e-commerce apps. Students who have used eBay should remember that a triangular border will be displayed in the upper left or right corner of some products to give people an intuitive picture […]

  • CSS draw triangle


    CSS draw triangle Autor: PalappleDate: 2020-03-06tag: Css CSS draw triangle Recently encountered a problem with checking the style of the triangle and the background of the item; Actual project drawings; Composition of border <!DOCTYPE html> <html lang=”en”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <title>Document</title> <style> .span{ width: 100px; height: 100px; border-width: 30px ; border-style: […]

  • Graphic selection – grid selection


    Mesh selection, as the name suggests, is to select a polygon after turning it into a mesh (this method is only applicable to polygons, if it is a curve, we have to segment it). In this way, grid selection is divided into two steps1. Decompose the polygon into multiple triangles.2. Judge whether the mouse point […]