Help with starting the Time slider

NigelAlford — Mon, 17 Sep 2012 17:57:18 GMT
I'm working to launch a time slider. I've published a time aware layer into out ArcGIS Server 10.0. I taken the example used in sample section and added my service in replacement of one of the existing services. When I run the application I get an Access Control Error....its also showing the service is being called via Json. Anyone have this problem?

Thanks,
<!DOCTYPE html>
<html>
  
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <!--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>
      Arroyo Field Production by Time
    </title>
    
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/claro/claro.css">
    <script type="text/javascript">
        var djConfig = {
            parseOnLoad: true
        };
    </script>
    
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1compact"></script>
    
    <script type="text/javascript" language="javascript">
        dojo.require("esri.map");
        dojo.require("esri.layers.FeatureLayer");
        dojo.require("esri.dijit.TimeSlider");
        dojo.require("esri.dijit.editing.TemplatePicker");
        dojo.require("dojox.lang.functional");
        dojo.require("dojox.lang.functional.fold");
        dojo.require("dojox.lang.functional.curry");

        function init() {
            var startExtent = new esri.geometry.Extent(-101.874, 37.461, -101.702, 37.564, new esri.SpatialReference({ wkid: 4326 }));
            var map = new esri.Map("map", {extent: esri.geometry.geographicToWebMercator(startExtent)});
            dojo.connect(map, "onLayersAddResult", initSlider);

            var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
            map.addLayer(basemap);

//            var fieldLayer = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1", {
//                mode: esri.layers.FeatureLayer.MODE_SNAPSHOT
//            });                                                                                           
//            fieldLayer.setDefinitionExpression("FIELD_NAME = 'ARROYO'");

//            map.addLayer(fieldLayer);

            var timeLayers = [];

            var Usage = new esri.layers.FeatureLayer("*INSERT LOCAL ADDRESS HERE*", {
                mode: esri.layers.FeatureLayer.MODE_SNAPSHOT,
                outFields: ["*"]
            });
            //Usage.setDefinitionExpression("Frequency = 'FREQUENCY'");
            timeLayers.push(Usage);

            //add all the layers to the map then initialize the slider
            map.addLayers(Usage);

        }

        function initSlider(results) {
            var map = this;
            var timeLayers = dojo.map(results, function (result) {
                return result.layer;
            });
            //build a legend
            var symbols = [];
            dojo.forEach(results, function (result) {
                dojo.forEach(result.layer.renderer.infos, function (info) {
                    symbols.push({
                        label: info.minValue + " - " + info.maxValue,
                        symbol: info.symbol
                    });
                });

            });

            var legend = new esri.dijit.editing.TemplatePicker({
                items: symbols,
                rows: "auto",
                columns: 1,
                style: "position: absolute; left:815px; top:27px; z-index: 200;"
            }, "oilLegendDiv");
            legend.startup();

            var timeExtent = new esri.TimeExtent();
            timeExtent.startTime = new Date("8/30/2012 UTC");
            map.setTimeExtent(timeExtent);

            var timeSlider = new esri.dijit.TimeSlider({
                style: "width: 800px;"
            }, dojo.byId("timeSliderDiv"));
            map.setTimeSlider(timeSlider);
            timeSlider.setThumbCount(1);

            var layerTimeExtent = results[0].layer.timeInfo.timeExtent;
            layerTimeExtent.startTime = timeExtent.startTime;
            timeSlider.createTimeStopsByTimeInterval(layerTimeExtent, 1, 'esriTimeUnitsDays');
            timeSlider.setThumbMovingRate(2000);
            timeSlider.singleThumbAsTimeInstant(true);
            timeSlider.setLoop(true);
            timeSlider.startup();

            //add ticks just at beginning and end
            var labels = ['1989', '2009'];
            timeSlider.setLabels(labels);

            var timeQuery = new esri.tasks.Query();
            dojo.connect(timeSlider, "onTimeExtentChange", function (timeExtent) {
                timeQuery.timeExtent = timeExtent;
                var yearlyLayerProduction = '';

                dojo.forEach(timeLayers, function (layer) {
                    var mappedField = layer.renderer.attributeField;
                    layer.queryFeatures(timeQuery, function (featureSet) {
                        var values = dojo.map(featureSet.features, function (feature) {
                            return feature.attributes[mappedField];
                        });
                        var stats = computeStats(values);
                        var units = (layer.name === "Stanton County Oil Leases") ? "bbls" : "Mcf";
                        yearlyLayerProduction = yearlyLayerProduction + layer.name + " produced " + stats.sum + " " + units + " with " + stats.length + " wells.  ";
                    });
                });

                var startVal = timeExtent.startTime.getFullYear();
                console.log(startVal);
                dojo.byId("daterange").innerHTML = "<i>" + startVal + "<\/i> " + yearlyLayerProduction;
            });
        }

        function computeStats(values) {
            var stats = {};
            var df = dojox.lang.functional;
            stats.length = values.length;
            stats.sum = df.reduce(values, df.lambda("+"));
            stats.avg = stats.sum / stats.length;
            if (stats.length > 1) {
                var sumSquresF = df.partial(df.lambda("ss,x,avg->ss+Math.pow(x-avg,2)"), df.arg, df.arg, stats.avg);
                stats.sumSquares = df.reduce(values, sumSquresF);
                stats.stdDev = Math.sqrt(stats.sumSquares / stats.length);
            } else {
                stats.sumSquares = 0;
                stats.stdDev = 0;
            }
            return stats;
        }

        dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="claro">
    <div>
      Arroyo Field Production in
      <span id="daterange">
        1989
      </span>
    </div>
    <div id="map" style="width:800px; height:600px; border:1px solid #000;">
      <div id="oilLegendDiv">
      </div>
    </div>
    <div id="timeSliderDiv">
    </div>
  </body>

</html>
topic Help with starting the Time slider in ArcGIS JavaScript Maps SDK Questions

Help with starting the Time slider
