empeypp

LocationID Query

Discussion created by empeypp on Jul 14, 2011
Hi,

I'm creating an interactive web application that allows the user to define a date range of events, then view drive times to their specific events.

I have the query working just fine, however, I cannot figure out how to only display the drive times for the event selected within the query. (There is a box 'Drive Time' for each query result)

Below is the code, please take a look at the " function showDriveTime(locationID) "

<script type="text/javascript">
      dojo.require("esri.map");
      dojo.require("esri.tasks.find");
      dojo.require("esri.layers.FeatureLayer");

 
  var fl;
  var today = new Date();
 
  var sqlAll = "StartDate >= "+formatDate(today,"#MM/dd/yyyy 00:00:00#");
 
  var weeks2 = new Date();
  weeks2.setDate(today.getDate()+14);
  var sqlWeeks2 = "StartDate >= "+formatDate(today,"#MM/dd/yyyy 00:00:00#")+" AND StartDate <= "+formatDate(weeks2,"#MM/dd/yyyy 00:00:00#");
 
  var weeks4 = new Date();
  weeks4.setDate(today.getDate()+31);
  var sqlWeeks4 = "StartDate >= "+formatDate(today,"#MM/dd/yyyy 00:00:00#")+" AND StartDate <= "+formatDate(weeks4,"#MM/dd/yyyy 00:00:00#");
 
  var months3 = new Date();
  months3.setDate(today.getDate()+91);
  var sqlMonths3 = "StartDate >= "+formatDate(today,"#MM/dd/yyyy 00:00:00#")+" AND StartDate <= "+formatDate(months3,"#MM/dd/yyyy 00:00:00#");
 
  var months6 = new Date();
  months6.setDate(today.getDate()+180);
  var sqlMonths6 = "StartDate >="+formatDate(today,"#MM/dd/yyyy 00:00:00#")+" AND StartDate <="+formatDate(months6,"#MM/dd/yyyy 00:00:00#");
    


var layer1;
// define global variables

var query, queryTask,  map, querySet, infoTemplate, symbol;


var layer, map, visible = [];

var dynamicMapServiceLayer;

var DTlayer;


function init() {
  //create map and add layer
 
  // initial extent
  var initExtent = new esri.geometry.Extent({"xmin":-10026637,"ymin":5150020,"xmax":-10024728,"ymax":5851042,"spatialReference":
  {"wkid":102100}});
  map = new esri.Map("mapDiv",{extent:initExtent});

 
 
  // add background base layer
  var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
        map.addLayer(basemap); 
 
 
 
  // add event layer (and turn off drive time layer)
        var imageParameters = new esri.layers.ImageParameters();
  imageParameters.layerIds = [1]; // turn on event layer
        //imageParameters.layerIds = [0,1]; // turn on both event and drive time layers
        imageParameters.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
        //can also be: LAYER_OPTION_EXCLUDE, LAYER_OPTION_HIDE, LAYER_OPTION_INCLUDE
   var layerDefs = [];
        //layerDefs[5] = "STATE_NAME='Kansas'";
        //layerDefs[4] = "STATE_NAME='Kansas' and POP2007>25000";
        layerDefs[0,2] = "EventID = -1";
        imageParameters.layerDefinitions = layerDefs;

 
 
 
 
 
 
 
  /*layer = new esri.layers.ArcGISDynamicMapServiceLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer",{"imageParameters":imageParameters});
  map.addLayer(layer);*/
 
 
  dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer", {"imageParameters":imageParameters});
 
  DTlayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer/1",{"imageParameters":imageParameters});
 



 
 
   var content =  "<b>Address:</b>  ${Address1} ${City},   ${State} ${Zip}<br>" +
       "<b>Date:</b>   ${StartDate}<br>"+
       "<b>Fee:</b>   $${Cost}<br>"+
       "${Description}";
        var infoTemplate = new esri.InfoTemplate("${EventName}", content);
  fl = new esri.layers.FeatureLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer/0",{
          mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
          outFields: ["*"],
          infoTemplate: infoTemplate
        });
       
  map.addLayers([fl]);
 
 
  //initialize query task
  queryTask = new esri.tasks.QueryTask("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer/0");
 
  //queryTask1 = new esri.tasks.QueryTask("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce3/MapServer/1");
  //initialize query
  query = new esri.tasks.Query();
  query.returnGeometry = true;
  query.outFields = ["Address1","City","State","Zip","Cost","URL","EventID","LocationID","EventName","Description"];
infoTemplate: infoTemplate;


  //create symbol for selected features
  symbol = new esri.symbol.SimpleMarkerSymbol();
  symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND);
  symbol.setSize(16);
  symbol.setColor(new dojo.Color([200,150,75,0.7]));
 
 

}
 





function executeQueryTask(strWhere) {

    //strWhere = "StartDate >= "+formatDate(today,"#MM/dd/yyyy 00:00:00#")+" AND StartDate <= #12/31/2011 00:00:00#";
   // alert("strWhere = " + strWhere);
    query.where = strWhere;
   

    queryTask.execute(query,function(featureSet) {
  //remove all graphics on the maps graphics layer
  map.graphics.clear();
 
  // anything found?
  if (featureSet.features.length != 0) {
   var i = featureSet.features.length;
   // records found
   //alert(i + " records found. Displaying.");
   showResults(featureSet);
   infoTemplate: infoTemplate;
  } else {
   // no records found
   //alert("No records found");
  }
});
  }
 

 
 
 
   function showResults(featureSet) {
    //get number of records in set
var il = featureSet.features.length;
//alert("number of results: " + il);

var features = featureSet.features;

//QueryTask returns a featureSet.  Loop through features in the featureSet and add them to the map.
    strHTML = "";
i = 0;
dojo.forEach(features,function(feature){
   var graphic = feature;
   graphic.setSymbol(symbol);

   //Set the infoTemplate.
   graphic.setInfoTemplate(infoTemplate);

   //Add graphic to the map graphics layer.
   map.graphics.add(graphic);
     
      //Add entry to query result list -- built from table attributes
      attributes = graphic.attributes;
      address = attributes["Address1"] + ", " + attributes["City"] + " " + attributes["State"] + " " + attributes["Zip"];
      strHTML = strHTML + "<b>Name:</b> " + attributes["EventName"] + "<br />";
   strHTML = strHTML + "<b>Address:</b> " + address + "<br />";
      strHTML = strHTML + "<b>Cost:</b> $" + attributes["Cost"] + "<br />";
      strHTML = strHTML + "<b>Web:</b> " + "<a href='" + attributes["URL"] + "' class='info'>" + attributes["URL"] + "</a><br />";
   strHTML = strHTML + "<b>Information:</b> " + attributes["Description"] + "<br />"; 
   strHTML = strHTML + "<input type='button' class='btn' onclick='zoomTo("+i+")' value='Zoom to' />  ";
   strHTML = strHTML + "<input type='button' class='btn' onclick='showDriveTime()' value='Drive times' /> ";
   strHTML = strHTML + "<input type='button' class='btn' onclick='directions(\""+address+"\")' value='Directions'  /><br /><br />";
      strHTML = strHTML + "<br/>";
  
   //increment value
   i = i + 1;
});
   
    //Add query result to div
    //alert("adding results to div, strHTML = " + strHTML);
    dojo.byId("results").innerHTML = strHTML;
  }
 
 
 
 
 
  function directions(address) {
// open window to google maps with selected location as destination address
url = "http://maps.google.com/maps?daddr="+address;
window.location = url;
  }
 




function showDriveTime(locationID) {
alert("Ran DT");
console.log("running drive time code");
    var sqlWhere1 = "LocationID = " + locationID;
var layerDefinitions = [1];
layerDefinitions[1] = sqlWhere1;
map.addLayer(dynamicMapServiceLayer);
}

 
 
 
  function zoomTo(featureNum) {
    // zoom to the feature that the user has selected
// distance around point to buffer new extent
var factor = 2000;
// get feature user clicked on
graphic = querySet.features[featureNum];
// get feature geometry and define new extent
pt = graphic.geometry;
var extent = new esri.geometry.Extent(pt.x - factor, pt.y - factor, pt.x + factor, pt.y + factor, pt.SpatialReference);
// set new extent
map.setExtent(extent.expand(2));
  }
 


function changeMap(range) {
//alert("range =  "+range);
switch(range) {
  case "sqlAll":
   executeQueryTask(sqlAll);
  case "sqlWeeks2":
   executeQueryTask(sqlWeeks2);
   break;
  case "sqlWeeks4":
   executeQueryTask(sqlWeeks4);
   break;
  case "sqlMonths3":
   executeQueryTask(sqlMonths3);
   break;
  case "sqlMonths6":
   executeQueryTask(sqlMonths6);
   break;
}
}

    function changeMap1(range) {
alert("range");
switch(range) {
  case "PrairieDT":
   alert("ran it");
   executeQueryTask(PrairieDT);
   break;
  }
}

/* function updateLayerVisibility() {
var inputs = dojo.query(".list_item"), input;
//in this application layer 2 is always on.

visible = [1];
for (var i=0, il=inputs.length; i<il; i++) {
if (inputs[i].checked) {
visible.push(inputs[i].id);
}
}
//if there aren't any layers visible set the array value to = -1
if(visible.length === 1){
visible.push(0);

}

map.addLayer(dynamicMapServiceLayer);
}*/
// Popup window code
function newPopup(url) {
popupWindow = window.open(
  url,'popUpWindow','height=350,width=250,left=10,top=10,resizable=no,scrollbars=no,toolbar=no,menubar=no,location=no,directories=no,status=yes')
}



  // get everything map-worthy started
  dojo.addOnLoad(init);
  </script>

Outcomes