JavaScript + Data

New Data for Our 'For Loop'

We know that 'for Loops' are a great way to work with 'collections' of data. So converting a table of data to a JSON collection is where we will start.

We will download some census data from the American Community Survey. Our 'table' in CSV format must be converterd to a 'collection' for us to work with it using JavaScript.

CSV to JSON (to JS)

Tables of data can be converted to JSON collections using basic scripting, utilities or helper websites like 'CSV to JSON'. Let's do it the easy way, with the helper website for now...

Each table row will become an object, and each column becomes a 'key' name with an associated 'value'.

Finally, we will add a 'var' name to our data and save it as a JS file -- a javascript file that we can easily import into our project.

UI (User Interface) Elements to Access the Data

We can use UI elements, like buttons, hyperlinks, menus, interactive maps, etc. as a way for users to access pieces of the data. Let's try using a dropdown menu to access a row or a state in our data.