m/umami
1
0
Fork 0
mirror of https://github.com/kremalicious/umami.git synced 2024-11-24 11:01:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fixed chart rendering issue.

Browse Source
This commit is contained in:
Mike Cao 2024-03-29 08:39:05 -07:00
parent e1ad3b99cd
commit 40c1ce40e2
2 changed files with 63 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/charts/BarChart.tsx
View File

@ -1,3 +1,4 @@
import { useMemo } from 'react';
import { useTheme } from 'components/hooks';
import Chart, { ChartProps } from 'components/charts/Chart';
import { renderNumberLabels } from 'lib/charts';
@ -25,7 +26,8 @@ export function BarChart(props: BarChartProps) {
stacked = false,
} = props;
const options = {
const options = useMemo(() => {
return {
scales: {
x: {
type: XAxisType,
@ -64,6 +66,7 @@ export function BarChart(props: BarChartProps) {
},
},
};
}, [colors]);
const handleTooltip = ({ tooltip }: { tooltip: any }) => {
const { opacity } = tooltip;

6
src/components/charts/Chart.tsx
View File

@ -1,4 +1,4 @@
import { useState, useRef, useEffect, ReactNode } from 'react';
import { useState, useRef, useEffect, useMemo, ReactNode } from 'react';
import { Loading } from 'react-basics';
import classNames from 'classnames';
import ChartJS, { LegendItem } from 'chart.js/auto';
@ -38,7 +38,8 @@ export function Chart({
const chart = useRef(null);
const [legendItems, setLegendItems] = useState([]);
const options = {
const options = useMemo(() => {
return {
responsive: true,
maintainAspectRatio: false,
animation: {
@ -61,6 +62,7 @@ export function Chart({
},
...chartOptions,
};
}, [chartOptions]);
const createChart = (data: any) => {
ChartJS.defaults.font.family = 'Inter';