3f:null 40:["$","title",null,{"children":"Chart Template Same Cell | John Alexis Guerra Gómez | Observable"}] 46:T6bb,chart = { const target = html`

Example insight

A short description of the chart. Usually what's on the y axis

`; const width = 500, height = 500, svg = d3.select(target).select("#chart") .append("svg") .attr("width", width) .attr("height", height); const margin = ({top: 50, right: 30, bottom: 30, left: 40}), iwidth = width - margin.left - margin.right, iheight = height - margin.top - margin.bottom; const gDrawing = svg.append("g") .attr("transform", `translate(${margin.left}, ${margin.top})`); const x = d3.scaleLinear() .domain([0, 1]) .range([0, iwidth]); const y = d3.scaleLinear() .domain([0, 1]) .range([iheight, 0]); const xAxis = svg => svg .attr("transform", `translate(0,${iheight})`) .call(d3.axisBottom(x)); const yAxis = svg => svg .call(d3.axisLeft(y)); gDrawing.append("g") .call(xAxis) .append("text") .style("fill", "black") .style("font-size", "12pt") .text("xAxis") .style("text-anchor", "end") .attr("transform", `translate(${iwidth}, ${30})`); gDrawing.append("g") .call(yAxis) .append("text") .style("fill", "black") .style("font-size", "12pt") .attr("transform", `translate(${0}, -10)`) .text("yAxis"); return target; }47:[] 44:{"id":"3a50cdd10d94f565","slug":"chart-template-same-cell","title":"Chart Template Same Cell","thumbnail":"6b23b0fc1e2ddd05e2fbfb737005109a01c33280683034631ad9403ac63e8684","access_level":"public","create_time":"$D2019-08-27T16:03:27.447Z","update_time":"$D2020-05-11T21:17:08.470Z","view_time":null,"first_public_time":"$D2019-08-27T16:22:04.440Z","has_unpublished_edits":null,"fork":{"id":"3a5efea5ff65f964","slug":"chart-template","title":"Chart Template","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":2,"starred":false,"owner":{"type":"team","id":"cd3c1e49fc84d010","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":"starter_2024","bio":"I love to build dataviz for insight discovery. I also love to put technology to the service of humanity","following":false},"version":98,"publish_version":98,"role":null,"authored":false,"authors":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null,"bio":"I love to build dataviz for insight discovery. I also love to put technology to the service of humanity","following":false}],"members":[{"type":"individual","id":"be0076fec73aa550","login":"john-guerra","name":"John Alexis Guerra Gómez","avatar_url":"https://avatars-next.observableusercontent.com/21638cee44bb0ea70798da725b57111a5d3e2acebcd14524565992f7d1594aed","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Chart Template Same Cell","cells":[{"id":0,"value":"md`# Chart Template Same Cell\n\nThis notebook demonstrates conventions for basic *xy* charts in D3 with a simple title and description, all in the same cell. Why would you ask? I like it better this way because it makes it easier for me to copy and paste code out of observable. Fork it as a starting point to create your own chart.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"$46","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"d3 = require(\"d3@5\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W47","stdlib":"1"}} 45:"$44:body"