Loading...
Logo
Processing Forum
I'm completely new to processing, and have set myself a project to help me learn. I'm making an interactive map of the counties of England.

I've opted for using an SVG with each county as a shape within the SVG. I have all the names of the counties, along with some data, stored in a 2D array. The names in the array correspond to the names of the county shapes in the SVG.

I would like to create all the county shapes using a loop, and then I can change their colours etc. to represent data. I've tried to do this by creating a PShape array and making each shape in the SVG an object using a loop with getChild(), but it doesn't work...

Copy code
  1. PShape UKmap;
  2. PShape[] counties = new PShape[49];
  3. int x = 40;
  4. String lines[];
  5. String [][] csv;
  6. int csvWidth=0;
  7. int mapX = width/2+250;
  8. int mapY = height/2+50;
  9. int mapSize = 600;

  10. void setup() {
  11.   size(1280, 800);
  12.   UKmap = loadShape("UK_counties.svg");
  13.   stroke(0);
  14.   fill(0, 150, 0);
  15.   smooth();
  16.   shapeMode(CENTER);
  17.   //for importing csv files into a 2d array
  18.   //by che-wei wang
  19.   lines = loadStrings("UK counties.csv");
  20.   //calculate max width of csv file
  21.   for (int i=0; i < lines.length; i++) {
  22.     String [] chars=split(lines[i], ',');
  23.     if (chars.length>csvWidth) {
  24.       csvWidth=chars.length;
  25.     }
  26.   }

  27.   //create csv array based on # of rows and columns in csv file
  28.   csv = new String [lines.length][csvWidth];

  29.   //parse values into 2d array
  30.   for (int i=0; i < lines.length; i++) {
  31.     String [] temp = new String [lines.length];
  32.     temp= split(lines[i], ',');
  33.     for (int j=0; j < temp.length; j++) {
  34.       csv[i][j]=temp[j];
  35.     }
  36.   }
  37.   
  38.   //draw the country map
  39.   shape(UKmap, mapX, mapY, mapSize, mapSize);
  40.   //create each county
  41.   for (int i=1; i < lines.length+1; i++) {
  42.     //    counties[i] = new PShape();
  43.     counties[i] = UKmap.getChild(csv[i][0]);
  44.     //colour each county according to pop. density
  45.     fill(map(int(csv[i][2]), 0, 9000, 255, 0), 0, 0);
  46.     //draw the counties
  47.     shape(counties[i], mapX, mapY, mapSize, mapSize);
  48.   }
  49. }

  50. void draw() {
  51. }
This gives me a NullPointerException, and I presume that's because the county shapes aren't being created. How can I name each one using the names from my array?

Replies(1)

OK, well I managed to solve the problem by working from the only example I could find,  this map of arrivals in Australia.

Here's my current working code in case anyone else has a similar problem:

Copy code
  1. PShape worldMap;
  2. PShape[] countries;
  3. int numctries; //count number of countries

  4. void setup() {
  5.   size(800, 400);
  6.   
  7.   //load the map
  8.   worldMap = loadShape("world.svg");
  9.   parseMap();
  10.   smooth();
  11. }

  12. void draw() {
  13.   background(200);
  14.   drawMap();
  15. }

  16. void parseMap() {
  17.   numctries = worldMap.getChildCount(); //count number of child shapes on map
  18.   countries = new PShape[numctries];
  19.   countryCodes = new String[numctries];
  20.   worldMap.disableStyle(); //turn off styles for whole map
  21.   
  22.   //make country objects
  23.   for (int i = 0; i < numctries; i++) {
  24.     countries[i] = worldMap.getChild(i);
  25.   }
  26. }

  27. void drawMap() {
  28.   for (int i = 0; i < numctries; i++) {
  29.     countries[i].disableStyle();
  30.     fill(100,99);
  31.     stroke(0);
  32.     strokeWeight(1);
  33.     shape(countries[i]);
  34.   }
  35. }