0

I have a Python flask server running and it is serving up CSV files to the client on request via a 'POST' request. This part of the project is working perfectly.

On the client, one portion of my script is to take the CSV file and add it to a graph. This task is not complete yet, but I'm getting there. When I started, I decided to plot one piece of data from one section of code. Now that I'm expanding to plotting multiple pieces of data, I'm finding some sort of issue that I don't understand.

The 'csvFileList' array holds integer numbers which correspond to different node numbers that have data to plot.

Data to be plotted is contained in the 'plotData' array. You can see in the for loop within the post request that data is being saved there. The 'rawData' is intended to be a dictionary with keys that correspond to the values within 'csvFileList'. The values will be two-dimensional arrays. Eventually, 'rawData' will be assembled into 'plotData'.

        window.intervalId = setInterval(
        function(){
            /* request data for each CSV file in the file list */
            for(i=0; i < csvFileList.length; i++){
                var nodeNum = csvFileList[i];
                var startTime = 0;
                var endTime = CSV_POLL_INTERVAL;
                var nodeData = [[]];

                /* post request to csvgen URL with the appropriate parameters */
                $.post(
                    "/csvgen",
                    {node_num: nodeNum.toString(), start_time: startTime.toString(), end_time: endTime.toString()},
                    function(data){
                        nodeData = $.csv.toArrays(data);
                        for(j = 0; j < nodeData.length; j++){
                            plotData.push(nodeData[j]);
                            rawData[nodeNum].push(nodeData[j]);
                        }
                    },
                    "text"
                );


            }

            //alert(Object.keys(rawData).length); // finds the number of properties in the object

            /* update the graphs */
            g.updateOptions( { 'file': plotData } );
        },
        UPDATE_INTERVAL
    );

Now that I have the background out of the way, I can give you my observations. When I plot 'plotData', I can look at the plot and see that all three CSV files that I'm processing are sending data into the 'plotData' array. However, when I'm adding the 'rawData' object, nothing is happening on CSV files 1 and 2, only on 3. This is very strange since I can see that data is being plotted from all three files. When I place a breakpoint within the 'function(data)' of the '$.post' request, it only stops when 'nodeNum' is 3 (which is the last one).

So, just to reiterate, I see that data is plotted for nodes 1, 2, and 3, but it appears that 'function(data)' is only being executed on nodeNum = 3. This behavior doesn't make sense.

slightlynybbled
  • 2,408
  • 2
  • 20
  • 38
  • The 'marked as duplicate' was absolutely correct, I am just new enough to javascript that I missed this basic fact. Adding 'var' to each of my for loops corrects the issue. Thank you! – slightlynybbled Jan 04 '16 at 22:00
  • There is - however - still the issue of the 'rawData[nodeNum].push(nodeData[j])' that is only loading the last time around. When I vary the number of nodes, then it will load the last one. In the example above, I was loading three nodes, so 'rawData[3]' ends up full of data, but not [1] or [2]. Any thoughts? – slightlynybbled Jan 04 '16 at 22:07

0 Answers0