<script lang="ts">
import { onMount } from 'svelte';
import * as THREE from 'three';
var scene: THREE.Scene;
var camera: THREE.Camera;
var renderer: THREE.Renderer;
let canvasElement: HTMLCanvasElement;
const curve = new THREE.EllipseCurve(0, 0, 10, 5, 0, 2 * Math.PI, false, 0);
onMount(() => {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
renderer = new THREE.WebGLRenderer({ antialias: true, canvas: canvasElement });
renderer.setSize(window.innerWidth, window.innerHeight);
const geometry = new THREE.BufferGeometry().setFromPoints(curve.getPoints(100));
const material = new THREE.LineBasicMaterial({ color: 0x3f3f46 });
const ellipse = new THREE.Line(geometry, material);
scene.add(ellipse);
camera.position.z = 10;
animate();
});
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
</script>
This particular script is used within a Svelte component I am working on. Despite following the official documentation, I encountered an error when running it. The error message can be seen in the image here.
Upon inspecting further and logging the object, I couldn't locate any function named setFromPoints. This has left me a bit puzzled and unsure how to proceed with resolving this issue.