{"id":3325,"date":"2017-09-25T23:02:03","date_gmt":"2017-09-25T21:02:03","guid":{"rendered":"http:\/\/hintz.bplaced.net\/en\/?p=3325"},"modified":"2023-03-04T19:41:38","modified_gmt":"2023-03-04T18:41:38","slug":"spiraling-balloon-spirals","status":"publish","type":"post","link":"http:\/\/hintz.bplaced.net\/de\/2017\/webgl\/spiraling-balloon-spirals\/","title":{"rendered":"Spiralisierende Ballon Spiralen"},"content":{"rendered":"<p><\/p>\n<p class=\"webgl\"><img decoding=\"async\" loading=\"lazy\" src=\"http:\/\/hintz.bplaced.net\/images\/2017\/09\/BalloonSpirals.jpg\" width=\"620\" height=\"620\" \/><a href=\"https:\/\/glslsandbox.com\/e#42665.2\"><canvas width=\"620\" height=\"620\"><script type=\"x-shader\/x-vertex\">attribute vec2 position; void main() { gl_Position = vec4(position, 0, 1); }<\/script><script type=\"x-shader\/x-fragment\">\n#ifdef GL_ES\nprecision mediump float;\n#endif\n\/\/ modified 2017-09-24, Spiraling Spirals by @hintz\nuniform float time;\nuniform vec2 mouse;\nuniform vec2 resolution;\nvoid main()\n{\n\tvec2 r = resolution,\n\to = (gl_FragCoord.xy - r*.5) \/ r.y;\n\to = vec2(length(o), atan(o.y,o.x) + (2.*atan(o.y,o.x))); \n\to.x += 2. * o.y * .031830988618379;\n\to.x = mod(o.x, .2) - .1;\n\tvec4 s = .1*cos(-time + 1.6*vec4(0,1,2,3) - time*.89 + o.y + .4*cos(o.y + 1.3*time) * sin(0.21*time)*1.5),\n\te = s.wxyz,\n\tf = min(o.x-s,e-o.x);\n\tgl_FragColor = 0.4 *(dot(clamp(f*2.5,0.,1.), 300.*(s-e)) * (s-.2) +\n\tdot(clamp(f*r.y,0.,1.), 20.*(s-e)) * ((s-.15)));\n\tgl_FragColor.a = 1.;\n}\n<\/script><\/canvas><\/a><\/p>\n<p>Dies sind ein paar die Farben wechselnde Spiralen, die so aussehen m\u00f6gen, als w\u00e4ren sie aus Luftballons gemacht.<br \/>\nUm dies auf der Grafikkarte zu berechnen, werden nur erstaunlich wenige Zeilen Code ben\u00f6tigt.<\/p>","protected":false},"excerpt":{"rendered":"<p>Dies sind ein paar die Farben wechselnde Spiralen, die so aussehen m\u00f6gen, als w\u00e4ren sie aus Luftballons gemacht. Um dies auf der Grafikkarte zu berechnen, werden nur erstaunlich wenige Zeilen Code ben\u00f6tigt.<\/p>\n","protected":false},"author":1,"featured_media":3328,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[144],"tags":[102,147,150,170,189],"_links":{"self":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/3325"}],"collection":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/comments?post=3325"}],"version-history":[{"count":5,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/3325\/revisions"}],"predecessor-version":[{"id":3453,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/3325\/revisions\/3453"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/media\/3328"}],"wp:attachment":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/media?parent=3325"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/categories?post=3325"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/tags?post=3325"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}