🏠 back to Observable

CSV supplying data to input | extreme newbie: stumbling over basics


#1

Hi Community.

Thanks to everyone for being amazing. I come to Observable daily to read and learn.

I am slowly teaching myself, and still I stumble over basic concepts (extreme fundamentals). I appeal to your help because, well, people here are nice! Thank you.

I am learning how to query a data table to populate dropdown options. To start, I though it would be fun to try to read these data from a CSV, which supplies attributes for a single variable, like this:

viewof case_status_dropdown = select({
  title: "Status",
  description: "Drop down to filter.",
  options: case_status_data,
  value: "Active"
})
case_status_data = d3.csvParse(`
Active, Closed
`)

Turns out this isn’t as simple as I expected.

I would ideally like to name just a data attribute and edit a comma separated list to add or remove dropdown options.

Can someone help me to better understand how to call in data from a CSV? I would also appreciate pointers for beginners on how to read points within a CSV, such as value of a particular status or attribute of a given case.

Here’s where I am at, having read and learned from Jeremy:

Other references:


#2

It looks to me like your CSV data isn’t formatted properly. In particular, if you start your CSV string with an empty line, then the column names will be empty and it will be hard to extract the data from the list of objects that d3.csvparse returns. Also, spaces after the commas will be included in the data fields, so they should usually be avoided.

See the beginning of the SO answer you linked in your notebook.

Here’s a fork which might help:

Let me know if I should explain more!


#3

Thanks Bryan!

This does help a lot. I missed the meaning of the part of the Stack Overflow dialog that was talking about CSV field names. Your explanation and example clarified a lot. Thanks for your time and patience!

By the way - I caught your notebook ‘’ Importing data from Google Spreadsheets into a notebook / webpage" a while back – thanks for making and sharing it! As you can see, I am still struggling quite a bit as I learn the ways of data and the Internet. I haven’t started much to work with databases. I appreciate your help to present a solution that would covert a spreadsheet into an ad hoc database without needed to use something more advanced, like SQL.

Thanks again!!


#4

Glad I could help! And yeah, I stumbled upon the Google spreadsheets stuff when I was looking into an easy data solution for an a website a friend was involved with. Observable made it fun and easy to prototype, so I figured it was only fair to share what I learned here.

Happy Thanksgiving!