POST
|
I am having a hard time figuring out how to do this without using ArcMap to plot my data first. What I need to do is be able to plot points on a map over time, say like a driving route, and use the TimeSlider to play back that route. All I have access to is a base map (e.g. https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer) and cannot make use of a service to get any time aware data to plot. My constraints are that I cannot use an external service for the data, I need to do it manually on demand. I have a base map and can successfully draw points on the map using the lat long. I have even created a feature layer to add a working TimeSlider. My problem is my points (graphics) are not Time Aware and I have no clue how to make them that way. The examples I've seen have data that comes from somewhere hosted on this site. Maybe I am completely misunderstanding how TimeSlider and time aware data works with ArcGis. Is what I am trying to do possible? Any help would be much appreciated.
... View more
08-05-2013
04:35 PM
|
0
|
2
|
881
|
POST
|
I think you'll need to add your points to a featureLayer based on a featureCollection, then set the time definition for the layer. After that, the layer will be time-aware and you can use the time-slider. If that doesn't work, try adding the points to a new layer inside ArcMap, set the time definition there, and publish the layer to ArcGIS Server or ArcGIS Online. Steve Thank you for the response. I tried to follow your suggestion and feel like I am close, but I am having a hard time, possibly due to the a variance in my situation that I never see in the examples on this site. So I am using a grid (Telerik MVC), where when a row is clicked on the grid, a call is made to plot the row's points on the map (PlotMap(rowID). I believe my problems are that I'm missing or doing something wrong, plus the order/sequence of featureLayer, timeSlider init, and the fact that I am plotting points on demand. Any further help would be greatly appreciated. Code of interest is posted below: function init() {
var zoomSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([0, 0, 255]), 2), new dojo.Color([255, 255, 0, 0.5]));
esri.config.defaults.map.zoomSymbol = zoomSymbol.toJson();
var mappingURL = (mapURL != null) ? mapURL : '';
if (mappingURL != '') {
map = new esri.Map("map");
dojo.connect(map, "onLoad", initFunc);
var baseLayer = new esri.layers.ArcGISTiledMapServiceLayer(mappingURL);
var layerDefinition = {
"geometryType": "esriGeometryPolygon",
"fields": [{
"name": "BUFF_DIST",
"type": "esriFieldTypeInteger",
"alias": "Buffer Distance"
}]
}
var featureCollection = {
layerDefinition: layerDefinition,
featureSet: null
};
featureLayer = new esri.layers.FeatureLayer(featureCollection, {
mode: esri.layers.FeatureLayer.MODE_SNAPSHOT
});
var defn = new esri.TimeExtent();
defn.startTime = new Date("2/3/2013 UTC")
defn.endTime = new Date("2/4/2013 UTC");
featureLayer.setTimeDefinition(defn);
map.addLayer(baseLayer);
map.addLayer(featureLayer);
dojo.connect(baseLayer, "onError", function (err) {
alert("ArcGIS Mapping Not Available (" + err.code + " : " + err.message + (err.details ? "\n" + err.details.join("\n - ") : "") + ")");
$('#contactMapDiv').width('0%');
});
}
else {
$('#contactMapDiv').width('0%');
}
}
function initSlider() {
var timeSlider = new esri.dijit.TimeSlider({
style: "width: 100%;"
}, dojo.byId("timeSliderDiv"));
map.setTimeSlider(timeSlider);
var timeExtent = new esri.TimeExtent();
timeExtent.startTime = new Date("2/3/2013 UTC");
timeExtent.endTime = new Date("2/4/2013 UTC");
timeSlider.setThumbCount(2);
timeSlider.createTimeStopsByTimeInterval(timeExtent, 2, 'esriTimeUnitsHours');
timeSlider.setThumbIndexes([0, 1]);
timeSlider.setThumbMovingRate(2000);
timeSlider.startup();
//add labels for every other time stop
var labels = dojo.map(timeSlider.timeStops, function (timeStop, i) {
if (i % 2 === 0) {
return timeStop.getUTCFullYear();
} else {
return "";
}
});
timeSlider.setLabels(labels);
dojo.connect(timeSlider, "onTimeExtentChange", function (timeExtent) {
var startValString = timeExtent.startTime.getUTCFullYear();
var endValString = timeExtent.endTime.getUTCFullYear();
dojo.byId("daterange").innerHTML = "<i>" + startValString + " and " + endValString + "<\/i>";
});
}
function initFunc(map) {
initSlider();
}
function addLineToMap(pt1, pt2) {
//create points array
var points = [pt1, pt2];
//create polyline
var polyline = new esri.geometry.Polyline(map.spatialReference);
polyline.addPath(points);
//create graphic
var line = new esri.Graphic(polyline, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255, 255, 255]), 1));
//add graphic to map
featureLayer.add(line);
}
function addPointToMap(lon, lat) {
var point = new esri.geometry.Point(lon, lat, map.spatialReference);
if (point1 == null) {
point1 = new esri.geometry.Point(lon, lat, map.spatialReference);
}
else {
if (point2 != null) {
point1 = point2;
}
point2 = new esri.geometry.Point(lon, lat, map.spatialReference);
addLineToMap(point1, point2);
}
var marker = new esri.symbol.SimpleMarkerSymbol();
marker.setColor(new dojo.Color([255, 0, 0, 0.5]));
featureLayer.add(new esri.Graphic(
point,
marker
));
// map.graphics.add(
// new esri.Graphic(
// point,
// marker
// )
// )
//var wmpoint = esri.geometry.geographicToWebMercator(point);
map.centerAndZoom(point,7);
}
dojo.addOnLoad(init);
function PlotMap(rowID) {
point1 = null;
point2 = null;
featureLayer.clear();
$.ajaxSetup({ cache: false });
$.getJSON(getMapPointDataURL, { id: rowID },
function (mapPointData) {
$.each(mapPointData, function (index, itemData) {
if ((itemData.Text != "") && (itemData.Value != "")) {
var lathour = itemData.Text.substring(0, 2);
var latminute = itemData.Text.substring(2, 4);
var lat = parseFloat(lathour) + parseFloat((latminute) / 60);
if (itemData.Text.substring(4) == "S") {
lat = "-" + lat;
}
var longhour = itemData.Value.substring(0, 3);
var longminute = itemData.Value.substring(3, 5);
var long = parseFloat(longhour) + parseFloat((longminute) / 60);
if (itemData.Value.substring(5) == "W") {
long = "-" + long;
}
// alert(long + ', ' + lat);
addPointToMap(parseFloat(long), parseFloat(lat));
}
});
$.ajaxSetup({ cache: true });
});
}
... View more
08-02-2013
12:18 PM
|
0
|
0
|
205
|
POST
|
I am fairly new to using the ArcGIS JavaScript API and have hit a wall trying to use the timeSlider to add a playback functionality to my map. My map is a global map that is using the following map server URL: https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer, and it's being set in a ArcGISTiledMapServiceLayer: [INDENT]map = new esri.Map("map");[/INDENT] [INDENT]dojo.connect(map, "onLoad", initFunc);[/INDENT] [INDENT]var layer = new esri.layers.ArcGISTiledMapServiceLayer(https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer);[/INDENT] [INDENT]map.addLayer(layer);[/INDENT] My points are lat/long based and being plotted manually via a function call (addPointToMap(lon, lat)). The function created an esri.geometry.Point using the lat/long information, creates a esi.symbol.SimpleMarkerSymbol, and then adds a new graphic to the map using the point and marker. Like this: [INDENT]var point = new esri.geometry.Point(lon, lat, map.spatialReference);[/INDENT] [INDENT]var marker = new esri.symbol.SimpleMarkerSymbol();[/INDENT] [INDENT]marker.setColor(new dojo.Color([255, 0, 0, 0.5]));[/INDENT] [INDENT]map.graphics.add(new esri.Graphic(point,marker))[/INDENT] This all works fine and dandy, but I have no clue how to modify this to make the points plot over time using the slider. All the examples I've seen use dynamicmaplayers, time extens, and map services with data hosted on arcgis.com. I need this to be standalone, with the only thing being retrieved is the global map base. Any help would be greatly appreciated.
... View more
08-01-2013
04:54 PM
|
0
|
2
|
871
|
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:24 AM
|