Issues rendering MSDF generated with msdf-bmfont

[danrossi]

I have tested out generating both the Roboto Bold font and custom WebFonts from icomoon. However it seems the MSDF shader provided generates outline for colors and doesn't generate properly.

The msdf shader supplied with msdf-bmfont works ok but its obviously different and like to stick with this one.

SDF font generation with the tool and using the supplied SDF shader seems to be ok however.

Just an example what I'm trying to achieve with the webfont icons also

Actual msdf texture looks like this for the Roboto bold font.

I'm not sure who to task first.

[danrossi]

according to my test. the only difference with the other shader is on this line.

https://github.com/Jam3/three-bmfont-text/blob/master/shaders/msdf.js#L49

if I remove the subtraction it works ie

vec3 sample = texture2D(map, vUv).rgb;

[danrossi]

I'm not sure what the foreground and background colors are supposed to do in the other shader here but I changed it back to a normal color vector

void main() {
        vec3 sample = texture2D(map, vUv).rgb;
        float sigDist = median(sample.r, sample.g, sample.b) - 0.5;
        float alpha = clamp(sigDist/fwidth(sigDist) + 0.5, 0.0, 1.0);
        gl_FragColor = vec4(color.xyz, alpha * opacity);
      }

[donmccurdy]

Opened a PR adding a negate option for the shader: #24

e.g.

const createTextGeometry = require('three-bmfont-text');
const createMSDFShader = require('three-bmfont-text/shaders/msdf');

createMSDFShader({
  map: texture,
  color: 0x000000,
  negate: false
});

[danrossi]

Should I close this ?

I have fixed up all issues and refactored to es6 so I can bundle with three.js. my fork is here

https://github.com/danrossi/three-bmfont-text/tree/es6

[danrossi]

Here is my change https://github.com/danrossi/three-bmfont-text/blob/es6/src/shaders/MSDFShader.js

[donmccurdy]

Were there other issues related to msdfgen 1.4, or something else? It would be nice to get PRs in, I think (e.g. A-Frame depends on this library) if @mattdesl would have time to review them.