Skip to content
On this page

Circles

Circles take a center vector and a radius.

Code
vue
<script setup lang="ts">
import { Mafs, Cartesian, Circle, MovablePoint, useMovablePoint, vec } from 'mafs-vue'
import { computed } from 'vue'

const pointOnCircle = useMovablePoint([Math.sqrt(2) / 2, Math.sqrt(2) / 2])
const r = computed(() => vec.mag(pointOnCircle.point))
</script>

<template>
    <Mafs :height="200" :viewBox="{ y: [-2, 2] }">
        <Cartesian />
        <Circle :center="[0, 0]" :radius="r" />
        <MovablePoint :ctx="pointOnCircle" />
    </Mafs>
</template>

Props

<Circle ... />

NameDescriptionDefault
center
vector2
radius
number
filled
FilledProps

filled is the same as Polygons