import { Chart } from '@megafon/ui-lk-vas';
<Chart type="doughnut" title="Кольцевая диаграмма" labels={["Title 1", "Title 2", "Title 3", "Title 4", "Title 5", "Title 6", "Title 7", "Title 8"]} datasets={[ { data: [1200, 300, 150, 300, 200, 50, 100, 100] } ]} /> <Chart type="doughnut" title="Кольцевая диаграмма" datasets={[]} labels={[]} />
<Chart type="doughnut" title="Расходы" labels={["Звонки", "Смс"]} datasets={[ { data: [25, 75], unit: "%" }, ]} /> <Chart type="doughnut" title="Страны" labels={["Россия"]} datasets={[ { data: [100], unit: "%" }, ]} />
<Chart type="line" title="Линейная диаграмма" labels={[ "Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс" ]} datasets={[ { label: "Dataset 1", data: [500, 250, 50, 350, 150, 450, 250], }, { label: "Dataset 2", data: [150, 600, 550, 1000, 250, 150, 450], } ]} /> <Chart type="line" title="Линейная диаграмма" labels={[]} datasets={[]} />
<Chart type="line" title="Способ авторизации" labels={[ "2023-02", "2023-03", "2023-04", "2023-05", "2023-06", "2023-07", "2023-08", "2023-09", "2023-10", "2023-11", "2023-12", "2024-01", "2024-02", ]} datasets={[ { label: "По СМС", data: [12, 15, 16, 19, 25, 26, 35, 34, 33, 35, 38, 35, 38], }, { label: "По Звонку", data: [8, 11, 11, 12, 16, 17, 19, 20, 22, 21, 24, 24, 23], } ]} scales={{ skipTicksX: 3, skipTicksY: 2, }} />
<Chart type="bar" title="Периоды активности пользователей, количество сессий" labels={[ "00:00-09:00", "09:00-10:00", "10:00-11:00", "11:00-12:00", "12:00-13:00", "13:00-14:00", "14:00-15:00", "15:00-16:00", "16:00-17:00", "17:00-18:00", "18:00-00:00", ]} datasets={[ { label: "Сессии", data: [340, 25, 50, 220, 240, 230, 190, 170, 160, 140, 130], } ]} scales={{ skipTicksX: 2, }} downloadLink="#" hideLegend />