Question

I'm trying to work out whether it is possible to change the icon based on whether the date associated with the marker matches todays

For example, I have a series of events for which I wish to show the location of on a google map (the data is loaded as a fusion-table). I wish to show all of these events but I wish to have a different icon for those events which match the date on which the map is loaded.

Does anyone know of any examples which demonstrate this? I've had a good search but can't find anything.

Update: I've come back to this after working on other stuff but still can't get this to work well. The code posted above works well to create the current date string, but I am then not getting any query that tries to use this string/var to work. I think I must be missing something very obvious, as when I input a date manually into the query everything works as it should.

I've pasted my code snippet below...would be grateful if someone could point out what might be wrong.

var d = new Date();
var mon = d.getMonth() + 1; 
var day = d.getDate(); 
var year = d.getFullYear();
var date_string = '';
 if(mon < 10){
     date_string += "0" + mon; }else{
     date_string += mon; } 
     date_string += '/'; if(day < 10){
     date_string += "0" + day; }else{
     date_string += day; }
  date_string += '/'; year -= 2000;
 date_string += year;
  alert(date_string); 

layer = new google.maps.FusionTablesLayer({
        query: {
            select: 'Latitude',
            from: '3xxxxxx'
        },
        styles: [{ markerOptions: { iconName: "measle_white" } },
         { where: "'Date' = 'date_string'", 
        markerOptions: { iconName: "wht_pushpin"} }, 
        {where: "'Date' <= '05/07/12'", 
        markerOptions: { iconName: "measle_white" } }]


    });
Was it helpful?

Solution

Well the question changed, see comment. But note that if you just want the current date, >= will work for the Fusion Table query, even if = does not.

var d = new Date();
var mon = d.getMonth() + 1;
var day = d.getDate();
var year = d.getFullYear();

var date_string = '';
if(mon < 10){
    date_string += "0" + mon;
}else{
    date_string += mon;
}
date_string += '/';
if(day < 10){
    date_string += "0" + day;
}else{
    date_string += day;
}

date_string += '/';
year -= 2000;
date_string += year;

alert(date_string);

}

OTHER TIPS

It is definitely possible but you have not indicated what if anything you have tried so far. I'm not aware of any examples but there are a number demonstrating using a time slider with Fusion Tables which are probably worth searching on.

I recently answered a question about Fusion Tables datetime filters. The take away is to ensure your Fusion Table column is typed as datetime and also to ensure your dates use the accepted datetime formats.

Here's a code snippet which might accomplish what you want.

var where_date = "where Date = '03/13/12'";
var ftOpts = {
  query: {
     select: location_col,
     from: current_table_id
  },
  styles: [ {
      where: where_date,
      markerOptions:{
          iconName: "small_green"
       },
    },
    {
      markerOptions:{
          iconName: "small_red"
       },
    }
 ]
};

curr_layer = new google.maps.FusionTablesLayer(ftOpts);

curr_layer.setMap(map);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top