htmlwidget fetch local data file

I am writing my first htmlwidget. I can load the text file placed in my library folder using the below code.

HTMLWidgets.widget({

  name: 'myApp',

  type: 'output',

  factory: function(el, width, height) {

    // TODO: define shared variables for this instance
    return {

      renderValue: function(x) {
   
    //Load data file in Library 
    fetch('lib/myApp/./lib/myApp/data.txt')
   .then(response => response.text())
   .then(text => console.log(text));

   },

      resize: function(width, height) {

        // TODO: code to re-render the widget with a new size

      }

    };
  }
});

When I replace the link to a local file for instance: "C:/Users/me/folder/data.txt" it will not load the text file even though I have no problems loading it into Rstudio using:

fileload <- read.csv("C:/Users/me/folder/data.txt")

How can I load local files into the htmlwidget? And how can I do this for instance with a file uploaded to a shiny app?

The idea is that somebody downloads my library and is than able to load a local file or a file uploaded from a Shiny app into the widget. Unfortunatly, I cannot load the data into R and send it as a parameter because it is in a specific file format. Loading it into R changes the formatting making it unreadable.

I never made a widget in this way, but i would assume you would pass the location as a function parameter for your widget?

I can load the the text file in Rstudio using

fileload <- read.csv("C:/Users/me/folder/data.txt")

but when I paste the link as a function parameter to the app it will not load the text file. It looks to me that only files placed in the "htmlwidgets" folder are accessible.

Surely you could answer for yourself if files from within a particular folder or from anywhere in the filesystem are acceptable by trying different locations as you did initially i.e.

  fetch('lib/myApp/./lib/myApp/data.txt')

The idea is that somebody downloads my library and is than able to load a local file or a file uploaded from a Shiny app into the widget. It would be very inconvenient if the user can only use its own data file by placing it in a specific location.

Like I said, I apologise because I haven't dont a HTML widgett, but my limited understanding is that a widget comprises R code, i.e. an R api, and javascript code that is bound to it. So I would think you could use the R code you write to load the files based on user parameters,, and parse it to JSON or someother format, and send that memory object into your javascript as a param along with el, width,height etc.

Yes usually that is not a problem but the file is in a very specific format. The JS library uses a specific parser to read the data. I can't simply read it into R because it will completely change the formatting making it unreadable.

Whether it was a binary or a text file, im sure it can be done. R can read the text as text, or the binary as binary and pass that data onto the javascript portion. ok, transforming to JSON might not be the answer, but you can move the bytes from a file off into memory and pass them to javascript functions

I am trying to send the below text file. The spacing and indentation matters. I have been trying for hours to load it into R and send it as a parameter but every time the formatting is changed.

PYR
CCTOOLS-1205141231

10  9  0  0  0  0  0  0  0  0999 V2000
0.7050   -0.1570    0.0020 C   0  0  0  0  0
1.0530   -1.3180    0.0010 O   0  0  0  0  0
1.6280    0.8220   -0.0020 O   0  0  0  0  0
-0.7460    0.1870    0.0000 C   0  0  0  0  0
-1.0920    1.3440    0.0010 O   0  0  0  0  0
-1.7800   -0.9100   -0.0020 C   0  0  0  0  0
2.5560    0.5510   -0.0050 H   0  0  0  0  0
-1.2810   -1.8790   -0.0020 H   0  0  0  0  0
-2.4040   -0.8220    0.8870 H   0  0  0  0  0
-2.4020   -0.8210   -0.8920 H   0  0  0  0  0
1  2  2  0  0  0
1  3  1  0  0  0
1  4  1  0  0  0
3  7  1  0  0  0
4  5  2  0  0  0
4  6  1  0  0  0
6  8  1  0  0  0
6  9  1  0  0  0
6 10  1  0  0  0
M  END
$$$$

what method have you used ? readLines

yes and any other function I could think off :frowning:

If I paste it like this in JS it works fine:

const fileContent = `PYR
  CCTOOLS-1205141231

 10  9  0  0  0  0  0  0  0  0999 V2000
    0.7050   -0.1570    0.0020 C   0  0  0  0  0
    1.0530   -1.3180    0.0010 O   0  0  0  0  0
    1.6280    0.8220   -0.0020 O   0  0  0  0  0
   -0.7460    0.1870    0.0000 C   0  0  0  0  0
   -1.0920    1.3440    0.0010 O   0  0  0  0  0
   -1.7800   -0.9100   -0.0020 C   0  0  0  0  0
    2.5560    0.5510   -0.0050 H   0  0  0  0  0
   -1.2810   -1.8790   -0.0020 H   0  0  0  0  0
   -2.4040   -0.8220    0.8870 H   0  0  0  0  0
   -2.4020   -0.8210   -0.8920 H   0  0  0  0  0
  1  2  2  0  0  0
  1  3  1  0  0  0
  1  4  1  0  0  0
  3  7  1  0  0  0
  4  5  2  0  0  0
  4  6  1  0  0  0
  6  8  1  0  0  0
  6  9  1  0  0  0
  6 10  1  0  0  0
M  END
$$$$`
contents <- "PYR
CCTOOLS-1205141231

10  9  0  0  0  0  0  0  0  0999 V2000
0.7050   -0.1570    0.0020 C   0  0  0  0  0
1.0530   -1.3180    0.0010 O   0  0  0  0  0
1.6280    0.8220   -0.0020 O   0  0  0  0  0
-0.7460    0.1870    0.0000 C   0  0  0  0  0
-1.0920    1.3440    0.0010 O   0  0  0  0  0
-1.7800   -0.9100   -0.0020 C   0  0  0  0  0
2.5560    0.5510   -0.0050 H   0  0  0  0  0
-1.2810   -1.8790   -0.0020 H   0  0  0  0  0
-2.4040   -0.8220    0.8870 H   0  0  0  0  0
-2.4020   -0.8210   -0.8920 H   0  0  0  0  0
1  2  2  0  0  0
1  3  1  0  0  0
1  4  1  0  0  0
3  7  1  0  0  0
4  5  2  0  0  0
4  6  1  0  0  0
6  8  1  0  0  0
6  9  1  0  0  0
6 10  1  0  0  0
M  END"

myt <- tempfile()

writeLines(contents,myt)

readback <- readLines(myt) %>% paste0(collapse = "\n")

waldo::compare(contents,readback)
√ No differences
1 Like

Thank you so much!!! It works :slight_smile: The problem was that I pasted the text from my JS editor back to Rstudio and this changed the formatting slightly which I did not notice. If I load the data directly from the textfile using your code it worked.

1 Like

That's great. Happy for you :slight_smile:

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.