24 lines
1.1 KiB
Vue
24 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import { DonutChart } from '@/lib/registry/new-york/ui/chart-donut'
|
|
|
|
const data = [
|
|
{ name: 'Jan', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
{ name: 'Feb', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
{ name: 'Mar', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
{ name: 'Apr', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
{ name: 'May', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
{ name: 'Jun', total: Math.floor(Math.random() * 2000) + 500, predicted: Math.floor(Math.random() * 2000) + 500 },
|
|
]
|
|
|
|
const valueFormatter = (tick: number | Date) => typeof tick === 'number' ? `$ ${new Intl.NumberFormat('us').format(tick).toString()}` : ''
|
|
</script>
|
|
|
|
<template>
|
|
<DonutChart
|
|
index="name"
|
|
:category="'total'"
|
|
:data="data"
|
|
:value-formatter="valueFormatter"
|
|
/>
|
|
</template>
|