reading csv file

Bootstrap Studio Help
1

Hi guys.

Just got BSS and I am enjoying it very much so far.

I am trying to read a local CSV file that I stored in assets/img/data/data.csv. Not sure this is the best place though. Anyway, I am trying

d3.csv("/data/data.csv", function(data) {
  console.log(data[0]);
});

No success. I got this: GET http://127.0.0.1:58237/data/data.csv 404 (Not Found)

Any suggestion?

Thanks,

2

When you export, essentially you export to a root folder. That root folder contains (if you didn't add folders in the app) any pages themselves and an assets folder. In the assets folder are the breakdown of the apps Design pane menu sections and files (pretty much).

Root (127.0.0.1:[port#])
|
|_ index.html
|
|_ assets
  |
  |_ bootstrap
  | |
  | |_ css
  | | |
  | | |_ bootstrap.css
  | |
  | |_ js
  |   |
  |   |_ bootstrap.js
  |
  |_ css
  | |
  | |_ styles.css
  |
  |_ img
  | |
  | |_ data
  | | |
  | | |_ data.csv
  | |
  | |_ img1.jpg
  | |_ img2.jpg
  |  
  |_ js
    |
    |_ jquery.js
    |_ scripts.js

So if you created a folder in the assets/img path without the app knowing about it, you have to also then state the path in your code that also includes the assets/img part of the path so it should be assets/img/data/data.csv.

d3.csv("/assets/img/data/data.csv", function(data) {
  console.log(data[0]);
});

I would think that would work. I personally like to start with / to signify "starting from the root". Otherwise without it, it assumes that assets exists in whatever current folder you are in. It just happens to be that without specifying subfolders for pages you're always going to be at the root level for pages.

I would have just created the data folder as a subfolder of assets rather than img folder because it doesn't really have anything to do with images.

Saj

3

I think I got it, but I am still facing the same problem, look:

GET http://9.18.137.215:54426/assets/data/data.csv 404 (Not Found).

Do I need to give BSS permission to access this new folder? Also, I didn't get how to create a new folder right inside BSS. The Design panel only lets me create new folders inside predefined folders.

Thanks a lot.

4

I'm assuming your using the app's Preview browser URL so technically I was referring to once you've exported the site and viewing it from out side the apps control.

Since you are using the app, it's own inner web server doesn't know about that file because you can't add it to the app it's self. There's no way to import it into the app as a .csv file. If it was a file already accessible on the internet, you can than absolute(ly) path to it though.

d3.csv("http://www.my-csv-resides-here.com/data/data.csv", function(data) {
  console.log(data[0]);
});

The the app's Preview browser process will be able to access it, but the app it's self can't because it doesn't allow JS code to run within it's self.

If you open the .csv file in something like a plain text editor say Wordpad and it doesn't look like a bunch of cryptic junk but straight up words or numbers separated by commas, then you could try saving it as a .html file and then try importing that into the app and then reference it as .html in the app rather than .csv. That might work but not guaranteed. :)

I will often use .js for my JSON file so I can import it into the app so I can use it from the Preview browser process. Then when I'm done I can go back and correct the URL that the server would use. So maybe that's something you can do with the .csv file as well.

Saj