Pe: unable to load package.json for csv

Getting: Pe: unable to load package.json when trying to require(@) from a published csv import. Help?

What package are you trying to require? Can you share a notebook that demonstrates the problem?

You might also find this guide helpful:

basically, I’m having trouble actually using any data from a csv upload for creating a visualization. The tutorials I see (all) say to require a dataset

Try this:

data = FileAttachment("A_observ.csv").csv()

Or if you want to parse the dates (which is strongly recommended for subsequent analysis and visualization), you can do something like:

data = {
  const data = await FileAttachment("A_observ.csv").csv();
  const parseDate = d3.utcParse("%Y-%m-%d %H:%M:%S");
  for (const d of data) d["Date Registered"] = parseDate(d["Date Registered"]);
  return data;
}
1 Like

Thank you. I’m simply having trouble even bringing in a simple row count. Guess I have some more learning to do. For instance, where is the actual count in this?:

vegalite({
data: { values: data },
mark: “bar”,
autosize: “fit”,
width: width,
encoding: {
x: {
field: “CSM”,
type: “ordinal”
},
y: {
field: d3.count(“Community”),
type: “quantitative”
}
}
})

I am not sure that I am following your need, whether with Vega Lite, d3.js, or just JS.

you opened this thread about challenges loading data, and i noticed in your notebook that initial error where you were trying to require to cross-reference data stored in another notebook. you’ll want ‘import’ instead:

in you wish to return the a total number of rows using just basic JS, use ‘.length’

here’s a comparison where I made these edits:

If I am understanding the code snippet above correctly (sorry, not great at this stuff), you’re using d3. to try to ‘.count’ the value (string) “CSM”. Testing this in a separate cell by entering d3.count("CSM"), the value returned is 0 - so that is why your bar chart has not height. I don’t see what value you’re trying to get, as the CSM variable is refers to names, and you already use that to label your X axis.

To get something visual for you, I decided to use the ‘Community Id’ variable, which is a number. Your CSV data presents numbers as strings, so first you’ll have to change the format. To do this, I did this:

data_typed = d3.csvParse(await FileAttachment("A_observ.csv").text(), d3.autoType)

Then I referenced this cell instead:

vegalite({
data: { values: data_typed },
mark: “bar”,
autosize: “fit”,
width: width,
encoding: {
x: {
field: “CSM”,
type: “ordinal”
},
y: {
field: “Community Id”,
type: “quantitative”
}
}
})

…gets you part way: