How to draw Three js line geometry with tween animation effect?

I am new to Three.js.

I want to draw curves (based on some parametric equations) on 3D space, using THREE.JS, to illustrate the path of drawing.

To achieve this basically I tried in two ways:

APPROACH ONE: update values in geometry. :

var lineGeometry = new THREE.Geometry();
lineGeometry.vertices.push(new THREE.Vector3(starting_x,starting_y,starting_z));
var lineMaterial = new THREE.LineBasicMaterial({color: 0xffffff});
var line = new THREE.Mesh(lineGeometry, lineMaterial);
scene.add(line);


function render() {
    requestAnimationFrame(animate);
    //calculate x,y,z based on my equation  
    lineGeometry.vertices.push(new THREE.Vector3(x,y,z));
    renderer.render(scene, camera);
}

APPROACH TWO: using Tween.js update function. Referenced on

var lineGeometry = new THREE.Geometry();
lineGeometry.vertices.push(new THREE.Vector3(starting_x,starting_y,starting_z));
var lineMaterial = new THREE.LineBasicMaterial({color: 0xffffff});
var line = new THREE.Mesh(lineGeometry, lineMaterial);
scene.add(line);

var position = {x: -15, y: 0, z: 0};
var target = {x: 4, y: 0, z: -15};
var tween = new TWEEN.Tween(position).to(target, 8000);
tween.easing(TWEEN.Easing.Elastic.InOut);

tween.onUpdate(function() {
    lineGeometry.vertices.push(position.x, position.y, position.z);

});
tween.start();
animate();
function animate() {
    render();
    requestAnimationFrame(animate);
    TWEEN.update();
}
function render() {
    renderer.render(scene, camera);
}

How can I achieve this as in this link (its in 2D space and I was trying to achieve in 3D space)?

PS: I can add a shapes and lines to scene also able animate the entire object with tween.js. But problem is to animating the drawing of line. Please help out.