D3 Example

3e:null 3f:["$","title",null,{"children":"Google Sheets Starter | Graham Waters | Observable"}] 45:[] 43:{"id":"13c7f25ca23e6064","slug":null,"title":"Google Sheets Starter","thumbnail":"c1d4b942e338f820e9306dcd69ec71453096c99ecb5f55c71f23f2ef46eed749","access_level":"public","create_time":"$D2023-04-03T02:55:18.234Z","update_time":"$D2023-04-03T03:05:14.348Z","view_time":null,"first_public_time":"$D2023-04-03T02:55:18.234Z","has_unpublished_edits":null,"fork":{"id":"21d1b3d3e49e8f08","slug":"google-sheets-starter","title":"Google Sheets Starter","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"7a7c1c64b2d532a2","login":"gwatersbusiness","name":"Graham Waters","avatar_url":"https://avatars-next.observableusercontent.com/e69aa55e11c86eec2f93f46b509eb314411ec9907cee072b6109d4deaa8bf4ea","tier":"starter_2024","bio":"","following":false},"version":274,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"03deaefa944e0d11","login":"gwatersbusiness","name":"Graham Waters","avatar_url":"https://avatars-next.observableusercontent.com/e69aa55e11c86eec2f93f46b509eb314411ec9907cee072b6109d4deaa8bf4ea","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"03deaefa944e0d11","login":"gwatersbusiness","name":"Graham Waters","avatar_url":"https://avatars-next.observableusercontent.com/e69aa55e11c86eec2f93f46b509eb314411ec9907cee072b6109d4deaa8bf4ea","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Google Sheets Starter","cells":[{"id":0,"value":"# Google Sheets Starter\n\nPaste a shared Google Sheets URL below to fetch it as a CSV. This example shows [First Ladies of the United States](https://docs.google.com/spreadsheets/d/1G1Wp9ZVq7LO4ZN4YVU-VITY3jPhMxIOsnUh0AeuCwyc/edit#gid=389884841).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"url = \"https://docs.google.com/spreadsheets/d/1Sq3PySCjJ-_ajze3CqVPBsc0zJl_bdYC3inFaSMxSvk/edit?usp=sharing\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"data = d3.csv(getCsvUrl(url), d3.autoType)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":131,"value":"SummaryTable(data)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"// Converts a Google Sheets website URL to its CSV URL. You can also go to “File → Publish to web”, select the “Comma-separated values (.csv)” type, select the sheet with your data, and use that CSV URL directly with `d3.csv` above. If you need data to update faster, try the Google Sheets API: https://stackoverflow.com/questions/30082277/accessing-a-new-style-public-google-sheet-as-json/44479726#44479726\n\ngetCsvUrl = url => {\n url = new URL(url);\n const id = url.pathname.split(\"/\")[3]\n const gid = new URLSearchParams(url.hash.slice(1)).get(\"gid\") || 0;\n return `https://docs.google.com/spreadsheets/d/${id}/export?format=csv&gid=${gid}`\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":233,"value":"import { SummaryTable } from \"@observablehq/summary-table\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"\n\n\n \n D3 Example\n \n\n\n \n\n\n","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":269,"value":"\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W45","stdlib":"1"}} 44:"$43:body"