JavaScript Extracting lines from csv file - javascript

Please help me, I have the below code, I need to extract the start time from row 1 Col 2, and the end time Last row Col2.
Thanks
async function getData() {
let fileName = document.getElementById("myFile").files[0].name;
alert('The file "' + fileName + '" has been selected.');
const response = await fetch("./csv/" + fileName); //fetch csv files from ./csv/folder
const data = await response.text(); // waiting for the filename to be fetched.
const table = data.split("\n").slice(1); // take out the headers
table.forEach((row) => {
const columns = row.split(","); //parse the comma separator
const test_date = columns[1]; //select date column
const test_time = columns[2]; //select time column
const date_time = test_date + test_time; //concatinate date and time column
xlabels.push(date_time); //join and display date and time in one column
const pressure = columns[3]; //select pressure column
yPressure.push(pressure); // display pressure column
const temp = columns[4]; //select temp column
yTemp.push(temp); // display temp column
console.log(test_date, test_time, pressure, temp);
});
}


There are packages available for parsing csv files... Are you doing this server or client side? If you are using nodejs on the backend I've used convert-excel-to-json in the past.. I havent done it on the frontend before but a quick google search found me this guy
converting the excel file to json means its a simple matter of finding your data in the object tree :D


I used this code to print the items in a csv as inputs in HTML. Does this help you get your values? You can use the second js function function createForm(csv) to print the value you want.
document.getElementById("upload").addEventListener("change", upload, false);
var out = "";
function upload(e) {
document.getElementById('csvForm').innerHTML = "";
var data = null;
var file = e.target.files[0];
var reader = new FileReader();
reader.readAsText(file);
reader.onload = function(event) {
var csvData = event.target.result;
var parsedCSV = d3.csv.parseRows(csvData);
parsedCSV.forEach(function(d, i) {
if (i == 0) return true; // skip the header
if (d.constructor === Array) {
createForm(d);
}
});
}
}
function createForm(csv) {
out += '<input value="' + csv[0] + '">'; // first item in the csv
out += '<input value="' + csv[2] + '">'; // third item in the csv
document.getElementById('csvForm').innerHTML = out;
out += '<br>';
}
<script src="https://d3js.org/d3.v3.js"></script>
<input id="upload" type="file">
<form id="csvForm"></form>

Related

Convert entire Google Sheet to xlsx file

I have tried to amend the below script to essentially convert a entire google sheet to xlsx file, keeping tab names the same and locating them to a folder,
The issue I am experiencing with the below is that is is splitting out each tab into separate files but I would like to keep them all together in one file
https://webapps.stackexchange.com/questions/58615/export-all-sheets-in-a-spreadsheet-to-csv-in-google-apps
function saveAsxlsx() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheets = ss.getSheets();
// create a folder from the name of the spreadsheet
var folder = DriveApp.getFolderById('xxxxxxx');
for (var i = 0 ; i < sheets.length ; i++) {
var sheet = sheets[i];
// append ".xlsx" extension to the sheet name
fileName = sheet.getName() + ".xlsx";
// convert all available sheet data to xlsx format
var xlsxFile = convertRangeToxlsxFile_(fileName, sheet);
// create a file in the Docs List with the given name and the xlsx data
folder.createFile(fileName, xlsxFile);
}
Browser.msgBox('Files are waitig in a folder named ' + folder.getName());
}
function convertRangeToxlsxFile_(xlsxFileName, sheet) {
// get available data range in the spreadsheet
var activeRange = sheet.getDataRange();
try {
var data = activeRange.getValues();
var xlsxFile = undefined;
// loop through the data in the range and build a string with the xlsx data
if (data.length > 1) {
var xlsx = "";
for (var row = 0; row < data.length; row++) {
for (var col = 0; col < data[row].length; col++) {
if (data[row][col].toString().indexOf(",") != -1) {
data[row][col] = "\"" + data[row][col] + "\"";
}
}
// join each row's columns
// add a carriage return to end of each row, except for the last one
if (row < data.length-1) {
xlsx += data[row].join(",") + "\r\n";
}
else {
xlsx += data[row];
}
}
xlsxFile = xlsx;
}
return xlsxFile;
}
catch(err) {
Logger.log(err);
Browser.msgBox(err);
}
}

The script you're using was designed to get each sheet as a separate file. You can refer to this example instead that will convert Google Sheet to Excel XLSX Spreadsheet. I added a couple of lines to the code to save the file to a folder instead of sending an email as the example does.
function getGoogleSpreadsheetAsExcel() {
try {
var ss = SpreadsheetApp.getActive();
var url = 'https://docs.google.com/feeds/download/spreadsheets/Export?key=' + ss.getId() + '&exportFormat=xlsx';
var folder = DriveApp.getFolderById('folderID'); //Add the folder ID of the folder where you want to save the file
var params = {
method: 'get',
headers: { Authorization: 'Bearer ' + ScriptApp.getOAuthToken() },
muteHttpExceptions: true,
};
var blob = UrlFetchApp.fetch(url, params).getBlob();
blob.setName(ss.getName() + '.xlsx');
folder.createFile(blob)
} catch (f) {
Logger.log(f.toString());
}
}

How to fetch table data which is currently present on screen using javascript and convert it into csv file

after applying filter in table there are 4 enteries present.How can we store this data and convert it into csv.Currently i am able to dowload full table data using python code.But now i want to fetch and dowload the csv of data which is present on the screen.
========================================================================

function getTableDataFn() {
//we can use any of the get methods based on what we want
let reqTable = document.getElementById("tableId");
//Get rows
let rows = reqTable.rows.length;
//Get columns
let columns = 0;
if (rows > 0)
columns = reqTable.rows[0].cells.length;
let dataInArray = [];
let strVersionOfData = ``;
//Loop through row and column to get data in the object
for (let r = 0; r < rows; r++) {
dataInArray[r] = [];
for (let c = 0; c < columns; c++) {
let tempData = reqTable.rows[r].cells[c].innerHTML;
dataInArray[r][c] = tempData;
strVersionOfData += tempData;
if (c != columns - 1)
strVersionOfData += ",";
}
strVersionOfData += "\n";
}
//Now the dataInArray has all the data and
//strVersionofData has the string
downloadCSVStringFn(strVersionOfData,'mycsv');
}
The above mentioned code might help you to get the data in array and string format. Now if you want to get your csv content downloaded in a file with name you can go by below mentioned function
function downloadCSVStringFn(fileName = "", csvString = "") {
//Encode CSV data
var encodedUri = encodeURI(csvString);
//Create link
var link = document.createElement("a");
//set attributes
link.setAttribute("href", encodedUri);
link.setAttribute("download", fileName + ".csv");
//Append in document
document.body.appendChild(link); // Required for FF
//Click .. this will download
link.click();
//you can further delete the link too .. or have this is a component in case
//you have download as a reusable utility
}

Save Array Values Column wise to CSV file using Javascript

Trying to save my Array values to CSV file column wise using javascript. Right now my code saves the array values row wise.
Current Output -
country1,country2,country3,country4
capital1,capital2,capital3,capital4,
currency1,currency2,currency3,currency4
Required Output -
country1,capital1,currency1
country2,capital2,currency2
country3,capital3,currency3
country4,capital4,currency4
My code so far -
<form>
<input id="download" type="button" value="Download">
</form>
function downloadableCSV(rows) {
var content = "data:text/csv;charset=utf-8,";
rows.forEach(function(column, index) {
content = content + column.join(",") + "\n";
});
return encodeURI(content);
}
var country = ["England","Australia","Mexico","Brazil","Spain","Portugal","Italy","Thailand","Japan"];
var capital = ["London","Canberra","Mexico City","Brasilia","Madrid","Lisbon","Rome","Bangkok","Tokyo"];
var currency = ["Pound","Dollar","peso","Brazilian real","Euro","Euro","Euro","Thai baht","Japanese yen"];
var continent = ["Europe","Australia","NorthAmerica","SouthAmerica","Europe","Europe","Europe","Asia","Asia"];
var language = ["English","English","Spanish","Portuguese","Spainish","Portuguese","Italian","Thailand","Japanese"];
var heading = ["Country","Capital","currency","continent","language"];
var rows = [[heading],[country],[capital],[currency],[continent],[language]];
$("#download").click(function() {
window.open(downloadableCSV(rows));
});
I tried using various functions before but was unsuccessful.Is there a way to implement the required output. Any help would be greatly appreciated.

To group your data you can use zip from lodash (https://lodash.com/docs/4.17.4#zip)
Here is working js code (https://jsbin.com/ditodosime/edit?html,js,output):
function downloadableCSV(heading, rows) {
var content = "data:text/csv;charset=utf-8,";
var dataRows = rows.map(function(columnValues, index) {
return columnValues.join(",");
});
content += heading + "\n" + dataRows.join("\n");
return encodeURI(content);
}
var country = ["England","Australia","Mexico","Brazil","Spain","Portugal","Italy","Thailand","Japan"];
var capital = ["London","Canberra","Mexico City","Brasilia","Madrid","Lisbon","Rome","Bangkok","Tokyo"];
var currency = ["Pound","Dollar","peso","Brazilian real","Euro","Euro","Euro","Thai baht","Japanese yen"];
var continent = ["Europe","Australia","NorthAmerica","SouthAmerica","Europe","Europe","Europe","Asia","Asia"];
var language = ["English","English","Spanish","Portuguese","Spainish","Portuguese","Italian","Thailand","Japanese"];
var heading = ["Country","Capital","currency","continent","language"];
var rows = _.zip(country,capital,currency,continent,language);
window.open(downloadableCSV(heading, rows));

Export JQGrid data to Excel using javascript

I want to download the grid data in csv format , by looking at the link http://jsfiddle.net/hybrid13i/JXrwM/ and using JSONToCSVConvertor($("#reportGrid").jqGrid("getGridParam", "data"),"Report",true);
you can download a csv file but its column name are variable names not label any idea how can i fix this , or there is another solution

You can use $("#reportGrid").jqGrid("getGridParam", "colNames") to get column headers.
By the way you can use jQuery.extend to make copy of the data, returned from $("#reportGrid").jqGrid("getGridParam", "data"), and then modify the data before calling of JSONToCSVConvertor.
UPDATED: The object which you get by $("#reportGrid").jqGrid("getGridParam", "data") is the reference to internal data parameters. So it contains all what it should contains. To have less properties in the items of the data you should first make a copy of the object and the modify it like you want. For example to delete Id property from all items of the data you can do the following:
var myData = $.extend(true, [],
$("#reportGrid").jqGrid("getGridParam", "data"));
$.each(myData, function () { delete this.Id; });
UPDATED: One can use SheetJS, for example, to export data to Excel. See the demo https://jsfiddle.net/OlegKi/ovq05x0c/6/, created for the issue. The corresponding code of the Export to Excel button used in the demo is the following
.jqGrid("navButtonAdd", {
caption: "",
title: "Export to Excel(.XLSX)",
onClickButton: function () {
var data = $(this).jqGrid("getGridParam", "lastSelectedData"), i, item,
dataAsArray = [
["Client", "Date", "Amount", "Tax", "Total", "Closed", "Shipped via"]
];
for (i = 0; i < data.length; i++) {
item = data[i];
dataAsArray.push([
item.name, new Date(item.invdate),
item.amount, item.tax, item.total,
item.closed, item.ship_via
]);
}
var ws_name = "SheetJS", filename = "jqGrid.xlsx";
var wb = XLSX.utils.book_new(),
ws = XLSX.utils.aoa_to_sheet(dataAsArray);
XLSX.utils.book_append_sheet(wb, ws, ws_name);
XLSX.writeFile(wb, filename);
}
});

Thanks to Oleg and the man who posted http://jsfiddle.net/hybrid13i/JXrwM/ with little enhancement in it this is my final solution
function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel,headers,excludeColumns,
fileName) {
//If JSONData is not an object then JSON.parse will parse the JSON string in an Object
var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
var CSV = '';
//Set Report title in first row or line
CSV += ReportTitle + '\r\n\n';
//This condition will generate the Label/Header
if (ShowLabel) {
var row = "";
if(headers)
{
row = headers.join(',');
}
else
{
//This loop will extract the label from 1st index of on array
for (var index in arrData[0]) {
//Now convert each value to string and comma-seprated
row += index + ',';
}
}
row = row.slice(0, -1);
//append Label row with line break
CSV += row + '\r\n';
}
//1st loop is to extract each row
for (var i = 0; i < arrData.length; i++) {
var row = "";
//2nd loop will extract each column and convert it in string comma-seprated
for (var colName in arrData[i]) {
if(excludeColumns && excludeColumns.indexOf(colName))
continue;
row += '"' + arrData[i][colName] + '",';
}
row.slice(0, row.length - 1);
//add a line break after each row
CSV += row + '\r\n';
}
if (CSV == '') {
alert("Invalid data");
return;
}
if(!fileName)
{
//Generate a file name
fileName = "MyReport_";
//this will remove the blank-spaces from the title and replace it with an underscore
fileName += ReportTitle.replace(/ /g,"_");
}
if (navigator.appName == "Microsoft Internet Explorer") {
var oWin = window.open();
oWin.document.write('sep=,\r\n' + CSV);
oWin.document.close();
oWin.document.execCommand('SaveAs', true, fileName + ".csv");
oWin.close();
}
else
{
//Initialize file format you want csv or xls
var uri = 'data:text/csv;charset=utf-8,' + escape(CSV);
// Now the little tricky part.
// you can use either>> window.open(uri);
// but this will not work in some browsers
// or you will not get the correct file extension
//this trick will generate a temp <a /> tag
var link = document.createElement("a");
link.href = uri;
//set the visibility hidden so it will not effect on your web-layout
link.style = "visibility:hidden";
link.download = fileName + ".csv";
//this part will append the anchor tag and remove it after automatic click
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
Usage:
JSONToCSVConvertor($(grid).jqGrid("getGridParam", "data"), $("#reportHeader").text().trim(),true,$(grid).jqGrid("getGridParam", "colNames"),["_id_"],"Report");
NOTE Please note that this solution will not work in IE

Deleting a file in Google Script .setTrashed 'You do not have authorization to perform that action.'

I am trying to create a csv file from a Google spreadsheet every day or so. for some reason, I can delete files using the .setTrashed(True) and the file will delete, but i get an error saying 'You do not have authorization to perform that action. '
here is my code. any help would be appreciated.
function saveAsCSV() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheets = ss.getSheets();
// create a folder from the name of the spreadsheet
var folder = DocsList.getFolder(ss.getName().toLowerCase().replace(/ /g,'_'));
for (var i = 0 ; i < sheets.length ; i++) {
var sheet = sheets[i];
// append ".csv" extension to the sheet name
fileName = sheet.getName() + ".csv";
// convert all available sheet data to csv format
var csvFile = convertRangeToCsvFile_(fileName, sheet);
// update a file in the Docs List with the given name and the csv data
var folder = DocsList.getFolder('fitbitdata_mk3');
folder.createFile(fileName, csvFile);
deleteDocByName('Sheet1.csv');
Logger.log('deleted');
// folder.createFile(fileName, csvFile); //i put it before the delete
}
Browser.msgBox('UPDATED Files are waiting in a folder named ' + folder.getName());
}
function deleteDocByName(fileName){
var docs=DocsList.find(fileName)
for(n=0;n<docs.length;++n){
if(docs[n].getName() == fileName){
var ID = docs[n].getId()
DocsList.getFileById(ID).setTrashed(true)
}
}
}
function convertRangeToCsvFile_(csvFileName, sheet) {
// get available data range in the spreadsheet
var activeRange = sheet.getDataRange();
try {
var data = activeRange.getValues();
var csvFile = undefined;
// loop through the data in the range and build a string with the csv data
if (data.length > 1) {
var csv = "";
for (var row = 0; row < data.length; row++) {
for (var col = 0; col < data[row].length; col++) {
if (data[row][col].toString().indexOf(",") != -1) {
data[row][col] = "\"" + data[row][col] + "\"";
}
}
// join each row's columns
// add a carriage return to end of each row, except for the last one
if (row < data.length-1) {
csv += data[row].join(",") + "\r\n";
}
else {
csv += data[row];
}
}
csvFile = csv;
}
return csvFile;
}
catch(err) {
Logger.log(err);
Browser.msgBox(err);
}
}

I had the same problem. Please star the issue on the issue tracker here.
https://code.google.com/p/google-apps-script-issues/issues/detail?id=4145&colspec=Stars%20Opened%20ID%20Type%20Status%20Summary%20Component%20Owner

Categories