Cleanup
This commit is contained in:
parent
b931afd7cc
commit
dfa31a0bd7
|
@ -9,9 +9,8 @@
|
|||
.pieText,
|
||||
.labelText {
|
||||
fill: white;
|
||||
font-size: 20px;
|
||||
font-size: 40px;
|
||||
font-weight: 800;
|
||||
font-family: "Inconsolata", "sans-serif";
|
||||
}
|
||||
|
||||
.pieText {
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
import { Group } from "@visx/group";
|
||||
import { Arc } from "@visx/shape";
|
||||
import Pie, { ProvidedProps } from "@visx/shape/lib/shapes/Pie";
|
||||
import React, { useState } from "react";
|
||||
import React from "react";
|
||||
|
||||
import styles from "./PieChart.module.css";
|
||||
|
||||
|
@ -28,8 +27,8 @@ export function PieChart({ width, textPadding, ...props }: PieChartProps) {
|
|||
pieValue={(d: PieChartData) => d.value}
|
||||
cornerRadius={10}
|
||||
padAngle={0.075}
|
||||
padRadius={width * 0.7}
|
||||
innerRadius={width * 0.03}
|
||||
padRadius={width * 0.35}
|
||||
innerRadius={width * 0.015}
|
||||
outerRadius={pieWidth}
|
||||
>
|
||||
{(pie) => <PieSlices {...pie} isLabel={false} />}
|
||||
|
@ -58,7 +57,7 @@ export function PieSlices({ isLabel, ...props }: PieSlicesProps<PieChartData>) {
|
|||
<>
|
||||
{props.arcs.map((arc) => {
|
||||
const [centroidX, centroidY] = props.path.centroid(arc);
|
||||
const pathArc = props.path(arc);
|
||||
const pathArc = props.path(arc) as string;
|
||||
|
||||
return (
|
||||
<g className={styles.group} key={`arc-${arc.data.category}`}>
|
||||
|
|
|
@ -47,6 +47,6 @@ export const mockPieData = [
|
|||
},
|
||||
{
|
||||
category: "Cuckoo",
|
||||
value: 19,
|
||||
value: 20,
|
||||
},
|
||||
];
|
||||
|
|
|
@ -9,7 +9,7 @@ export default function Home() {
|
|||
<h1>Playground</h1>
|
||||
<p>Show off your components here!</p>
|
||||
<div style={{ padding: "30px" }}>
|
||||
<PieChart data={mockPieData} width={600} textPadding={100} />
|
||||
<PieChart data={mockPieData} width={800} textPadding={200} />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue