29:null 2a:["$","title",null,{"children":"Bump Charts: English Premier League | Giuseppe Sollazzo | Observable"}] 2f:T694,Plot.plot({ width:1000, height:600, marginBottom:50, x: {tickSize:0, tickPadding:25, //adjust domain, add some padding for team text domain: [2016.7,2023.3], ticks: [2018, 2019, 2020, 2021, 2022], //use to format years tickFormat: d3.format("d"), label:null}, y: {label:null, ticks:false, reverse:true}, marks: [ //line charts for all teams, apply bump-x curve to smooth out lines Plot.lineY(data, {x: "season", y: "rank", z: "team_name", stroke:'#D8DCDC', strokeWidth:3, curve: "bump-x"}), //line chart just for Brighton and Leicester Plot.lineY(data, {filter: d => accentClubs.includes(d.team_name), x: "season", y: "rank", z: "team_name", stroke:'team_color', strokeWidth:3, curve: "bump-x"}), //team logos Plot.image(firstLastSeason, {src:"team_logo", height:25, width:25, x:"season", y:"rank"}), //team names starting point Plot.text(firstLastSeason, {filter: d => d.season===2018, text: d => d.team_name + ' ' + d.rank, textAnchor: "end", fontSize:13, y:"rank", x:2017.85}), //team names ending point Plot.text(firstLastSeason, {filter: d => d.season===2022, text: d => d.rank + ' ' + d.team_name, textAnchor: "start", fontSize:13, y:"rank", x:2022.15}) ] })30:[{"id":"33f7fd7c8e5970f43112e7d861b9967e54112ae0fa63e248d15e750fff9fe2a92b8cf8c2f8eec6e058bb482bd11a0d85cf42d05895838297ad74913a998ca3e1","href":"https://static.observableusercontent.com/files/33f7fd7c8e5970f43112e7d861b9967e54112ae0fa63e248d15e750fff9fe2a92b8cf8c2f8eec6e058bb482bd11a0d85cf42d05895838297ad74913a998ca3e1","name":"epl_team_season.csv","type":"text/csv","lastModified":1687711396050.105,"size":7027},{"id":"899fd83e6c3f90864b5ce08506434e3d709bf33d120033ca440c40ab43e9eadb76e42e05e65274a1054cd1cf38eb61f0ec3f575df62bb5570f1b363b79c170be","href":"https://static.observableusercontent.com/files/899fd83e6c3f90864b5ce08506434e3d709bf33d120033ca440c40ab43e9eadb76e42e05e65274a1054cd1cf38eb61f0ec3f575df62bb5570f1b363b79c170be","name":"team_colors.csv","type":"text/csv","lastModified":1687711396050.105,"size":1201},{"id":"fb875af063948eae23255a9571b060eadcacad5bd8f63ef1c00bb76a4370cf3929715f2a7bfa2b72151420f672e95730076ac669593e751739e0db4bc8771158","href":"https://static.observableusercontent.com/files/fb875af063948eae23255a9571b060eadcacad5bd8f63ef1c00bb76a4370cf3929715f2a7bfa2b72151420f672e95730076ac669593e751739e0db4bc8771158","name":"ref_epl_teams.csv","type":"text/csv","lastModified":1687711396050.105,"size":5183}] 2d:{"id":"ff5f127347144870","slug":null,"title":"Bump Charts: English Premier League","thumbnail":"a91b255a0c7245e5ebdf01af4140ffc88bd73afcbe4f34caf1e6a07c55ae2d07","access_level":"public","create_time":"$D2023-06-25T16:43:16.050Z","update_time":"$D2023-06-25T16:43:16.050Z","view_time":null,"first_public_time":"$D2023-06-25T16:43:16.050Z","fork":{"id":"aa2ed4c606d995c0","slug":null,"title":"Bump Charts: English Premier League","owner":{"id":"230f604926360997","login":"tashapiro","name":"Tanya Shapiro"}},"stars":0,"starred":false,"owner":{"type":"team","id":"d201b910f522c5b4","login":"puntofisso","name":"Giuseppe Sollazzo","avatar_url":"https://avatars-next.observableusercontent.com/435a12885939dcd83a498fa92eb6feff6145bae663fedcd9aeb51ffdc9cce2c1","tier":"starter_2024"},"version":228,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"25c4fb47bd957b2b","login":"puntofisso","name":"Giuseppe Sollazzo","avatar_url":"https://avatars-next.observableusercontent.com/435a12885939dcd83a498fa92eb6feff6145bae663fedcd9aeb51ffdc9cce2c1","tier":null}],"members":[{"type":"individual","id":"25c4fb47bd957b2b","login":"puntofisso","name":"Giuseppe Sollazzo","avatar_url":"https://avatars-next.observableusercontent.com/435a12885939dcd83a498fa92eb6feff6145bae663fedcd9aeb51ffdc9cce2c1","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Bump Charts: English Premier League","cells":[{"id":0,"value":"# Bump Charts: English Premier League \nChange in team rankings season by season from 2018 to 2022. \n\nPART 1. Recreate my [\"Tale of Two Clubs\"](https://twitter.com/tanya_shapiro/status/1643731773170352128) ggplot bump chart.\n\nPART 2. Experiment to recreate one of my interactive graphics about the [EPL](https://tanyaviz.com/projects/premier-league/). Hover feature for line chart pending [Observable Plot enhancement](https://github.com/observablehq/plot/issues/1574).\n\nDATA. Includes data import and data prep for visualization.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":203,"value":"## PART 1","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":170,"value":"## A Tale of Two Clubs\nThe English Premier League is the top professional football league in England. This chart highlights the teams with the most significant contrast in rankings over the past 5 years. Brighton & Hove Albion, a relative newcomer to the league, has gained 11 places, which Leicester City has declined in performance, falling 9 spots to 18th place.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":9,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":215,"value":"## DATA","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":210,"value":"Store main clubs that I want to highlight in a separate variable. Reduce typing (and typos)...","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":172,"value":"accentClubs = ['Brighton & Hove Albion','Leicester City']","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":207,"value":"### Reshape Data\nUse SQL to reshape data and create two new data sets - main one for lines, and a second one with first and last season just for the team logos.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":35,"value":"select *\nfrom data d\nwhere last_season = 1 or first_season =1","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","output":"firstLastSeason","database":"var:data"},{"id":18,"value":"select \n s.season\n ,s.rank \n ,s.team_name\n ,s.team_abbr\n --- data clean up for logo, not a perfect join, use case when to fill in blanks\n ,case \n when s.team_name = 'Manchester City' then 'https://resources.premierleague.com/premierleague/badges/t43.png'\n when s.team_name = 'Manchester United' then 'https://resources.premierleague.com/premierleague/badges/t1.png'\n else l.logo end as team_logo\n --- data clean up for team color, not a perfect join, use case when to fill in blanks\n ,case \n when s.team_name='Wolverhampton Wanderers' then '#fdb913' \n when s.team_name='Norwich City' then '#fff200'\n when s.team_name = 'Leicester City' then c.team_color_2\n when c.team_color_1 IS NULL then 'grey'\n else c.team_color_1 end as team_color\n ,rank() over (partition by team_name order by season) as first_season\n,rank() over (partition by team_name order by season desc) as last_season\nfrom seasons s \n left join colors c on c.team = s.team_name\n left join logos l on l.abbr = s.team_abbr\nwhere s.season>=2018","pinned":true,"hidden":false,"mode":"sql","author":"$undefined","summary":"$undefined","output":"data","database":"var:db"},{"id":4,"value":"### Import Data\nData scraped from ESPN with R, exported as csv, then imported into Observable.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":15,"value":"db = DuckDBClient.of({\n seasons: teamSeason, \n logos: teamLogo,\n colors : teamColors\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"teamSeason = await FileAttachment(\"epl_team_season.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7,"value":"teamColors = await FileAttachment(\"team_colors.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":8,"value":"teamLogo = await FileAttachment(\"ref_epl_teams.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":136,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2e:"$2d:body"