I'm currently working with a time aware layer and I need to get the timeInfo of that layer.
I'm using this method to get the time extent getTimeDefinition() and the result is undefined.
Although in the mapservice link I can find the TimeInfo section with all the details I need as below:
Time Info:
(null)
it just tells me it's undefined when I want to get it using this method. am I missing something?
please help!
Solved! Go to Solution.
Isra,
Are you waiting for the layer to load? Here is a sample:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"> <title></title> <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.16/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } #loading { width:100%; position:absolute; height:400px; background:transparent url("https://dl.dropboxusercontent.com/u/2654618/ajax-gear.gif") center no-repeat; z-index:100; } </style> <script src="//js.arcgis.com/3.16/"></script> <script> var map; require([ "esri/map", "esri/InfoTemplate", "esri/layers/FeatureLayer", "dojo/parser", "dojo/dom-construct", "esri/TimeExtent", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function( Map, InfoTemplate, FeatureLayer, parser, domConstruct, TimeExtent ) { parser.parse(); map = new Map("mapDiv", { basemap: "oceans", center: [-100, 40], zoom: 4 }); // feature service with U2 concerts from 1980 - 2011 var featuresUrl = "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/U2/FeatureServer/0"; var layer = new FeatureLayer(featuresUrl, { id: "u2", infoTemplate: new InfoTemplate( "U2 Concerts: 1980 2011", "Date: ${Date:DateFormat(selector: 'date', fullYear: true)}<br>" + "Venue: ${Venue}, ${City}, ${State}<br>" + "Tour: ${Tour}" ), mode: FeatureLayer.MODE_SNAPSHOT, outFields: ["*"] }); console.info(layer.timeInfo); //This one will be undefined. //layer.setUseMapTime(true); var layerUpdateEnd = layer.on("update-end", function() { console.info(layer.timeInfo); //This one will have an actual value because the layer is loaded. layerUpdateEnd.remove(); // var timeExtent = new TimeExtent(); // timeExtent.startTime = new Date("1/1/1989 UTC"); // map.setTimeExtent(timeExtent); domConstruct.destroy("loading"); }); map.addLayer(layer); } ); </script> </head> <body class="tundra"> <div class="demoLayout" style="height: 100%; width: 100%" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design: 'headline'"> <div class="centerPanel" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'center'"> <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"> <div id="loading"></div> </div> </div> </div> </body> </html>
Isra,
Have you set the layers setUseMapTime method. The layers getTimeDefinition will be undefined unless you have several things in play. Does your map have a timeExtent applied? To get the layers time info as you are seeing in the resy endpoint you use the layers timeInfo property.
Robert,
Yes it has a timeExtent applied but I can only retrieve it using Layer.timeInfo.timeExtent right? and since the timeInfo returns undefined then I can't get the timeExtent. when I use layer.timeInfo or layer.getTimeDefinition() it both returns undefined.
how do I use the setUseMapTime method?
Isra,
Just do:
layer.setUseMapTime (true);
Hey Robert,
thank you for the prompt responses
I tried that but still returns an undefined timeInfo
Isra,
Are you waiting for the layer to load? Here is a sample:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"> <title></title> <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.16/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } #loading { width:100%; position:absolute; height:400px; background:transparent url("https://dl.dropboxusercontent.com/u/2654618/ajax-gear.gif") center no-repeat; z-index:100; } </style> <script src="//js.arcgis.com/3.16/"></script> <script> var map; require([ "esri/map", "esri/InfoTemplate", "esri/layers/FeatureLayer", "dojo/parser", "dojo/dom-construct", "esri/TimeExtent", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function( Map, InfoTemplate, FeatureLayer, parser, domConstruct, TimeExtent ) { parser.parse(); map = new Map("mapDiv", { basemap: "oceans", center: [-100, 40], zoom: 4 }); // feature service with U2 concerts from 1980 - 2011 var featuresUrl = "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/U2/FeatureServer/0"; var layer = new FeatureLayer(featuresUrl, { id: "u2", infoTemplate: new InfoTemplate( "U2 Concerts: 1980 2011", "Date: ${Date:DateFormat(selector: 'date', fullYear: true)}<br>" + "Venue: ${Venue}, ${City}, ${State}<br>" + "Tour: ${Tour}" ), mode: FeatureLayer.MODE_SNAPSHOT, outFields: ["*"] }); console.info(layer.timeInfo); //This one will be undefined. //layer.setUseMapTime(true); var layerUpdateEnd = layer.on("update-end", function() { console.info(layer.timeInfo); //This one will have an actual value because the layer is loaded. layerUpdateEnd.remove(); // var timeExtent = new TimeExtent(); // timeExtent.startTime = new Date("1/1/1989 UTC"); // map.setTimeExtent(timeExtent); domConstruct.destroy("loading"); }); map.addLayer(layer); } ); </script> </head> <body class="tundra"> <div class="demoLayout" style="height: 100%; width: 100%" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design: 'headline'"> <div class="centerPanel" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'center'"> <div id="mapDiv" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"> <div id="loading"></div> </div> </div> </div> </body> </html>