kediritechnopark/kedaimaster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ok banget

Browse Source
This commit is contained in:
zadit
2024-11-21 17:26:05 +07:00
parent 9c700c4729
commit 89b12737b7
11 changed files with 1345 additions and 513 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/pages/CircularDiagram.js
View File

@@ -1,17 +1,17 @@
import React from "react";
const CircularDiagram = ({ segments }) => {
const radius = 100; // Radius of the circle
const strokeWidth = 30; // Width of each portion
const radius = 70; // Radius of the circle
const strokeWidth = 20; // Width of each portion
const circumference = 2 * Math.PI * (radius - strokeWidth / 2);
let startOffset = 0; // Initial offset for each segment
let startOffset = -63; // Initial offset for each segment
const svgStyles = {
display: "block",
margin: "0 auto",
};
console.log(segments)
return (
<svg
width={radius * 2}
@@ -29,7 +29,10 @@ const CircularDiagram = ({ segments }) => {
/>
{segments.map((segment, index) => {
const { percentage, color } = segment;
const segmentLength = (circumference * percentage) / 100;
console.log(percentage)
let p = percentage;
if(p == 'Infinity' || isNaN(p)) p = 0;
const segmentLength = (circumference * p) / 100;
const strokeDashoffset = circumference - startOffset;
startOffset += segmentLength;