top of page
Search
Writer's pictureTyler Wu

Creating an NBA Shot Chart Generator (Part 2): Adding Interaction with Slider Widgets

Updated: Feb 22, 2021

Link to the app:


Looking at the columns of our shot-chart table we've obtained in the last blog post, some columns immediately jump out as potential candidates for interaction.


My first feature I would add would be SHOT_DISTANCE as a RangeSlider Widget (see documentation), which is essentially a slider where we can specify a min and max value. This could be useful as sometimes we want to see where a player is "money" from, as they say. Here's a handy clip of what that would look like for Damian Lillard's 2019 season:



The next idea I would add would be the GAME_DATE as a DateRangeSlider, as this adds a time axis, which might give insight to how a player has progressed or regressed throughout the season. Here's another clip showing what that looks like:



Having a small div to display the 2P% and 3P% as the user changes these sliders would also be handy. We can do this easily with subsetting the filtered data by SHOT_TYPE, then using the SHOT_MADE_FLAG to determine makes, attempts, and percentages. Here's that in action.

From looking at these ranges, we can see that Lillard has his "sweet-spots" in terms of range. Surprisingly, (or maybe not), he shoots better when he extends from 23 ft to 25 ft, and again there's another uptick going from around 26-28 ft to >30 ft. There could be other factors playing in to this like what type of coverage he's getting, or where screens are being set, but with the data we have we can't do much more to investigate.


Well look more into adding Checkbox Groups for opponent teams, play off vs regular season, and shot zones/shot types in Part 3 (coming soon).










18 views0 comments

コメント


Post: Blog2_Post
bottom of page