{tooltipFormat(xValue(d))}

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_125":-5,"_62":16,"_126":-5,"_127":128,"_129":130},"routes/viz-public",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":16,"_18":16,"_19":-5,"_20":21,"_22":16,"_23":24,"_25":26,"_27":-5,"_28":29,"_30":16,"_31":32,"_33":-5,"_34":35},"vizInfo",{"_42":71,"_104":71,"_44":105,"_106":-7,"_107":52,"_108":50,"_109":-5,"_110":111,"_112":16,"_113":114,"_115":116,"_117":43,"_118":-7,"_68":119,"_70":120,"_121":-5,"_122":67,"_123":124},"vizContent",{"_42":71,"_72":73,"_28":29},"ownerAccount",{"_42":50,"_51":52,"_53":54,"_55":54,"_56":57,"_58":59,"_60":61,"_62":16,"_63":-7,"_64":41,"_65":41,"_66":67,"_68":69,"_70":69},"isOwner",false,"isAuthenticated","canCreatePrivate","commitId","similarVizzes",[],"embed","forksCount",0,"forkedFromViz",{"_42":43,"_44":45,"_46":47,"_48":49},"runtimeVersion","license","MIT","descriptionIsAiGenerated","sourceProvenance",{"_36":37,"_38":39,"_28":29,"_40":41},"project","socialImageUrl","https://next.vizhub.com/assets/unfurl.webp","sourceType","v3","originalUrl","https://vizhub.com/kohalireddypatel/e012e7fa0a544b20b5950383384883d8","author","kohalireddypatel","id","1cb07e91ab2143cc9fe0327d0c404542","title","Activity-6","ownerHandle","Sunnyvulli","ownerDisplayName","vullihanumantharao@gmail.com","v3-user-kohalireddypatel","accountType","user","email","SreeKohaliPatel@my.unt.edu","displayName","avatar","https://avatars.githubusercontent.com/u/164100239?v=4","oauthProvider","github","oauthId","164100239","isAdmin","stripeCustomerId","handle","handleNormalized","lifecycleEmailsEnabled",true,"createdAt",1791491365493,"updatedAt","e012e7fa0a544b20b5950383384883d8","files",{"_74":75,"_76":77,"_78":79,"_80":81,"_82":83,"_84":85,"_86":87},"32926589",{"_88":102,"_90":103},"98145232",{"_88":100,"_90":101},"270fdb6c",{"_88":98,"_90":99},"29fbc049",{"_88":96,"_90":97},"8dbc301e",{"_88":94,"_90":95},"b809c858",{"_88":92,"_90":93},"c9ba7f63",{"_88":89,"_90":91},"name","marks.js","text","export const Marks = ({\n data,\n xScale,\n yScale,\n xValue,\n yValue,\n tooltipFormat,\n}) =>\n data.map((d) => (\n \n {tooltipFormat(xValue(d))}\n \n ));\n","useData.js","import React, { useState, useEffect } from 'react';\nimport { csv } from 'd3';\n\nconst csvUrl =\n 'https://raw.githubusercontent.com/INDU1998-GIT/datasets/main/Activity7_Population.csv';\n\nexport const useData = () => {\n const [data, setData] = useState(null);\n\n useEffect(() => {\n const row = (d) => {\n d.Population = +d['2020'] * 1000;\n return d;\n };\n csv(csvUrl, row).then((data) => {\n setData(data.slice(0, 30));\n });\n }, []);\n\n return data;\n};\n","index.html","\n\n \n Activity 7\n \n \n \n \n \n \n \n

\n \n \n\n","README.md","A demonstration of how to start using D3 version 6.\n\n

Activity6_Population-1