Currently, I am experimenting with incorporating geolocation data into a data table using p5. However, I have encountered an issue where p5 is unable to load data from tableRow.get()
. When I print the values of lat
and lon
, it shows them as undefined. What could be causing this problem?
let Soho;
let table;
let lat, lon, xgeo, ygeo;
let mapGeoLeft = -0.1424;
let mapGeoRight = -0.131;
let mapGeoTop = 51.5164;
let mapGeoBottom = 51.5093;
function preload() {
soho = loadImage("cholera.png");
table = loadTable("cholera.csv");
}
function setup() {
createCanvas(600, 600);
background(soho);
}
function draw() {
for (let r = 0; r < table.getRowCount(); r++) {
let tableRow = table.rows[r];
lat = tableRow.get("lat");
lon = tableRow.get("lon");
xgeo = map(lon, mapGeoLeft, mapGeoRight, 0, width);
ygeo = map(lat, mapGeoTop, mapGeoBottom, 0, height);
fill(255, 0, 0);
strokeWeight(0.5);
circle(xgeo, ygeo, 5);
}
print(lat);
noLoop();
}
Here is a snippet showing the first few lines of data from the table:
count,lon,lat
3,-0.13793,51.513418
2,-0.137883,51.513361
1,-0.137853,51.513317
1,-0.137812,51.513262
4,-0.137767,51.513204
2,-0.137537,51.513184