3e:null 3f:["$","title",null,{"children":"Introduction to Data Visualization in Observable Plot Course | TRSS | Observable"}] 45:T436,

4 part course series

Introduction to Data Visualization in Observable Plot

Instructor
Allison Horst
Data Scientist Advocate at Observable

Date and time
October 17th,19th, 24th, & 26th
at 9:00 AM PT | 12:00 PM ET

46:T8b9,47:[{"id":"621e7ffb8bf7cb7fec80580eca21b31f6824a8cff34ebfcaef52c4853d2d188eb8a023d824e7f8f9f0d3160fc3fa117732452020d044bdd7e0cbd6230ea07c77","href":"https://static.observableusercontent.com/files/621e7ffb8bf7cb7fec80580eca21b31f6824a8cff34ebfcaef52c4853d2d188eb8a023d824e7f8f9f0d3160fc3fa117732452020d044bdd7e0cbd6230ea07c77","name":"allisonhorst.jpeg","type":"image/jpeg","lastModified":1744963175990.296,"size":97213}] 43:{"id":"a8358bb446ce2660","slug":null,"title":"Introduction to Data Visualization in Observable Plot Course","thumbnail":"69c607263e339048ef848f26acc0b6d83ee513cee1a85f98a268d52d46535c75","access_level":"public","create_time":"$D2025-04-18T07:59:35.990Z","update_time":"$D2025-04-18T07:59:35.990Z","view_time":null,"first_public_time":"$D2025-04-18T07:59:35.990Z","has_unpublished_edits":null,"fork":{"id":"25ac10a588b541eb","slug":"introduction-data-visualization-observable-plot","title":"Introduction to Data Visualization in Observable Plot Course","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"d23f4772d2636bfa","login":"trss","name":"TRSS","avatar_url":"https://avatars-next.observableusercontent.com/cf75fa02188cff9d08ad21efa4d0fa7074c8dcaedce88236eef651d212e5964f","tier":"starter_2024","bio":"","following":false},"version":248,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"f50c9bb109895dae","login":"trss","name":"trss","avatar_url":"https://avatars-next.observableusercontent.com/3349e6e48487259972ccf248f2400cb670e60904d75fa82437c27c3c3c1b276f","tier":null,"bio":"","following":false}],"members":[{"type":"team","id":"d23f4772d2636bfa","login":"trss","name":"TRSS","avatar_url":"https://avatars-next.observableusercontent.com/cf75fa02188cff9d08ad21efa4d0fa7074c8dcaedce88236eef651d212e5964f","tier":"starter_2024","role":"editor"},{"type":"individual","id":"f50c9bb109895dae","login":"trss","name":"trss","avatar_url":"https://avatars-next.observableusercontent.com/3349e6e48487259972ccf248f2400cb670e60904d75fa82437c27c3c3c1b276f","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"fd724e4d9ef73001","slug":"plot-course","title":"Introduction to Data Visualization in Observable Plot Course by Allison Horst","owner":{"id":"d23f4772d2636bfa","login":"trss","name":"TRSS"}},"type":"notebook","body":{"titling":"auto","title":"Introduction to Data Visualization in Observable Plot Course","cells":[{"id":112,"value":"$45","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":208,"value":" ","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"______\n## What you'll learn!\n\nThis four-part course introduces core concepts and technical skills to start building custom, interactive data visualizations in [Observable Plot](https://observablehq.com/plot/). Throughout the course, participants will follow along with lecture materials and hands-on activities to: \n\n- Learn about the basics of the grammar of graphics as it relates to Observable Plot layers\n- Build common chart types (including scatterplots, bar charts, line charts, and histograms) starting from code snippets and the Chart cell\n- Develop increasingly complex visualizations (e.g. faceting, channels, reducers, windows)\n- Add interactivity to charts with Observable Inputs and tooltips\n\nUpon completing the course, participants can complete a short assignment to earn a course certificate.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"learn","database":"$undefined"},{"id":45,"value":"_____\n## Prerequisites\n\nCourse participants need an Observable account to follow along with hands-on activities and to complete the assignment (for those wanting a course certificate). Sign up at [observablehq.com](https://observablehq.com/). All levels welcome, whether you're new to Observable and JavaScript or a seasoned developer. \n_____","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"prerequisites","database":"$undefined"},{"id":128,"value":"## Session Topics","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"sessions","database":"$undefined"},{"id":130,"value":"details(\n md`\n### Session 1: Grammar of graphics and essential Observable Plot elements\n** October 17th **\n- Grammar of graphics introduction\n- Essential pieces of chart-building in Observable Plot (syntax, marks and scales)\n`\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"details(\n md`\n### Session 2: Customizing Observable Plot charts\n** October 19th **\n- Scales continued\n- Transforms (binning, grouping, reducers)`\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"details(\n md`\n### Session 3: Adding complexity\n** October 24th **\n- Faceting\n- Window functions\n- Maps with spatial data`\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"details(\n md`\n### Session 4: Interactivity and sharing\n** October 26th **\n- Observable Inputs continued\n- Custom tooltips and crosshairs\n- Sharing your data visualization by embedding, downloading, and sharing notebooks`\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"____\n## Connect with other course participants in Slack\nConnect with course participants in the Observable Community Slack. \n\nSign-up [here](https://bit.ly/3f6D2I6) and join the **#introduction-observable-plot** channel.\n____","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":138,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"register","database":"$undefined"},{"id":99,"value":"_____\n\n## About the Instructor\nAllison Horst is a Data Scientist Advocate at Observable. Before joining Observable, Allison spent a decade teaching data science, statistics, and data analysis as a teaching faculty member at UC Santa Barbara. She is passionate about empowering learners with data science skills they need to answer questions they care about, developing open educational resources, building and participating in learning communities, and art in data science education.\n\n\nConnect: [Observable](https://observablehq.com/@allisonhorst) | [LinkedIn](https://www.linkedin.com/in/allison-horst/) | [Twitter](https://twitter.com/allison_horst) | [Mastodon](https://mastodon.social/@allison_horst) | [Website](https://allisonhorst.github.io/) | \n[Data science artwork](https://allisonhorst.com/)\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"about","database":"$undefined"},{"id":96,"value":"bannerpaul(\"Interested in learning more about collaborating with data?\", \"Sign up for free\", \"https://observablehq.com/product?utm_medium=social&utm_campaign=sql_course&utm_source=observablehq.com\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"____","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":78,"value":"import {buttonCTA} from \"@observablehq/buttons\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"import {details} from \"@observablehq/callout-boxes\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"import {bannerpaul} from \"@observablehq/coursestyle\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"function localTime(dateString = new Date()) {\n return new Date(dateString).toLocaleString(undefined, {\n weekday: \"long\",\n month: \"short\",\n day: \"numeric\",\n hour: \"numeric\",\n minute: \"numeric\",\n timeZoneName: \"long\"\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"$46","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W47","stdlib":"1"}} 44:"$43:body"