Convert bits per second (BPS) to a readable size format in JS

Question

I have the following graph that shows bits per second over time:

I want to reformat the size format so it would look more readable. In order to do that I have to decide what is the right size format to show.

My data array looks like this:

[2919556699, 2912227197, 3416038936, 2874881968, 2698255215, 2397888873, 2420727173, 2828319752,…]

My Question Is there any logic that is commonly used to decide about a readable size format? If not, what would you suggest to implement in order to decide if to show the data in Kbps / Mbps / Gbps / Tbps?

Answer 1

I dont know if there is a common way to do this but, you can convert your data to more readable status with this function. and credits to this question.

    alert(getReadableFileSizeString(150000000));
    
    function getReadableFileSizeString(fileSizeInBytes) {

    var i = -1;
    var byteUnits = [' kbps', ' Mbps', ' Gbps', ' Tbps', 'Pbps', 'Ebps', 'Zbps', 'Ybps'];
    do {
        fileSizeInBytes = fileSizeInBytes / 1024;
        i++;
    } while (fileSizeInBytes > 1024);

    return Math.max(fileSizeInBytes, 0.1).toFixed(1) + byteUnits[i];
    };

more modern version with es6:

const getReadableFileSizeString = (fileSizeInBytes) => {
    let i = -1;
    const byteUnits = [
      " kbps",
      " Mbps",
      " Gbps",
      " Tbps",
      "Pbps",
      "Ebps",
      "Zbps",
      "Ybps"
    ];
    do {
      fileSizeInBytes = fileSizeInBytes / 1024;
      i++;
    } while (fileSizeInBytes > 1024);

    return Math.max(fileSizeInBytes, 0.1).toFixed(1) + byteUnits[i];
  };

codesandbox