0

I am a student learning web development for cartography. I have been working on a lab to create a map using D3 but can't seem to get my data loaded properly. The CSV data is loaded to the error message in the console in the callback function. How can I figure out what the error is with the CSV file? Here is the snippet from my main.js file:

//use d3.queue to parallelize asynchonrous data loading
d3.queue()
    .defer(d3.csv, "data/dataL2.csv") //load attributes from csv
    .defer(d3.json, "data/wico.topojson") // load choropleth spatial data
    .await(callback); //fires when all data loaded, sends to callback function

function callback(error, csvData, wiCo){
    console.log(error);
    console.log("CSVData is: "+csvData);
    console.log("WICo is: "+wiCo);

I downloaded the libraries to my lib folders and have these scripts in my index.html:

<!File links>
    <script src="lib/topojson/topojson.js"></script>
    <script src="lib/d3-queue/d3-queue.js"></script>
    <script src="lib/d3.js"></script>
    <script src="js/main.js"></script>

And the first few lines of my CSV:

name,fuel97,fuel02,fuel07,fuel12,fert97,fert02,fert07,fert12
Adams,4220,4015,9152,16867,20617,16342,32925,87730
Ashland,1114,1382,3490,4006,1641,1972,7702,6394
Barron,3609,3469,7768,15990,4163,6447,12400,24518
Bayfield,1360,1418,3572,2965,1224,1557,3020,3874
Brown,3029,3358,7880,9737,5015,5948,10127,16081

The error loads the first line after headings. Headings match the values, which I know I will need to convert strings to numbers. I am running the preview on Chrome and Firefox through a local server (Apache on Mamp).

I tried searching but couldn't find how to check what the error is that results in the data not loading properly.

Kirsten Ann Chamberlain
  • 1

0 Answers0