Library for making decorative svg charts. Designed in order to emphasize the design of the app.
All colors must be specified in rgb format
import { DLineChart } from "react-decorative-charts"
data: {
color?: number[]; // Default = [134, 153, 175]
points: number[];
withSmoothing?: boolean // Default = true
strokeWidth?: number // Default = 3
withDots?: boolean // Default = false
withShadow?: boolean // Default = true
}[];
margin?: string; // Default = undefined
width?: number; // Default = 100
height?: number; // Default = 100
<DLineChart
data={[
{
points: [1, 8, 7, 19],
color: [133, 223, 183]
}
]}
/>
import { DBarChart } from "react-decorative-charts"
color?: number[]; // Default = [134, 153, 175]
data: number[];
margin?: string; // Default = undefined
width?: number; // Default = 100
height?: number; // Default = 100
rounded?: boolean; // Default = true
withGradient?: boolean; // Default = false
gap?: number // Default = 5
<DBarChart
data={[5, 11, 3, 8, 9]}
width={200}
/>
import { DPieChart } from "react-decorative-charts"
secondaryColor?: number[]; // Default = [190, 199, 209]
primaryColor?: number[]; // Default = [134, 153, 175]
data: number; // Number of percents
margin?: string; // Default = undefined
radius?: number; // Default = 25
<DPieChart
data={45}
radius={50}
/>