mathmesh v0.0.7

NOTE: this package is messy like spaghetti, but i think if it can help me, it might can help someone, too

What it lacks: 1. It doesn't support sqrt / nth root, please use ^(1/n) instead

To use:

    npm install mathmesh

For 3D:

ex:

  import {mathmesh} from "mathmesh";
  var mesh = mathmesh("\\int_{a}^{b}x^2 \\,dx");
  console.log(mesh)'

you will get:

{
  positions: [ x1, y1, z1, x2, y2, z2, .....],
  indicies: [ # # # # # .....],
  vertices: Float32Array()
}

import {mathmesh} from "mathmesh";
...
var verts = mathmesh("\\int_{a}^{b}x^2 \\,dx");
let customMesh = new Mesh("mymathmesh", scene);
let vertexData = new VertexData();

vertexData.positions = verts.positions;
vertexData.indices = verts.indices;
vertexData.applyToMesh(customMesh);

let fontmaterial = new StandardMaterial("mathmeshMat", scene);
fontmaterial.backFaceCulling = false;
fontmaterial.emissiveColor = new Color3(0, 1, 0);
customMesh.material = fontmaterial;

import {mathmesh} from "mathmesh";
const vertices = mathmesh("\\int_{a}^{b}x^2 \\,dx").vertices;
...
<bufferGeometry >
  <bufferAttribute
        attach='attributes-position'
        array={vertices}
        count={vertices.length / 3}
        itemSize={3}
    /> 
</bufferGeometry>

It works in vite react, but for npm run build to work, you might need to add "NODE_OPTIONS=--max-old-space-size=4000 vite build"

Also tried in nextjs, runs fine

For 2D:

ex:

  import {mathmesh2D} from "mathmesh";
  var mesh = mathmesh2D("\\int_{a}^{b}x^2 \\,dx");
  console.log(mesh)'

you will get:

{
  positions: [ x1, y1, x2, y2, .....],
  indicies: [ # # # # # .....],
  vertices: Float32Array(),
  triangles: [ 
    [ [t1_x0,t1_y0], [t1_x1, t1_y1] ,[t1_x2, t1_y2] ], 
    [ [t2_x0,t2_y0], [t2_x1, t2_y1] ,[t2_x2, t2_y2] ],
    ... ]
  aTextureCoord: number[];
  aVertexPosition: number[];  
}

import {mathmesh2D} from "mathmesh";
...
const mesh2D = mathmesh2D("\\sum_{n=1}^{\\infty} 2^{-n} = 1")
const geometry = new PIXI.Geometry()
.addAttribute('aVertexPosition', mesh2D.aVertexPosition,2)
.addAttribute('aTextureCoord', mesh2D.aTextureCoord,2)
.addIndex(mesh2D.indices);  
const greenColor = new PIXI.MeshMaterial(PIXI.Texture.WHITE, {
    tint: 0x00ff00, // Green color
});
const pixiMesh = new PIXI.Mesh(geometry, greenColor);
app.stage.addChild(pixiMesh);

import {mathmesh2D} from "mathmesh";
...
const mesh2D = mathmesh2D("\\sum_{n=1}^{\\infty} 2^{-n} = 1")
const mathmeshGraphics = new PIXI.Graphics();
mathmeshGraphics.beginFill(0x000000);
mesh2D.triangles.forEach( (tri: number[][]) => {
    mathmeshGraphics.moveTo(tri[0][0], tri[0][1] );
    mathmeshGraphics.lineTo(tri[1][0], tri[1][1] );
    mathmeshGraphics.lineTo(tri[2][0], tri[2][1] );
    mathmeshGraphics.lineTo(tri[0][0], tri[0][1] );
});
mathmeshGraphics.endFill();
app.stage.addChild(mathmeshGraphics);

if you want build from source and to see how it draw out locally , you can simply:

1. Clone this repo
2. npm install
3. npm run build
4. remove "type":"module" in package.json
5. npm run test
6. open localhost:8081
7. you should see a picture:

Won't able to do it without this amazing repo: https://github.com/fetisov/ttf2mesh