blocks/shapes/polygons.yaml at gh-pages · tangrams/blocks · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
# Patricio Gonzalez Vivo - 2015
# From Chapter about Shapes at http://thebookofshaders.com/07/

import:
    - ../block.yaml
    - type.yaml

styles:
    shapes-polygons:
        doc:
            description: |
                Collection of functions to draw polygons. To learn more about how to make shapes on shaders go to From check [this chapter about shapes from the Book of Shaders](https://thebookofshaders.com/07/)
            examples:
                9845C:
                    url: https://tangrams.github.io/tangram-sandbox/styles/9845C.yaml
                    img: https://tangrams.github.io/tangram-sandbox/styles/9845C.png
                    lines: 153
        test:
            shapeDF: { blocks: { color: "    color.rgb += shapeDF(v_texcoord.xy,5);" } }
            shape: { blocks: { color: "    color.rgb += shape(v_texcoord.xy,5,.5);" } }
            shapeBorder: { blocks: { color: "    color.rgb += shapeBorder(v_texcoord.xy,5,.5);" } }
        mix: [block, shapes-type]
        shaders:
            blocks:
                global: |
                    // get distance field of a polygon in the center
                    // where N is the number of sides of it
                    // ================================
                    float shapeDF (vec2 st, int N) {
                        st = st *2.-1.;
                        float a = atan(st.x,st.y)+PI;
                        float r = TWO_PI/float(N);
                        return cos(floor(.5+a/r)*r-a)*length(st);
                    }

                    // draw a polygon in the center
                    // where N is the number of sides of it
                    // ================================
                    float shape (vec2 st, int N, float width) {
                        return fill(width, shapeDF(st,N));
                    }

                    // draw a polygon border in the center
                    // where N is the number of sides of it
                    // ================================
                    float shapeBorder (vec2 st, int N, float width) {
                        return stroke(width, shapeDF(st,N));
                    }