4 ms·

That's cool. As far as I can tell, you are approximating bezier curves with line segments. It is a valid solution in many cases, but I would not use this techn

by m1el 11y ago

That's cool. As far as I can tell, you are approximating bezier curves with line segments. It is a valid solution in many cases, but I would not use this technique for anything but aestetics. Have you seen this paper: http://www.msr-waypoint.net/en-us/um/people/cloop/LoopBlinn05.pdf http://www.msr-waypoint.net/en-us/um/people/cloop/LoopBlinn0... ?

mandeepj 11y ago
Thanks for sharing the paper. I am not sure how to interpret those mathematical formulas presented in these papers otherwise they are great resources. I am working on rendering a human body in a web app. I think I can take little help from this paper.
deleted 11y ago
[deleted]
mattdesl 11y ago
> I would not use this technique for anything but aestetics. I agree Loop-Blinn produces better results, and I would like to see it implemented in WebGL, but it adds a great deal of complexity and tightly couples the code with the rendering engine (eg: ThreeJS, stackgl). The curve approximation is done here: https://github.com/mattdesl/adaptive-bezier-curve https://github.com/mattdesl/adaptive-bezier-curve
- cscheid 11y ago
  You can write composable WebGL, but it takes more work. Here's my Loop-Blinn example: http://cscheid.github.io/lux/demos/loopblinn/loopblinn.html http://cscheid.github.io/lux/demos/loopblinn/loopblinn.html The bits that do Loop-Blinn are here, https://github.com/cscheid/lux/blob/master/src/lux/text/outline.js#L84-L140 https://github.com/cscheid/lux/blob/master/src/lux/text/outl..., while the bits that decide the color of the text go elsewhere. Look at 'unconed's MathBox for this kind of thing taken to incredible heights, or https://github.com/kovasb/gamma https://github.com/kovasb/gamma for the ClojureScript analogue.
  - mattdesl 11y ago
    Nice demo! And thanks for the code reference. :) It seems very tightly coupled to Lux; it would have to be re-implemented for ThreeJS, StackGL, MathBox, Pixi, etc. Gamma and glslify are great ways of modularizing GLSL. I don't feel that modular WebGL is a solved problem, though.

by m1el 11y ago

mandeepj 11y ago

Thanks for sharing the paper. I am not sure how to interpret those mathematical formulas presented in these papers otherwise they are great resources. I am working on rendering a human body in a web app. I think I can take little help from this paper.

deleted 11y ago

[deleted]

mattdesl 11y ago

> I would not use this technique for anything but aestetics. I agree Loop-Blinn produces better results, and I would like to see it implemented in WebGL, but it adds a great deal of complexity and tightly couples the code with the rendering engine (eg: ThreeJS, stackgl). The curve approximation is done here: https://github.com/mattdesl/adaptive-bezier-curve https://github.com/mattdesl/adaptive-bezier-curve

cscheid 11y ago
You can write composable WebGL, but it takes more work. Here's my Loop-Blinn example: http://cscheid.github.io/lux/demos/loopblinn/loopblinn.html http://cscheid.github.io/lux/demos/loopblinn/loopblinn.html The bits that do Loop-Blinn are here, https://github.com/cscheid/lux/blob/master/src/lux/text/outline.js#L84-L140 https://github.com/cscheid/lux/blob/master/src/lux/text/outl..., while the bits that decide the color of the text go elsewhere. Look at 'unconed's MathBox for this kind of thing taken to incredible heights, or https://github.com/kovasb/gamma https://github.com/kovasb/gamma for the ClojureScript analogue.
- mattdesl 11y ago
  Nice demo! And thanks for the code reference. :) It seems very tightly coupled to Lux; it would have to be re-implemented for ThreeJS, StackGL, MathBox, Pixi, etc. Gamma and glslify are great ways of modularizing GLSL. I don't feel that modular WebGL is a solved problem, though.