How to set the UTC offset to 0 in an Info Window?

2675
3
06-18-2015 10:13 AM
IanBroad
New Contributor III

I asked a similar question on GIS SE the other day:

Incorrect time displaying in ArcGIS Javascipt popup template

The answer I got worked great for when I was using the PopupTemplate, but I've since switched to using the TooltipDialog or Info Window.

In ArcMap, I have a field called ReadTime of Date data type, and it shows the value:

6/17/2015 2:58:35 PM

I'm using the following formatting for the TooltipDialog:

"<b>Read Time: </b>${ReadTime:DateFormat(datePattern: 'M/d/yyyy hh:mm:ss a', selector:'date')}"

The problem is that in the web map I'm getting the following value:

6/17/2015 7:58:35 AM

So, the time is showing as 7 hours behind.

Is there a similar way I can set the UTC offset to 0, like when I used the PopupTemplate?

0 Kudos
3 Replies
SteveCole
Frequent Contributor

Is the date still being stored in the attribute field as a date value? If so, obtain the value, add (or subtract- I can't remember! ) 7 hours of seconds (25,200), create a new date object base on the corrected date value, and then format the new date.

You can use a date formatting function with TooltipDialogs so it might be best to do that instead of trying to do it all in one line of code like your example above.

function returnContent(attrib) {
  newDate = new Date(eval(attrib.ReadTime + 25200));
  outDate = "<b>Read Time: </b>" + DateFormat(datePattern: 'M/d/yyyy hh:mm:ss a', selector:'date');

  return outDate;
}

I'm using a tooltipDialog in one of my apps and the tooltip does show a date in the tooltip. I used a formatter function to adjust the date stored in the attribute field. The app is still in legacy coding but here's my snippit related to the tooltipDialog:

    this.showSnocoTooltip = function(evt) {
        theAttributes = evt.graphic.attributes;
        theDate = new Date(eval(eval(evt.graphic.attributes.LASTOBS + 28800) * 1000));
        theTime = formatTime(new Date(eval(eval(evt.graphic.attributes.LASTOBS + 28800) * 1000)));
        theHeight = evt.graphic.attributes.READING;
        theContent = returnGagePopupContent(theAttributes);
        var snocoDialog = new dijit.TooltipDialog({id: "snocoTooltipDialog",content: theContent,style: "position: absolute; font: normal normal bold 8pt Tahoma;z-index:100;"});
        snocoDialog.startup();
        dijit.placeOnScreen(snocoDialog.domNode, {x: evt.pageX,y: evt.pageY}, ["TL", "BL"], {x: 5,y: 5});
    }
0 Kudos
VinceAngelo
Esri Esteemed Contributor

Even though Date objects are created in local timezone, JavaScript allows reliable access to UTC hours/minutes/seconds (without hard-coding the local timezone differential)

I wrapped Date creation like like this:

function createUTCDate() {
        var l = new Date();
        return new Date(l.getUTCFullYear(),l.getUTCMonth(),l.getUTCDay(),l.getUTCHours(),l.getUTCMinutes(),l.getUTCSeconds(),0);
}

but you could also format based on the same getters.

- V

0 Kudos
SteveCole
Frequent Contributor

I would also add that the different browsers can treat the same JS date formatting code differently (I'm looking at you, IE)  so check your results in all browsers that your users may use with your application.

For that reason, I use the date.js library for my date formatting.

0 Kudos