How do I clear fonts in threejs?

I put a font in the animation using the below code.
But when I put the next letter it gets overlap on that pervious string.
How to I clear previous and reload the new string?

The code is -

function show()
{
	loader1 = new THREE.FontLoader();
                loader1.load( 'helvetiker_regular.typeface.json', function ( font ) {
                southGeometry = new THREE.TextGeometry( " ", { font: font, size: 6, height: 0.05, curveSegments: 7});
                southMaterial = new THREE.MeshBasicMaterial( { color:'yellow' });
                toggle = new THREE.Mesh(southGeometry ,southMaterial );
                toggle.position.set(80,12, 0) ;
                scene.add(toggle);
		})
}		

Whenever I update this function It gets overlap like this -
image

So, every time you create a new mesh and put it at the same position without removing of the previous one.
What result do you expect?
Why not to use that dynamic geometry technique? https://threejs.org/examples/?q=memory#webgl_test_memory

1 Like