Draft
Conversation
Implements text-based strike zone plot showing pitch locations using data from MLB Stats API (pitchData.coordinates.pX/pZ). - New component: PitchPlot.jsx with 21x13 grid strike zone - Uses Unicode box-drawing characters for clean visualization - Color-coded pitches: balls (green), strikes (red), in-play (blue) - Pitches numbered chronologically 1-9 - Integrated into LiveGame.jsx below Matchup component Tested with live BOS @ NYY game - pitches rendering in approximately correct positions. Ready for further refinement.
- Increase grid from 21x13 to 29x15 for better granularity - Enlarge strike zone from 9x9 to 16x11 with proper aspect ratio (compensates for terminal character height/width to look realistic) - Allow pitches to overlay borders/corners (fixes missing pitches) - Center plot horizontally in left panel - Adjust layout spacing in LiveGame component
- Add scrolling support to AtBat component (pitch-by-pitch list) - Mouse scrolling, keyboard navigation, vi-style keys (j/k) - Matches AllPlays scrolling functionality - Implement panel focus switching in LiveGame - Left/Right arrow keys (or h/l) toggle between panels - Only focused panel responds to scroll commands - Help bar shows arrow key shortcuts - Modify AllPlays to accept focused prop (was always focused) - Optimize layout spacing for better vertical balance - Reduced PitchPlot height from 18 to 15 lines - Gives AtBat more visible space for pitch descriptions
- Add selectPlayers selector to games.js - Display LHP/RHP after pitcher name in Matchup component
- Add Bresenham line algorithm for drawing trajectory lines - Draw white dotted line from release point to most recent pitch - Only render for most recent pitch
Owner
|
Overall I like the idea! I tested it out during one of yesterday's games and I had a few thoughts:
I haven't had time to really look at the code changes in detail. What I'm kind of thinking at this point is that I might bring this into |
- Add projectToCatcherView() function to convert 3D release coordinates to 2D catcher's viewpoint - Apply scale factor based on mound-plate distance (y0 distance): ~50 feet release scales to ~9% offset
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Hey @paaatrick I tried to add pitch location visualization on a strike zone like in MLB Gameday-- hope that's cool with you! Love your program.
So far:
I tested with several of the playoff games so far-- check it out:
API Data Sources:
pitchData.coordinates.pX,pZ(feet from home plate center)pitchData.coordinates.x0,z0(release position)strikeZoneTop/Bottomfrom APIgameData.players[ID].pitchHand.codeFiles Modified:
src/components/PitchPlot.jsx- New component for pitch visualizationsrc/components/LiveGame.jsx- Integration into live game layoutsrc/components/Matchup.jsx- Added pitcher handedness displaysrc/components/AtBat.jsx- Added scrolling supportsrc/components/AllPlays.jsx- Added focus managementsrc/features/games.js- AddedselectPlayersselectorI feel like I should let you know that I used claude AI heavily, but was hands on and kept track of what was happening, and it all seemed reasonable and straightforward. It's been pretty helpful in figuring where components were in your code, and figuring out the MLB API.
Would love to know what you think!