how to i fix my code on p$5.$js so that the blurb that pops up lines up with the type of crime the pointer lands on$?$ in the pic i attached, it shows the pointer landed on fraud but its displaying stats for theft. here is my code:

let angle $=0$; $//$ Current angle of the wheel

let targetAngle $=0$; $//$ Target angle for stopping

let spinning $=$ false; $//$ Is the wheel spinning?

let easing $=0\mathrm{.}05$; $//$ Deceleration rate

let categories $=["$Theft$",$ "Assault", "Burglary", "Fraud", "Vandalism"$]$;

let data $=\{\}$; $//$ Object to store specific crime data

let selectedCategory $=$ null;

function preload$()\{$

$//$ Simulated data

$$ data$["$Theft$"]=[$

$\{$ type: "Petty Theft", count: $123\},$

$\{$ type: "Grand Theft", count: $75\}$

$]$;

$$ data$["$Assault$"]=[$

$\{$ type: "Aggravated Assault", count: $89\},$

$\{$ type: "Simple Assault", count: $200\}$

$]$;

$$ data$["$Burglary$"]=[$

$\{$ type: "Residential Burglary", count: $45\},$

$\{$ type: "Commercial Burglary", count: $30\}$

$]$;

$$ data$["$Fraud$"]=[$

$\{$ type: "Identity Theft", count: $110\},$

$\{$ type: "Credit Card Fraud", count: $47\}$

$]$;

$$ data$["$Vandalism$"]=[$

$\{$ type: "Graffiti", count: $150\},$

$\{$ type: "Property Damage", count: $90\}$

$]$;

$\}$

function setup$()\{$

$$ createCanvas$(400,400)$;

$$ angleMode$($DEGREES$)$;

$$ textAlign$($CENTER$,$ CENTER$)$;

$\}$

function draw$()\{$

$$ background$(240)$;

$//$ Draw the stationary pointer

$$ fill$(0)$;

$$ triangle$($width $/2-10,30,$ width $/2+10,30,$ width $/2,50)$;

$//$ Move to center and rotate the wheel

$$ translate$($width $/2,$ height $/2)$;

$$ rotate$($angle$)$;

$//$ Draw the wheel

$$ let segmentAngle $=360/$ categories.length;

$$ for $($let i $=0$; i $$ categories.length; i$++)\{$

$$ let startAngle $=$ i $*$ segmentAngle;

$$ let endAngle $=$ startAngle $+$ segmentAngle;

$$ fill$($i $\%2===0?$ color$(200,0,100)$ : color$(0,150,200))$;

$$ stroke$(255)$;

$$ strokeWeight$(2)$;

$$ arc$(0,0,300,300,$ startAngle, endAngle, PIE$)$;

$$ push$()$;

$$ rotate$($startAngle $+$ segmentAngle $/2)$;

$$ fill$(255)$;

$$ noStroke$()$;

$$ text$($categories$[$i$],120,0)$;

$$ pop$()$;

$\}$

$//$ Update angle if spinning

$$ if $($spinning$)\{$

$$ let delta $=$ targetAngle $-$ angle;

$$ angle $+=$ delta $*$ easing;

$//$ Stop spinning when close enough

$$ if $($abs$($delta$)<mtext></mtext><mn>0</mn><mn>.</mn><mn>5</mn><mi>)</mi><mtext></mtext><mi>\{</mi>$

$$ spinning $=$ false;

$$ angle $=$ targetAngle $\%360$;

$$ calculateSelectedCategory$()$;

$\}$

$\}$

$//$ Reset rotation for overlay

$$ rotate$(-$angle$)$;

$$ translate$(-$width $/2,-$height $/2)$;

$//$ Display selected category and data

$$ if $($selectedCategory$)\{$

$$ displayData$()$;

$\}$

$\}$

function keyPressed$()\{$

$$ if $($key $===\text{'}\text{'})\{$

$$ if $(!$spinning$)\{$

$$ spinning $=$ true;

$$ targetAngle $=$ angle $+$ random$(720,1440)$; $//$ Random spin between $2-4$ full rotations

$\}$

$\}$ else if $($key $===\text{'}$r$\text{'})\{$

$$ angle $=0$;

$$ spinning $=$ false;

$$ selectedCategory $=$ null;

$\}$

$\}$

function calculateSelectedCategory$()\{$

$$ let segmentAngle $=360/$ categories.length;

$$ let normalizedAngle $=(360-$ angle $\%360)\%360$; $//$ Normalize to $0-360$

$$ let index $=$ floor$($normalizedAngle $/$ segmentAngle$)$;

$$ selectedCategory $=$ categories$[$index$]$;

$\}$

function displayData$()\{$

$$ fill$(50)$;

$$ noStroke$()$;

$$ rect$(20,300,360,80,10)$;

$$ fill$(255)$;

$$ textSize$(14)$;

$$ text$(`$Selected Category: $$\{$selectedCategory$\}`,200,320)$;

$$ let details $=$ data$[$selectedCategory$]$

$.$map$($item $=>`$$$\{$item$.$type$\}$: $$\{$item$.$count$\}`)$

$.$join$(\text{'}$

$\text{'})$;

$$ text$($details$,200,350)$;

$\}$ Preview

Grand Ineit: $15$