SVGMeshUnity

Generates mesh from SVG path in realtime for Unity.

This is a port of https://github.com/mattdesl/svg-mesh-3d

Install

Copy Assets/SVGMeshUnity directory to your Assets directory.

Add a SVGMesh component to a GameObject that has MeshFilter and MeshRenderer.

Usage

Create mesh from SVG path

var mesh = GetComponent<SVGMesh>();
var svg = new SVGData();
svg.Path("M17.316,6.246c0.008,0.162,0.011,... and so on");
mesh.Fill(svg);

Simply create an instance of SVGData and set SVG path data string by calling SVGData.Path(). Then call Mesh.Fill(), a mesh will be generated.

Create mesh from code

Instead of use SVG path data, you can directly make path data in your code.

void Update()
{
    SVG.Clear();

    var resolution = 5;
    var radius = 3f;
    
    SVG.Move(NoisedR(radius, 0), 0f);
    
    for (var i = 0; i < resolution; ++i)
    {
        var i0 = i;
        var i1 = (i + 1) % resolution;
        
        var angle0 = Mathf.PI * 2f * ((float) i0 / resolution);
        var angle1 = Mathf.PI * 2f * ((float) i1 / resolution);

        var r0 = NoisedR(radius, i0);
        var r1 = NoisedR(radius, i1);
        var x0 = Mathf.Cos(angle0) * r0;
        var y0 = Mathf.Sin(angle0) * r0;
        var x1 = Mathf.Cos(angle1) * r1;
        var y1 = Mathf.Sin(angle1) * r1;

        var cx = x0 + (x1 - x0) * 0.5f;
        var cy = y0 + (y1 - y0) * 0.5f;
        var ca = Mathf.Atan2(cy, cx);
        var cr = 0.3f + (Mathf.PerlinNoise(Time.time, i * -100f) - 0.5f) * 1.15f;
        cx += Mathf.Cos(ca) * cr;
        cy += Mathf.Sin(ca) * cr;
        
        SVG.Curve(cx, cy, cx, cy, x1, y1);
    }
    
    Mesh.Fill(SVG);
}

private float NoisedR(float r, float randomize)
{
    return r + (Mathf.PerlinNoise(Time.time, randomize * 10f) - 0.5f) * 0.5f;
}

Use SVGData.Move, SVGData.Line, SVGData.Curve, ... and so on. Create realtime path as you like.

Options

The following options are provided in SVGMesh component.

• Delaunay (default false)
  • whether to use Delaunay triangulation
  • Delaunay triangulation is slower, but looks better
• Scale (default 1)
  • a positive number, the scale at which to approximate the curves from the SVG paths
  • higher number leads to smoother corners, but slower triangulation
• Interior if set, only return interior faces. See note. (Default true)
• Exterior if set, only return exterior faces. See note. (Default false)
• Infinity if set, then the triangulation is augmented with a point at infinity represented by the index -1. (Default false)

License

MIT