Read CSV file from Local File system - beginner

17,941 views
Skip to first unread message

santosh kumar

unread,
May 13, 2013, 2:20:31 AM5/13/13
to d3...@googlegroups.com


Hi All,


I am trying to use read a csv from local file system is it possible to read csv like below.

d3
.csv("C:/file.csv")

if not, where should i save the csv to make d3.csv read data

Regards,
Santosh


yang...@gmail.com

unread,
May 13, 2013, 1:56:45 PM5/13/13
to d3...@googlegroups.com
Hi Santosh,

You can put the csv file in the same folder as the html file that runs your D3 javascript code, and change your code to something like d3.csv("file.csv")

Hope this helps!

Yang

Andy Thornton

unread,
May 13, 2013, 1:59:23 PM5/13/13
to d3...@googlegroups.com
This assumes you have a web server running. From https://github.com/mbostock/d3/wiki

When developing locally, note that your browser may enforce strict permissions for reading files out of the local file system. If you use d3.xhr locally (including d3.json et al.), you must have a local web server. For example, you can run Python's built-in server:

python -m SimpleHTTPServer 8888 &

or for Python 3+


python -m http.server 8888 &

Once this is running, go to http://localhost:8888/.




--
You received this message because you are subscribed to the Google Groups "d3-js" group.
To unsubscribe from this group and stop receiving emails from it, send an email to d3-js+un...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

marc fawzi

unread,
May 13, 2013, 2:01:59 PM5/13/13
to d3...@googlegroups.com
you do need to run a local web server, like with "python -m SimpleHTTPServer 8080" or no port for default port 80

otherwise, you can paste the data as a whole inside some custom DOM element like <data></data> (or a div with display style property set to none) and get the innerHTML of that element to pass as the data


John Delacour

unread,
May 13, 2013, 5:58:17 PM5/13/13
to d3...@googlegroups.com
On 12/5/13 at 07:20, santo...@gmail.com (santosh kumar) wrote:


>I am trying to use read a csv from local file system is it
>possible to read csv like below.
>
>d3.csv("C:/file.csv")
>if not, where should i save the csv to make d3.csv read data

You need a relative path. The easiest way is to have the .csv
file in the same directory/folder as the main file and refer to
it simply by name. Or you could have it in a sub-directory
named “stuff” and refer to it as “stuff/test.csv”

Others have said you need to be running a local web server.
This may be the case in Windows but on the Mac it is only Chrome
and Opera that will protest; Webkit, Safari and Firefox will do
it. Try this:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="http://d3js.org/d3.v3.min.js"></script>
</head>
<h1 id="output">
</h1>
<script>
/*
THIS FILE: “index.html”
CONTENTS OF file “test.csv” saved in the same directory as this:
Name,Surname,Age
Joe,Smith,42
Alice,Jones,29
*/
var rows, f = "test.csv"
var parts = d3.csv(f, function(d) {
return {
Name: d.Name, Surname: d.Surname, Age: d.Age,
};
}, function(error, rows) {
d3.select("#output")
.text(
rows[0].Name + " " +
rows[0].Surname + " " +
"is " + rows[0].Age + " years old")
});
</script>
</html>

John Delacour

unread,
May 13, 2013, 6:08:17 PM5/13/13
to d3...@googlegroups.com
On 13/5/13 at 22:58, J...@BD8.com (John Delacour) wrote:

>Try this:
>
><!DOCTYPE html>
><html lang="en">...

I've put the working example here:

<http://bl.ocks.org/JohnDelacour/5571901>

JD

Reply all
Reply to author
Forward
0 new messages