FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-17 15:06:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(web/radial): gap variable

Browse Source
This commit is contained in:
DokaDoka
2023-02-22 00:12:43 +11:00
parent 4dd9b03ba3
commit 189a8a451f
1 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/features/menu/radial/index.tsx
View File

@@ -90,20 +90,23 @@ const RadialMenu: React.FC = () => {
// Always draw full circle to avoid elipse circles with 2 or less items
const pieAngle = 360 / (menu.items.length < 3 ? 3 : menu.items.length);
const angle = degToRad(pieAngle / 2 + 90);
const radius = 175 * 0.65;
const iconX = 175 + Math.sin(angle) * radius;
const iconY = 175 + Math.cos(angle) * radius;
const gap = 0
const radius = 175 * 0.65 - gap;
const sinAngle = Math.sin(angle)
const cosAngle = Math.cos(angle)
const iconX = 175 + sinAngle * radius;
const iconY = 175 + cosAngle * radius;
return (
<>
<g
transform={`rotate(-${index * pieAngle} 175 175)`}
transform={`rotate(-${index * pieAngle} 175 175) translate(${sinAngle * gap}, ${cosAngle * gap})`}
className={classes.sector}
onClick={() => fetchNui('radialClick', index)}
>
<path
d={`M175.01,175.01 l175,0 A175.01,175.01 0 0,0 ${175 + 175 * Math.cos(-degToRad(pieAngle))}, ${
175 + 175 * Math.sin(-degToRad(pieAngle))
d={`M175.01,175.01 l${175 - gap},0 A175.01,175.01 0 0,0 ${175 + (175 - gap) * Math.cos(-degToRad(pieAngle))}, ${
175 + (175 - gap) * Math.sin(-degToRad(pieAngle))
} z`}
/>
<g transform={`rotate(${index * pieAngle - 90} ${iconX} ${iconY})`} pointerEvents="none">