File handling

Assuming you've seen the Demo and DemoY2, all we need to add is some notes on file handling. If you are testing this on-line then you'll need to download TestFile.csv file to try it out (and set its extension back to .csv if your download sets it to .xls), otherwise it's in your inc folder in the unzipped a-w-2.

The button itself is a File button and requires no coding in terms of being able to get to a file. What we're concerned with is what happens when the file is chosen. Make sure you choose TestFile.csv from the inc folder as it's set up properly. It's a comma separated variable file but it could equally be space or tab separated. The important thing is that it is 3 columns and the first line contains the column headers, x, y1 and y2.

Reading/parsing a file is far too complex for us to code, so we use PapaParse, as does everyone else. When the file is chosen, the code is handleFileSelect which is way too complex to explain - it's just how things are done in JavaScript and like most people, I had to copy/paste. The key thing is that once it's got the data it hands over to LoadData with the text it's retrieved and that's what calls PapaParse. All these things take an unknown time and JavaScript doesn't hang around waiting. Instead, stuff happens "asynchronously" when the task is complete which takes place in papaCompleteFn. Only now do you need to do any coding because this is where you get your real data.

The results from PapaParse end up as a structure in arguments which we extract into theData.data. We loop through each line of theData as theRow and that's where we find our data as theRow.x .y1 and .y2. That's all you need to worry about - you provided the column headers, so whatever you provided, you now retrieve the data via those .headers. It's all very easy and civilized once you accept all the magic of file handling, PapaParse and asynchronous handling.

In this example we just put the data into plotOne and plotTwo, warn CalcIt that the data are coming from a file, and that's it.