Adapting my JavaScript code to handle one-dimensional CSV data instead of the usual two-dimensional format

Question

Adapting my JavaScript code to handle one-dimensional CSV data instead of the usual two-dimensional format

How can I effectively parse this CSV file using JavaScript?

1363085391,42.890000000000,5.432200000000
1363088879,47.570000000000,4.981800000000
1363120475,56.560000000000,1.768000000000
1363132522,53.000000000000,1.000000000000
1363214378,48.630000000000,4.000000000000
[...]

This displayed data provides a detailed history of bitcoin prices and trade volumes for the Canadian dollar. However, due to the extensive list containing every single trade, I am attempting to condense it from hundreds of daily data points to one each week. Essentially, I aim to simplify the data by aggregating volume and averaging price over specific time intervals. This approach is expected to enhance the appearance of the line in the provided line chart.

Unfortunately, the current script is ineffective; it operates under the assumption that the CSV file is a two-dimensional array when in reality, it seems to be one-dimensional. How can I modify the script to ensure accurate parsing of the CSV data?

function simplifyData(data_set) {
  interval_length = 3600; // hourly intervals

  last_price = 0;
  idx = 0;
  while (idx < data_set.length) {

    // reset value for this interval
    volume = 0;
    price_sum = 0;
    count = 0;
    timestamp = data_set[idx]['timestamp'] + interval_length;

    // get sums for this interval
    while (data_set[idx]['timetamp'] < timestamp) {
      volume += data_set[idx]['volume'];
      price_sum += data_set[idx]['price'];
      count++;
      idx++;
      if (idx >= data_set.length)
        break;
    }

    // get average price
    price = count > 0 ? price_sum / count : last_price;
    last_price = price;

    // add new row to monotized data array
    monotized_data.append([
      timestamp: timestamp,
      volume: volume,
      price: price
    ]);
  }
}

// Format: time (UNIX timestamp), price, amount traded
// http://api.bitcoincharts.com/v1/csv/localbtcCAD.csv.gz
var complexCadCsv = "1363085391,42.890000000000,5.432200000000
1363088879,47.570000000000,4.981800000000
1363120475,56.560000000000,1.768000000000
1363132522,53.000000000000,1.000000000000
1363214378,48.630000000000,4.000000000000
...
";

var finalOutput = simplifyData(complexCadCsv);

$(".new_csv").append(finalOutput);

<!--<script src="https://rawgit.com/evanplaice/jquery-csv/master/src/jquery.csv.min.js"></script>-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>New simplified CSV</h1>
<div class="new_csv"></div>

javascript arrays csv

Answer 1

Answer №1

data_set is in string format, but the simplifyData() function is treating it as an array of objects. To resolve this, you must first convert it into an array.

data_set = data_set.split('\n').map(line => {
    var linearray = line.split(',');
    return {
        timestamp: parseInt(linearray[0], 10),
        price: parseFloat(linearray[1]),
        volume: parseFloat(linearray[2])
    };
});

Also, ensure that when calling monotized_data.append, you use curly braces instead of square brackets and utilize the push() method.

    monotized_data.push({
      timestamp: timestamp,
      volume: volume,
      price: price
    });

function simplifyData(data_set) {
  interval_length = 3600; // hourly intervals

  last_price = 0;
  idx = 0;
  
  monotized_data = []
    
  while (idx < data_set.length) {

    // reset value for this interval
    volume = 0;
    price_sum = 0;
    count = 0;
    
    // Format: time (UNIX timestamp), price, amount traded
    //   timestamp: data_set[idx][0]
    //   price:     data_set[idx][1]
    //   volume:    data_set[idx][2]
    
    timestamp = data_set[idx][0] + interval_length;

    // get sums for this interval
    while (data_set[idx][0] < timestamp) {
      volume += data_set[idx][2];
      price_sum += data_set[idx][1];
      count++;
      idx++;
      if (idx >= data_set.length)
        break;
    }

    // calculate average price
    price = count > 0 ? price_sum / count : last_price;
    last_price = price;

    // add new row to the monotized data array
    monotized_data.push({
      timestamp: timestamp,
      volume: volume,
      price: price
    });
  }
}

// Original CSV Data with timestamps, prices, volumes
var complexCadCsv = `1363085391,42.890000000000,5.432200000000
...
... (truncated for brevity)

// Parse the multi-line CSV string above into a 2D array
var complexCadCsvArray = $.csv.toArrays(complexCadCsv);

...

$(".new_csv").text($.csv.fromObjects(monotized_data));

// Display the original CSV output using jquery-csv
$(".existing_csv").append(complexCadCsvArray);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/evanplaice/jquery-csv/master/src/jquery.csv.min.js"></script>
<h1>New simplified CSV Output</h1>
<pre class="new_csv"></pre>
<h1>Original CSV Processed through <a href="https://github.com/evanplaice/jquery-csv">jquery-csv</a></h1>
<pre class="existing_csv"></pre>

Answer 2

data_set is in string format, but the simplifyData() function is treating it as an array of objects. To resolve this, you must first convert it into an array.

data_set = data_set.split('\n').map(line => {
    var linearray = line.split(',');
    return {
        timestamp: parseInt(linearray[0], 10),
        price: parseFloat(linearray[1]),
        volume: parseFloat(linearray[2])
    };
});

Also, ensure that when calling monotized_data.append, you use curly braces instead of square brackets and utilize the push() method.

    monotized_data.push({
      timestamp: timestamp,
      volume: volume,
      price: price
    });

function simplifyData(data_set) {
  interval_length = 3600; // hourly intervals

  last_price = 0;
  idx = 0;
  
  monotized_data = []
    
  while (idx < data_set.length) {

    // reset value for this interval
    volume = 0;
    price_sum = 0;
    count = 0;
    
    // Format: time (UNIX timestamp), price, amount traded
    //   timestamp: data_set[idx][0]
    //   price:     data_set[idx][1]
    //   volume:    data_set[idx][2]
    
    timestamp = data_set[idx][0] + interval_length;

    // get sums for this interval
    while (data_set[idx][0] < timestamp) {
      volume += data_set[idx][2];
      price_sum += data_set[idx][1];
      count++;
      idx++;
      if (idx >= data_set.length)
        break;
    }

    // calculate average price
    price = count > 0 ? price_sum / count : last_price;
    last_price = price;

    // add new row to the monotized data array
    monotized_data.push({
      timestamp: timestamp,
      volume: volume,
      price: price
    });
  }
}

// Original CSV Data with timestamps, prices, volumes
var complexCadCsv = `1363085391,42.890000000000,5.432200000000
...
... (truncated for brevity)

// Parse the multi-line CSV string above into a 2D array
var complexCadCsvArray = $.csv.toArrays(complexCadCsv);

...

$(".new_csv").text($.csv.fromObjects(monotized_data));

// Display the original CSV output using jquery-csv
$(".existing_csv").append(complexCadCsvArray);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/evanplaice/jquery-csv/master/src/jquery.csv.min.js"></script>
<h1>New simplified CSV Output</h1>
<pre class="new_csv"></pre>
<h1>Original CSV Processed through <a href="https://github.com/evanplaice/jquery-csv">jquery-csv</a></h1>
<pre class="existing_csv"></pre>

Adapting my JavaScript code to handle one-dimensional CSV data instead of the usual two-dimensional format

Answer №1

Similar questions

Synchronization issues arise when attempting to update the localStorage

``Why is my setFeatureState function not updating the value in my Mapbox map

Secure User Authentication using HTML and JavaScript Box

Is there a way to utilize a JavaScript function to transfer several chosen values from a select listbox to a different listbox when a button is clicked?

Discovering the keycode for the GO button in JavascriptDiscovering the keycode

Employing Ajax.Updater to retrieve a javascript file (prototype.js)

What is the best way to toggle a div and dynamically load content into it while it's open?

Saving real-time information to MongoDB with Node.js

The key to creating efficient routers in Express: Don't Repeat Yourself!

Is there a way for me to connect to my Firebase Realtime Database using my Firebase Cloud Function?

Steps for showing an error prompt when input is invalid:

Adjust image size dynamically while keeping the original aspect ratio

Tips for showing HTML content in an Angular UI grid

Using JSON to bind values to an array of checkboxes

What is the method to combine multiple style values in vue.js?

Check to see if the ContentEditable div is currently focused

Updating default values in reactive() functions in Vue 3: A step-by-step guide

Exploring different sections of the website

Creating Angular UI states with parameters in TypeScript

Managing React state with custom objects