3e:null 3f:["$","title",null,{"children":"HW 3 Try Again | Patricia Wei | Observable"}] 45:T79c,{ // // create the container SVG element const svg = d3.create('svg') .attr('width', imgWidth) .attr('height', imgHeight); let background = await(await FileAttachment("Location_Map_San_Francisco_Bay_Area.png")).url() const backgroundMap = svg.append('image') .attr('xlink:href', background) .attr('position', 'absolute') .attr('width', imgWidth) .attr('height', imgHeight); console.log("test") const shops = svg.append("g") .attr("id", "shopGroup") .selectAll('circle') .data(data, d => d.alias) .join('circle') .attr("class", "shopCircles") .attr('opacity', 0.75) .attr('fill', 'blue') .attr('cx', d => x(d.x)) .attr('cy', d => y(d.y)) .attr('r', 2); const tooltipGroup = svg.append("g") .attr("id", "tooltip") .style("display", "none") .append("text") .attr("id", "tooltip-text") .attr("x", 5) .attr("y", 15) .attr("font-size", "14px") .attr("font-weight", "bold") .attr("fill", "black") /****** show tooltip and border when hovered over ******/ .on("mouseover", function (event, d) { // <-- need to use the regular function definition to have access to "this" svg.select("#tooltip-text") .text(d.alias); let positionOffest = 8; svg.select("#tooltip") // move the tooltip to where the cursor is .attr("transform", `translate(${d.x + positionOffest}, ${d.y + positionOffest})`) .style("display", "block"); // make tooltip visible d3.select(this) .attr("stroke", "#333333") .attr("stroke-width", 2); }) .on("mouseout", function (event, d) { svg.select("#tooltip").style("display", "none"); // hide tooltip d3.select(this).attr("stroke", "none"); // undo the stroke }); return svg.node(); }46:[{"id":"760a6cee0d4121272cb021cbfc3a4af3937c861d4f97898b156a1fa743d8c94238de7d5b89eb021ee57cd9a5795d38320f973e3736a646e2d68a12ad24285b64","href":"https://static.observableusercontent.com/files/760a6cee0d4121272cb021cbfc3a4af3937c861d4f97898b156a1fa743d8c94238de7d5b89eb021ee57cd9a5795d38320f973e3736a646e2d68a12ad24285b64","name":"Map.png","type":"image/png","lastModified":1676588309938.621,"size":470481},{"id":"0a2adb1dfc23cd1dda16b5d32f75e0bfed57711d760e5bd1ef6664167f605de3b97c97088c9f65f038b90d359fd37eb6999fc4582b7600a82685b7a057aeb305","href":"https://static.observableusercontent.com/files/0a2adb1dfc23cd1dda16b5d32f75e0bfed57711d760e5bd1ef6664167f605de3b97c97088c9f65f038b90d359fd37eb6999fc4582b7600a82685b7a057aeb305","name":"Location_Map_San_Francisco_Bay_Area.png","type":"image/png","lastModified":1676590504611.706,"size":278576},{"id":"58091ba96cf489438d2089a31decf06f0a16ea4fc10fa51e5fc068cb2564397d12581f7f2e265b59a81e690d6f34afa69ff2bff45a0da7be295fcc41044aa429","href":"https://static.observableusercontent.com/files/58091ba96cf489438d2089a31decf06f0a16ea4fc10fa51e5fc068cb2564397d12581f7f2e265b59a81e690d6f34afa69ff2bff45a0da7be295fcc41044aa429","name":"asst3_yelp.csv","type":"text/csv","lastModified":1676483230259.954,"size":3027302},{"id":"cf96fd1587bc87b368f25899084aaa5e2641bec88643e88a5c9b3d7bab632e720321a4f28482d828fd8a6404397447c3c775c16a5c39765decdbdcf5c008311e","href":"https://static.observableusercontent.com/files/cf96fd1587bc87b368f25899084aaa5e2641bec88643e88a5c9b3d7bab632e720321a4f28482d828fd8a6404397447c3c775c16a5c39765decdbdcf5c008311e","name":"BayAreaMap.png","type":"image/png","lastModified":1676483529919.064,"size":856408}] 43:{"id":"dad93c2e9cd3ffd1","slug":null,"title":"HW 3 Try Again","thumbnail":"f2b2a4ff8ba5d7bf85ac91776e7565c3f46b8e1a9dead48a31ceb98f1bf1a0a7","access_level":"public","create_time":"$D2023-02-15T17:46:15.161Z","update_time":"$D2023-02-16T23:37:32.978Z","view_time":null,"first_public_time":"$D2023-02-15T17:46:15.161Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"b0f6dfc9af2c5930","login":"patwei","name":"Patricia Wei","avatar_url":"https://avatars-next.observableusercontent.com/5f13dd670aa34cbd0b4cce90b65b4a66138af9d0d8652251ad39fc6189142f19","tier":"starter_2024","bio":"","following":false},"version":134,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"6b7382ee17c14d02","login":"patwei","name":"Patricia Wei","avatar_url":"https://avatars-next.observableusercontent.com/5f13dd670aa34cbd0b4cce90b65b4a66138af9d0d8652251ad39fc6189142f19","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"6b7382ee17c14d02","login":"patwei","name":"Patricia Wei","avatar_url":"https://avatars-next.observableusercontent.com/5f13dd670aa34cbd0b4cce90b65b4a66138af9d0d8652251ad39fc6189142f19","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"HW 3 Try Again","cells":[{"id":0,"value":"# HW 3 Try Again","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":25,"value":"\n ${await FileAttachment(\"BayAreaMap.png\").image()}\n

Image: Salvador Dali

\n \n","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":60,"value":"

\n \n \n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":102,"value":"imgWidth = 524","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"imgHeight = 636","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"$45","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"// Draw the circles on the map based on x and y coordinates \nx = d3.scaleLinear()\n .domain([38.2033, 37.1897])\n .range([0,imgWidth])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"y = d3.scaleLinear()\n .domain([-122.6445, -121.5871])\n .range([0, imgHeight])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"// Data Parsing\ndata = FileAttachment(\"asst3_yelp.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"groupByCoord = d3.groups(data, d => d.coordinates);","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"{\n for (let i = 0; i < data.length; i++) {\n let coords = data[i].coordinates.split(\",\"); \n let x = parseFloat(coords[0]);\n let y = parseFloat(coords[1]);\n // let xCoord = x - 37.91;\n // let yCoord = y + 122.76;\n data[i].x = x;\n data[i].y = y; \n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":37,"value":"data","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"

\n \n \n ${await FileAttachment(\"BayAreaMap.png\").image()}\n

Image: Bay Area Map

\n \n

","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":65,"value":"

\n \n