Adding a time slider on a map

Answers

• koogs

  February 2014

  I can't see anything about filtering data on that link, I guess that's left up to you.

  just iterate through your data and only draw the items that are in range. might be an idea to sort the data in date order beforehand and use a binary chop to find the start.
• tnagel

  February 2014

  Yes, you have to do it manually (so, what koogs said).

  What I typically do is use the Joda time library for convenience, store my date properties as DateTime, and then have a simple check if the time of my markers (e.g. your tweets) is within the range of the time slider.

  for (Marker marker : allTweetMarkers) {
    DateTime markerTime = (DateTime) marker.getProperty("dateTime");
    if (markerTime.isAfter(startDateTime) && markerTime.isBefore(endDateTime)) {
      // ...
    }
  }
  

  And then call that either in your draw method each frame, or set visibility of your markers in the timeUpdated() method of the TimeRangeSlider, e.g.

  public void timeUpdated(DateTime startDateTime, DateTime endDateTime) {
    filterMarkersByTime(startDateTime, endDateTime);
  }
  
• divya191

  February 2014

  I am not sure what you mean by "store my date properties as DateTime" . Does it mean that you are getting the value of time at which the seek of the slider is at the moment?

  I am also not sure of where to put this code. For eg, in the code of StyledTimeRangeSliderApp, when timeRangeSlider1.draw(); is called, the seek moves the whole width of the slider without checking any conditions. I am not sure about where to check if the time of my markers is within the range of the time slider.
• tnagel

  February 2014 edited February 2014 Answer ✓

  I meant you could take your date properties from your tweets (which are stored in some type, I don't know, maybe String maybe Date) and convert them to DateTime for convenience. No need to do that, but as my TimeRangeSlider uses those it's very easy to compare then.

  Secondly, the drawing of the slider itself should only be changed if you want to change the style. As I wrote you could put the part where you time-compare your markers (or whatever you store the visual representations of the tweets in) into either the main draw method or into the timeUpdated() method.
• divya191

  February 2014

  I am still not sure about how to compare the tweet timestamp with the current start and end seek positions. Its getting hanged when I am trying to run it.

  void draw()
  {
    TableRow row;
    Location location;
    ScreenPosition position;
    DateTime dataTime;
  
    DateTime startDateTime1 , endDateTime1;
  
    Table data1;
    data1 = loadTable("2013-02-01.csv", "header");
  
      int i, rowCount;
    rowCount = data1.getRowCount();
  
    checkBoundingBox();  // to restrict panning
    map.draw();
  
    //debugDisplay.draw();
  
    image(button, buttonX, buttonY);
    timeRangeSlider1.draw();
  
   for(i = 0; i<rowCount; i++)
    { row = data1.getRow(i);
  
     dataTime = new DateTime(row.getInt("Year"), row.getInt("Month"), row.getInt("Date"), row.getInt("Hour"), row.getInt("Minute"), row.getInt("Second"));
     //println("tweet time :");    println(dataTime);
     startDateTime1 = timeRangeSlider1.getStartDateTime();  //returns the current start time
     endDateTime1 = timeRangeSlider1.getEndDateTime();  //returns the current end time
  
     if (dataTime.isAfter(startDateTime1) && dataTime.isBefore(endDateTime1)) 
     {
        location = new Location(row.getInt("Latitude"), row.getInt("Longitude"));
        position = map.getScreenPosition(location);
        fill(200, 0, 0, 100);
        //float s = map.getZoom();
        ellipse(position.x,position.y, 3, 3);
      }
    }
  }
  
• divya191

  February 2014

  Found my mistake. I initialized the start and end time of the slider incorrectly, therefore no data was ever satisfying the condition.

  Thanks a lot for the help, tnagel.
• tnagel

  February 2014

  Good to hear.

  One note: You should do stuff like loading data only once in setup() and not in draw().
• joaomeirelles

  September 2014 edited September 2014

  very good! thanks!