Use multiple rows as column header for danfo - javascript

My excel table looks like this: Excel file Snip
I exported it as CSV file. and it looks like this: CSV file snip
I read this csv file using below method:
const dfd = require("danfojs");
var df;
df = dfd.readCSV("assets/temp-files/sample.csv");
df.print();
The above code prints the df in browser console like this: df print in browser console
As in the above console snip, it is missing ID, Name, Payment columns as well as it is only including the first sub-header column under headers "Contact Info" & "Food Preferences".
I want all the columns in the danfo dataframe and print should show all the sub-headers under each header as it is in the excel.

Related

converting csv to json and then parsing it in javascript

I have a python script which converts a csv file to json.
import csv
import json
# Function to convert a CSV to JSON
# Takes the file paths as arguments
def make_json(csvFilePath, jsonFilePath):
# create a dictionary
data = {}
# Open a csv reader called DictReader
with open(csvFilePath, encoding='utf-8') as csvf:
csvReader = csv.DictReader(csvf)
# Convert each row into a dictionary
# and add it to data
for rows in csvReader:
# Assuming a column named 'No' to
# be the primary key
key = rows['issue']
data[key] = rows
# Open a json writer, and use the json.dumps()
# function to dump data
with open(jsonFilePath, 'w', encoding='utf-8') as jsonf:
jsonf.write(json.dumps(data, indent=4))
# Driver Code
# Decide the two file paths according to your
# computer system
csvFilePath = r'Names.csv'
jsonFilePath = r'Names.json'
# Call the make_json function
make_json(csvFilePath, jsonFilePath)
my csv file is like this
issue, summary, desc
A1, summ1, desc1
A2, summ2, desc2
Once the script is run, I get the following json file
{
"A1": {
"issue": "A1",
" summary": " summ1",
" desc": " desc1"
},
"A2": {
"issue": "A2",
" summary": " summ2",
" desc": " desc2 "
}
}
Now in my javascript application, I want to read this json file and iterate over it. Sample code in my react application is
import myData from <jsonfile>
console.log(myData['A1'].summary)
but for this to work I need to know the value A1, A2 etc..
I am unable to work out how to iterate on this. Please can someone guide me on what a sample javascript code should look like to work with this json.
Operations I want to perform are extract, all issue fields, extract all summary fields etc. Basically work on this json result like it was an array.
for (const k in myData) {
console.log(`${myData[k].issue}: ${myData[k][" summary"]}`);
}
You have spaces in your JSON names:
you have
" summary" instead of "summary".
Fix that, and it will work.

How to make offline plot of all Plotly graphs in the same HTML page?

I'm trying to make a python script using jupyter-notebook, which is fetching data from my website's sql-server and I want to call this script using a javascript function every time the page is loaded. So the page will have the Plotly graphs.
Here is my code:
# coding: utf-8
# In[1]:
#import os
#os.chdir("D:/Datasets/Trell")
# In[2]:
import json
from pandas.io.json import json_normalize
import pandas as pd
import numpy as np
import warnings
warnings.filterwarnings('ignore')
from plotly.offline import init_notebook_mode,plot, iplot
init_notebook_mode(connected=True)
import plotly.graph_objs as go
import plotly.offline as offline
offline.init_notebook_mode()
import plotly.tools as tls
# In[3]:
# importing the requests library
import requests
# api-endpoint
URL = "https://*****.co.in/*****/*******.php"
# location given here
token= '************'
query= 'SELECT userId,createdAt,userName,trails_count,bio FROM users WHERE createdAt >= "2018-07-01"'
# defining a params dict for the parameters to be sent to the API
PARAMS = {'token':token, 'query':query}
# sending get request and saving the response as response object
r = requests.post(url = URL, data = PARAMS)
# In[4]:
data=r.json()
# In[5]:
df=pd.DataFrame(data)
# In[6]:
df.head(1)
# In[7]:
df['date'] = pd.DatetimeIndex(df.createdAt).normalize()
# In[8]:
df['user']=1
# In[9]:
df_user=df.groupby(['date'],as_index=False)['user'].agg('sum')
# In[10]:
data = [go.Scatter( x=df_user['date'], y=df_user['user'] )]
plot(data, filename='time-series.')
# In[11]:
df_user['day_of_week']=df_user['date'].dt.weekday_name
df_newuser_day=df_user.groupby(['day_of_week'],as_index=False)['user'].agg('sum')
df_newuser_day=df_newuser_day.sort_values(['user'],ascending=False)
trace = go.Bar(
x=df_newuser_day['day_of_week'],
y=df_newuser_day.user,
marker=dict(
color="blue",
#colorscale = 'Blues',
reversescale = True
),
)
layout = go.Layout(
title='Days of Week on which max. users register (July)'
)
data = [trace]
fig = go.Figure(data=data, layout=layout)
plot(fig, filename="medal.")
But the problem is that every time the plot() function is executed new HTML tabs are getting open with the filename= mentioned inside the function.
All I want is when I'm executing the file all the graphs come under single HTML page and also I want to give header with <h1> tag before every plot is being so that to the plots are understandable. So is there a way I can do that along with adding of some HTMl and CSS tags before plotly plots so that it looks like a clean webpage with all the plotly graphs along with the headers mentioned under the <h1> tag.
Like I want all the graphs to appear on the same page together one after the other.
P.S. I don't want to use iplot because it plots in the same notebook only and doesn't save the file also.
To make the plots appear in the same page, please use plotly offline's iplot method, instead of plot.
So the statement.
plot(fig, filename="medal.")
will become.
iplot(fig)
If you wish to add HTML before the plot, please use the display and HTML provided by ipython.
from IPython.core.display import display, HTML
display(HTML('<h1>Hello, world!</h1>'))
iplot(fig)
Thus, first we can insert the html first and then plot the graph!
To know more, visit this SO Answer
Late reply: subplots may be the answer to this problem.
For example, to create a subplots of 2 rows and 2 columns,
from plotly import tools
plots = tools.make_subplots(rows=2, cols=2, print_grid=True)

Highcharts Export To CSV With Delimited Columns

I am using the Highcharts EXPORT-CSV plugin to export my chart series data to an Excel File. I have the following code which generates the .CSV file:
{
textKey: 'downloadCSV',
onclick: function () {
this.downloadCSV();
}
}
As a result, when I click the button an excel file is generated but the data is in the following format, everything is in one single column:
DateTime;"CIFQ: DRAYAGE"
04-30-2015;296
05-01-2015;270
05-29-2015;350
06-30-2015;350
07-30-2015;1833
12-14-2015;300
12-18-2015;350
Instead I'd like the data to be separated into two columns using the ';' delimiter. You can see that this is possible from the following jsfiddle if you click the dropdown and select 'Download CSV':
http://jsfiddle.net/highcharts/j4w4s0mw/
How do I get it so that excel separates my data into two separate columns as soon as the file opens?
I figured it out!
The website saying the following:
exporting.csv.itemDelimiter The item delimiter, defaults to ,. Use ;
for direct import to Excel.
But it turns out Excel uses ',' as a column delimiter.

WS response parse to html table

I have a view where I request some info from a web service. I am trying to show the response (xml) as a html table. For this I am using json2html library.
def LeerXMLView(request):
with open("/home/pyc/DjangoProjects/xmlcbs/media/prueba.xml","r") as archivo:
request_data = archivo.read()
target_url = "http://1.1.1.1/services/testservice?wsdl"
headers = {'Content-type':'text/xml'}
data_response = requests.post(target_url, data=request_data, headers=headers).text
jdato = xmltodict.parse(data_response)
data = json2html.convert(json = jdato)
return render_to_response('prueba.html',{'data':data_template})
In the template is displayed as raw text, even when the json2html library add the necessary html tag to print a html table
How can I show the output as a html table instead of plain text in my template
I don't know how to handle the response of the web service to show the data as an html table.
I am not sure I am using in the correct way the json2html lib.
Any advice

How do I extract the external JSON data and put it into a table?

I'm using a plugin called 'tidy table' to display my JSON content. Basically, I want to tabulate the content of the JSON file into a html table, that can be sortable.
The code they've supplied only displays JSON content embedded into it (http://jsfiddle.net/2NH4u/). However, I have an external file I want to include (this is MY code http://jsfiddle.net/NNvSV/).
The code that's tripping me up is:
$.getJSON('onesies.json', function(res) {
// generate HTML table
$('#container')
.TidyTable({
columnTitles : res.headers,
columnValues : res.rows
});

Categories