Niche Portobello Mushroom

    @thi.ng/webgl-msdf
    TypeScript icon, indicating that this package has built-in type declarations

    2.1.14 • Public • Published

    webgl-msdf

    npm version npm downloads Twitter Follow

    This project is part of the @thi.ng/umbrella monorepo.

    About

    Multi-channel SDF font rendering & basic text layout for WebGL. This is a support package for @thi.ng/webgl.

    This package provides multi-channel SDF font rendering capabilities for @thi.ng/webgl, incl. optional support for basic text alignment, vertex colors (e.g. for multi-color text), and shader options to draw outlines for each character. Furthermore, the key GLSL functions are provided as shader snippets to embed this functionality in custom shaders without having to resort to copy & paste.

    There're different versions of MSDF font generators. The format supported by this module is based on Don McCurdy's.

    Status

    STABLE - used in production

    Search or submit any issues for this package

    Installation

    yarn add @thi.ng/webgl-msdf

    ES module import:

    <script type="module" src="https://cdn.skypack.dev/@thi.ng/webgl-msdf"></script>

    Skypack documentation

    For Node.js REPL:

    # with flag only for < v16
    node --experimental-repl-await
    
    > const webglMsdf = await import("@thi.ng/webgl-msdf");
    

    Package sizes (gzipped, pre-treeshake): ESM: 1.68 KB

    Dependencies

    Usage examples

    Several demos in this repo's /examples directory are using this package.

    A selection:

    Screenshot Description Live demo Source
    WebGL MSDF text rendering & particle system Demo Source

    API

    Generated API docs

    TODO

    Authors

    Karsten Schmidt

    If this project contributes to an academic publication, please cite it as:

    @misc{thing-webgl-msdf,
      title = "@thi.ng/webgl-msdf",
      author = "Karsten Schmidt",
      note = "https://thi.ng/webgl-msdf",
      year = 2019
    }

    License

    © 2019 - 2022 Karsten Schmidt // Apache Software License 2.0

    Install

    npm i @thi.ng/webgl-msdf

    DownloadsWeekly Downloads

    11

    Version

    2.1.14

    License

    Apache-2.0

    Unpacked Size

    33.3 kB

    Total Files

    14

    Last publish

    Collaborators

    • thi.ng