2b:null 2c:["$","title",null,{"children":"Plot: Horizontal bar chart with a label | Shruti Mukhtyar | Observable"}] 31:[{"id":"018ef089888e0670bc586e294de66b08929321ec00e273feca2aabaec75eff3ed5e1f5d8850b181c09a511f573bc5e40cd74a73753673b505320a1d7363fcff1","href":"https://static.observableusercontent.com/files/018ef089888e0670bc586e294de66b08929321ec00e273feca2aabaec75eff3ed5e1f5d8850b181c09a511f573bc5e40cd74a73753673b505320a1d7363fcff1","name":"CAF Funding 2022-23@3.csv","type":"text/csv","lastModified":1690090575272.301,"size":205}] 2f:{"id":"ee5b68332aa5787e","slug":null,"title":"Plot: Horizontal bar chart with a label","thumbnail":"a809fe14525af4740611b74f4aeb68c4da98141f609743807b3fcb848c7f2bbf","access_level":"public","create_time":"$D2023-07-23T05:04:46.646Z","update_time":"$D2023-07-28T15:53:14.661Z","view_time":null,"first_public_time":"$D2023-07-23T05:04:46.646Z","fork":{"id":"c4f34b9bbcafe892","slug":"plot-horizontal-bar-chart-with-label","title":"Plot: Horizontal bar chart with a label","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"6636080f8b9f94b8","login":"mukhtyar","name":"Shruti Mukhtyar","avatar_url":"https://avatars-next.observableusercontent.com/08866aede922340418a14d406e76cdc15a8cfdb7a4263c0b867f4849e201d799","tier":"starter_2024"},"version":119,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"128dbd1b0f303cd6","login":"mukhtyar","name":"Shruti Mukhtyar","avatar_url":"https://avatars-next.observableusercontent.com/08866aede922340418a14d406e76cdc15a8cfdb7a4263c0b867f4849e201d799","tier":null}],"members":[{"type":"individual","id":"128dbd1b0f303cd6","login":"mukhtyar","name":"Shruti Mukhtyar","avatar_url":"https://avatars-next.observableusercontent.com/08866aede922340418a14d406e76cdc15a8cfdb7a4263c0b867f4849e201d799","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Plot: Horizontal bar chart with a label","cells":[{"id":4,"value":"

Plot: Horizontal bar chart with a label

Observable Plot › Gallery

\n\n# Horizontal bar chart with a label\n\nHere is one way to set labels atop a [bar](https://observablehq.com/plot/marks/bar) mark; for more, see [these variants](https://observablehq.com/@observablehq/plot-labelled-horizontal-bar-chart-variants). Data: Interbrand. Market value of 10 top global brands in 2018, in millions of dollars. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"Plot.plot({\n marginLeft: 280,\n marginRight: 20,\n //marginTop: 55,\n height: 250,\n style: {\n fontSize: \"18px\",\n background: \"transparent\",\n fontWeight: 400,\n },\n x: { axis: null },\n y: { label: null },\n marks: [\n // Draw title\n // Plot.text(['CAF Grants for 2022-23 School Year'], {\n // frameAnchor: \"top-left\",\n // dy: -50,\n // dx: -250,\n // fontSize: \"30px\",\n // fontWeight: \"600\",\n // }),\n \n Plot.barX(funding, {\n x: d3.max(funding, d => d.value),\n y: \"category\",\n fill: \"#e5e5e5\",\n insetTop: 2,\n insetBottom: 2\n }),\n \n Plot.barX(funding, {\n x: \"value\",\n y: \"category\",\n sort: { y: \"x\", reverse: true },\n fill: \"#036eb0\",\n insetTop: 2,\n insetBottom: 2\n }),\n\n Plot.text(funding, {\n text: d => `${d.value}%`,\n x: \"value\",\n y: \"category\",\n textAnchor: \"end\",\n dx: -4,\n fill: \"white\",\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"funding = FileAttachment(\"CAF Funding 2022-23@3.csv\").csv({typed: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"