import { BubbleDataPoint, Chart as ChartJs, Legend, LinearScale, PointElement, Tooltip } from 'chart.js';
import { ChartProps as BchartProps, Bubble as RBubble } from 'react-chartjs-2';

ChartJs.register(LinearScale, PointElement, Tooltip, Legend);


export interface ChartProps extends BchartProps<'bubble', BubbleDataPoint[], unknown> {
    height?: string;
    width?: string;
}

export const BubbleChart = ({ height, width, ...rest }: ChartProps) => {
    return (
        <div style={{ width: width, height: height }}><RBubble {...rest} ></RBubble></div>
    );
}