Javascript array to CSV file with a vertical layout

Question

This is my code:

const rows = [
    ['Latitudine', arraylat],
    ['Longitudine', arraylon],
    ['eNb', enodeb_c],
    ['Settori', arraysec],
    ['Latitudine triangolazione', medialat],
    ['Longitudine triangolazione', medialon],
    ['Cell ID', arraycid]
];

let csvContent = "data:text/csv;charset=utf-8,";
rows.forEach(function(rowArray) {
    let row = rowArray.join(",");
    csvContent += row + "\r\n";
});

var encodedUri = encodeURI(csvContent);
var link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "risultati.csv");
document.body.appendChild(link);
var r = confirm("Vuoi scaricare i risultati di questa scansione?");
if (r == true) {
    link.click()
}

This is an example of result:

Latitudine,41.993778,41.98615,41.987926,41.990776,44.990568,41.991343,41.986074,41.989243,41.990582,41.992586,41.984306,41.988581,41.992779,45.050226,41.991281,41.981088,41.98687,41.984337,45.100307,45.052242 Longitudine,14.982664,14.988119,14.980388,14.978545,7.650588,14.986339,14.984338,14.982785,14.981212,14.984188,14.988942,14.982971,14.979936,7.508388,14.984143,14.990461,14.976786,14.978052,7.614061,7.559887 eNb,330628 Settori,0,1,2,3,5,6,7,8,9,12,13,14,15,17,18,19,20,21,22,29 Latitudine triangolazione,42.60055214999999 Longitudine triangolazione,13.50313965 Cell ID,84640768,84640769,84640770,84640771,84640773,84640774,84640775,84640776,84640777,84640780,84640781,84640782,84640783,84640785,84640786,84640787,84640788,84640789,84640790,84640797

I want this result:

Latitudine,Longitudine,eNb,Settori,Latitudine triangolazione,Longitudine triangolazione,Cell id 41.993778,14.982664,330628,0,42.60055214999999,13.50313965,84640768 41.98615, 14.988119...

I found this solution, but I want to do this only with Javascript: [1]: https://i.stack.imgur.com/se0jd.jpg "current" [2]: https://i.stack.imgur.com/tUjDj.jpg "what i would have"

can you explicit how the current result is wrong and what is the pattern you expect ? — Simon Dehaut, Jan 29 '21 at 13:36
@BancoMa it would be more helpful if you could provide a *minimal* example with actual data and the expected result. For example your input might look like `[['Latitudine',[1,2]], [...], ...]` and your output would be some string that clearly shows how the input is transformed to the output. Is my understanding correct that the format of your input array is `[[header, array of column values], ...]`? — Damon, Jan 29 '21 at 15:22
Hi, i uploaded two images. This is my imput data: const rows = [['Latitudine', arraylat], ['Longitudine', arraylon], ['eNb', enodeb_c], ['Settori', arraysec], ['Latitudine triangolazione', medialat], ['Longitudine triangolazione', medialon], ['Cell ID', arraycid] ]; I would like the headers to be placed in the first column of the filel, and the rest in the columns below — BancoMa, Jan 29 '21 at 15:51

Jose Marin · Accepted Answer · 2021-01-29T16:58:39.410

1

I traverse vertically the data. It should work now:

<html>
 <head>
 </head>

<head>
    <meta charset="UTF-8">
    <title>JavaScript Hello World Example</title>
 <body>
    <h1>Hello World<h1>
    <script>

    const inverseMatrix = 
      (matrix) => {
        let matrixInverted = [[]]

        matrix.forEach(
          (innerArray, indexOut) =>
            innerArray.forEach(
              (valueIn, indexIn) => {
                if(matrixInverted[indexIn] === undefined) matrixInverted[indexIn] = []  
                matrixInverted[indexIn][indexOut] = valueIn
              }
            )
        )

        return matrixInverted
      }

      const arraylat = [21312,12312]
      const arraylon = [112,12]
      const enodeb_c = ['asd','dd']
      const arraysec = [91312,82312]
      const medialat = [21312,62312]
      const medialon = [312,72312]
      const arraycid = [212,32312]



      const rows = [
        ['Latitudine', ...arraylat],
        ['Longitudine', ...arraylon],
        ['eNb', ...enodeb_c],
        ['Settori', ...arraysec],
        ['Latitudine triangolazione', ...medialat],
        ['Longitudine triangolazione', ...medialon],
        ['Cell ID', ...arraycid]
      ];

      let csvContent = "data:text/csv;charset=utf-8,";
      inverseMatrix(rows).forEach(function(rowArray) {
        let row = rowArray.join(",");
        csvContent += row + "\r\n";
      });

      var encodedUri = encodeURI(csvContent);
      var link = document.createElement("a");
      link.setAttribute("href", encodedUri);
      link.setAttribute("download", "risultati.csv");
      document.body.appendChild(link);
      var r = confirm("Vuoi scaricare i risultati di questa scansione?");
      if (r == true) {
          link.click()
      }
    </script>
 </body>
</html>

edited Jan 29 '21 at 16:58

answered Jan 29 '21 at 14:32

Jose Marin

802
1
4
15

@BancoMa I tested and my solution worked... let me know if you struggled to add it to your code... and if it solved your problem, remember to mark it as the right answer so other people can learn from your question. – Jose Marin Jan 29 '21 at 15:02
It's a bit hard to tell because we don't have a clear input/output example but I don't believe this is what OP is looking for. This transposes the headers into a row but then treats each array following the header as a row whereas I believe OP is looking for that to be a column. – Damon Jan 29 '21 at 15:17
`rowArray.join is not a function at index.html:803 at Array.forEach () at AllScan (index.html:802) at HTMLButtonElement.onclick (VM80 index.html:878)` I have this error – BancoMa Jan 29 '21 at 16:01
It is quite difficult to work without all the input values. You didn't define the values of arraylat, array.... and so on. I created some ramdom examples. You can post your input values so we can observe if we need to be careful with specific data cases. – Jose Marin Jan 29 '21 at 16:10
As you can see I get this : https://imgur.com/a/5umnxD7.This is what I would like:: https://imgur.com/a/TgJVT0x – BancoMa Jan 29 '21 at 16:14
`var arraylon = []; var arraylat = []; var arraycid = [];var medialon = 0; var medialat = 0; enodeb = $("#enodeb").val(), var arraysec = [];` – BancoMa Jan 29 '21 at 16:16
@BancoMa Put some fixes. Check now to see if works. – Jose Marin Jan 29 '21 at 16:59
Perfect, everything works great. Congratulations – BancoMa Jan 29 '21 at 17:19

Javascript array to CSV file with a vertical layout

1 Answers1