{"id":2933,"date":"2013-04-30T23:28:32","date_gmt":"2013-04-30T21:28:32","guid":{"rendered":"http:\/\/hintz.bplaced.net\/?p=2933"},"modified":"2015-03-16T01:33:58","modified_gmt":"2015-03-16T00:33:58","slug":"bars","status":"publish","type":"post","link":"http:\/\/hintz.bplaced.net\/de\/2013\/webgl\/balken\/","title":{"rendered":"WebGL &#8211; Balken"},"content":{"rendered":"<p>Heute habe ich ein paar existierende Farbbalken von thygate@gmail.com and malc (mlashley@gmail.com) erweitert.<\/p>\n<p>Ich habe weitere Farben hinzugef\u00fcgt, die Bewegung ge\u00e4ndert und die Farb\u00fcberblendung korrigiert.<\/p>\n<p class=\"webgl\"><img decoding=\"async\" src=\"http:\/\/hintz.bplaced.net\/images\/2013\/04\/bars.jpg\" \/><a href=\"http:\/\/glslsandbox.com\/e#8409.16\"><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\/\/ bars - thygate@gmail.com\n\/\/ rotation and color mix modifications by malc (mlashley@gmail.com)\n\/\/ modified by @hintz 2013-04-30\n#ifdef GL_ES\nprecision mediump float;\n#endif\nuniform float time;\nuniform vec2 resolution;\nvec2 position;\nvec4 color;\nfloat c = cos(time\/2.0);\nfloat s = sin(time\/2.0);\nmat2 R = mat2(c,-s,s,-c);\nfloat barsize = 0.15;\nfloat barsangle = 200.0*sin(time*0.001);\nvec4 bar(float pos, float r, float g, float b)\n{\n\treturn max(0.0, 1.0 - abs(pos - position.y) \/ barsize) * vec4(r, g, b, 1.0);\n}\nvoid main(void) \n{\n\tposition = (gl_FragCoord.xy - 0.5*resolution.xy) \/ resolution.xx;\n\tposition = 2.0*position * R; \t\t\t\t\n\tfloat t = time*0.5;\n\tvec4 color = vec4(0.0);\n\tcolor += bar(sin(t), 1.0, 0.0, 0.0);\n\tcolor += bar(sin(t+barsangle\/6.*2.), 1.0, 0.5, 0.0);\n\tcolor += bar(sin(t+barsangle\/6.*4.), 1.0, 1.0, 0.0);\n\tcolor += bar(sin(t+barsangle\/6.*6.), 0.0, 1.0, 0.0);\n\tcolor += bar(sin(t+barsangle\/6.*8.), 0.0, 1.0, 1.0);\n\tcolor += bar(sin(t+barsangle\/6.*10.), 0.0, 0.0, 1.0);\n\tcolor += bar(sin(t+barsangle\/6.*12.), 0.5, 0.0, 1.0);\n\tcolor += bar(sin(t+barsangle\/6.*14.), 1.0, 0.0, 1.0);\n\tcolor.a = 1.0;\n\tgl_FragColor = color;\n}\n<\/script><\/canvas><\/a><\/p>\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>Heute habe ich ein paar existierende Farbbalken von thygate@gmail.com and malc (mlashley@gmail.com) erweitert. Ich habe weitere Farben hinzugef\u00fcgt, die Bewegung ge\u00e4ndert und die Farb\u00fcberblendung korrigiert.<\/p>\n","protected":false},"author":1,"featured_media":3005,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[144],"tags":[147,145,146,189],"_links":{"self":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/2933"}],"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=2933"}],"version-history":[{"count":38,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/2933\/revisions"}],"predecessor-version":[{"id":3190,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/posts\/2933\/revisions\/3190"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/media\/3005"}],"wp:attachment":[{"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/media?parent=2933"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/categories?post=2933"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/hintz.bplaced.net\/de\/wp-json\/wp\/v2\/tags?post=2933"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}