andygup/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <!--The viewport meta tag is used to improve the presentation and behavior of the samples
    on iOS devices-->
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>Select with feature layer</title>
  <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/tundra/tundra.css">
  <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
  <style>
    html, body, #mapDiv {
      padding: 0;
      margin: 0;
      height: 100%;
    }
    #messages{
      background-color: #fff;
      box-shadow: 0 0 5px #888;
      font-size: 1.1em;
      max-width: 15em;
      padding: 0.5em;
      position: absolute;
      right: 20px;
      top: 20px;
      z-index: 40;
    }
    #header-div{
      font-family: helvetica, serif;
      position: relative;
      background: #000000;
      color: #ffffff;
      width: 100%;
      height: 50px;
      display:inline-block;
      vertical-align:middle;
      line-height: 50px;
      padding-left: 8px;
    }
  </style>
</head>

<body>
  <div id="header-div">Click on the map to start a query.</div>
  <div id="mapDiv"></div>
</body>

<script src="http://js.arcgis.com/3.9/"></script>
<script>
  var map;
  require([
    "esri/map", "esri/tasks/QueryTask",
    "esri/tasks/query", "esri/geometry/Circle",
    "esri/graphic", "esri/symbols/SimpleMarkerSymbol",
    "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol",
    "esri/config", "esri/Color", "dojo/dom", "dojo/domReady!"
  ], function(
      Map, QueryTask,
      Query, Circle,
      Graphic, SimpleMarkerSymbol,
      SimpleLineSymbol, SimpleFillSymbol,
      esriConfig, Color, dom
      ) {
    map = new Map("mapDiv", {
      basemap: "streets",
      center: [-104.9, 39.74],
      zoom: 11
    });

    // Create a query task pointing at a subset of RTD Bus Stops
    var queryTask = new QueryTask("http://services.arcgis.com/IZtlGBUe4KTzLOl4/ArcGIS/rest/services/BPX_RTD_BusStops3/FeatureServer/0");

    // Symbol used to draw the selected census block points within the buffer polygon
    var symbol = new SimpleMarkerSymbol(
        SimpleMarkerSymbol.STYLE_CIRCLE,
        12,
        new SimpleLineSymbol(
            SimpleLineSymbol.STYLE_NULL,
            new Color([247, 34, 101, 0.9]),
            1
        ),
        new Color([207, 34, 171, 0.5])
    );

    var circleSymb = new SimpleFillSymbol(
        SimpleFillSymbol.STYLE_NULL,
        new SimpleLineSymbol(
            SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
            new Color([105, 105, 105]),
            2
        ), new Color([255, 255, 0, 0.25])
    );

    // When the map is clicked create a buffer around the click point of the specified distance.
    map.on("click", function(evt){
      map.graphics.clear();

      var circle = new Circle({
        center: evt.mapPoint,
        geodesic: true,
        radius: 10,
        radiusUnit: "esriMiles"
      });
      map.graphics.add(new Graphic(circle, circleSymb));

      var query = new Query();
      query.geometry = evt.mapPoint;
      query.distance = 10;
      query.units =  "miles";
      query.returnGeometry = true;
      query.outSpatialReference = map.spatialReference;
      query.spatialRelationship = Query.SPATIAL_REL_CONTAINS;

      queryTask.execute(query, function(response) {
        var features = response.features;

        for (var i = 0; i < features.length; i++) {
          var feature = features[i];
          feature.setSymbol(symbol);
          map.graphics.add(feature);
        }
      }, function(error) {
        console.log("Got an error " + error);
      });
    });
  });
</script>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<!--The viewport meta tag is used to improve the presentation and behavior of the samples
	on iOS devices-->
	<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
	<title>Select with feature layer</title>
	<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/tundra/tundra.css">
	<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
	<style>
	html, body, #mapDiv {
	padding: 0;
	margin: 0;
	height: 100%;
	}
	#messages{
	background-color: #fff;
	box-shadow: 0 0 5px #888;
	font-size: 1.1em;
	max-width: 15em;
	padding: 0.5em;
	position: absolute;
	right: 20px;
	top: 20px;
	z-index: 40;
	}
	#header-div{
	font-family: helvetica, serif;
	position: relative;
	background: #000000;
	color: #ffffff;
	width: 100%;
	height: 50px;
	display:inline-block;
	vertical-align:middle;
	line-height: 50px;
	padding-left: 8px;
	}
	</style>
	</head>

	<body>
	<div id="header-div">Click on the map to start a query.</div>
	<div id="mapDiv"></div>
	</body>

	<script src="http://js.arcgis.com/3.9/"></script>
	<script>
	var map;
	require([
	"esri/map", "esri/tasks/QueryTask",
	"esri/tasks/query", "esri/geometry/Circle",
	"esri/graphic", "esri/symbols/SimpleMarkerSymbol",
	"esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol",
	"esri/config", "esri/Color", "dojo/dom", "dojo/domReady!"
	], function(
	Map, QueryTask,
	Query, Circle,
	Graphic, SimpleMarkerSymbol,
	SimpleLineSymbol, SimpleFillSymbol,
	esriConfig, Color, dom
	) {
	map = new Map("mapDiv", {
	basemap: "streets",
	center: [-104.9, 39.74],
	zoom: 11
	});

	// Create a query task pointing at a subset of RTD Bus Stops
	var queryTask = new QueryTask("http://services.arcgis.com/IZtlGBUe4KTzLOl4/ArcGIS/rest/services/BPX_RTD_BusStops3/FeatureServer/0");

	// Symbol used to draw the selected census block points within the buffer polygon
	var symbol = new SimpleMarkerSymbol(
	SimpleMarkerSymbol.STYLE_CIRCLE,
	12,
	new SimpleLineSymbol(
	SimpleLineSymbol.STYLE_NULL,
	new Color([247, 34, 101, 0.9]),
	1
	),
	new Color([207, 34, 171, 0.5])
	);

	var circleSymb = new SimpleFillSymbol(
	SimpleFillSymbol.STYLE_NULL,
	new SimpleLineSymbol(
	SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
	new Color([105, 105, 105]),
	2
	), new Color([255, 255, 0, 0.25])
	);

	// When the map is clicked create a buffer around the click point of the specified distance.
	map.on("click", function(evt){
	map.graphics.clear();

	var circle = new Circle({
	center: evt.mapPoint,
	geodesic: true,
	radius: 10,
	radiusUnit: "esriMiles"
	});
	map.graphics.add(new Graphic(circle, circleSymb));

	var query = new Query();
	query.geometry = evt.mapPoint;
	query.distance = 10;
	query.units = "miles";
	query.returnGeometry = true;
	query.outSpatialReference = map.spatialReference;
	query.spatialRelationship = Query.SPATIAL_REL_CONTAINS;

	queryTask.execute(query, function(response) {
	var features = response.features;

	for (var i = 0; i < features.length; i++) {
	var feature = features[i];
	feature.setSymbol(symbol);
	map.graphics.add(feature);
	}
	}, function(error) {
	console.log("Got an error " + error);
	});
	});
	});
	</script>
	</html>