Does a feature layer support projection on-the-fly?

StephenLead · ‎01-29-2013

I can't see in the documentation whether a feature layer supports on-the-fly projection.

But a quick test shows it doesn't seem to work when adding a feature layer with WKID = 4283 on a Web Mercator map.

The same layer, when defined as dynamic, does display.

Should a feature layer automatically project on-the-fly? Is there a way to force it to reproject?

Thanks,
Steve

ShreyasVakil · ‎01-29-2013

I think Feature Layer should reproject on-the fly. I did a quick test and was able to add layers from WKID: 4269 & 4326 on top of web mercator.

Check the code below:

<!doctype html> <html lang="en">   <head>     <meta charset="utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>     <title></title>     <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/nihilo/nihilo.css">         <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />     <style type="text/css">       html, body {          height: 100%; width: 100%;         margin: 0; padding: 0;       }        body{         background-color: #fff; overflow:hidden;          font-family: sans-serif;       }        label {         display: inline-block;         padding: 5px 5px 0 5px;         font-weight: 400;         font-size: 12pt;       }       #header {         padding-top: 4px;         padding-right: 15px;         color: #444;          font-size:16pt; text-align:right;font-weight:bold;         height:55px;         background: #fff;         border-bottom: 1px solid #444;       }       #subheader {         font-size:small;         color: #444;         text-align:right;         padding-right:20px;       }       #header, #subheader {         text-shadow: 1px 1px 1px #cee1f0;         filter: dropshadow(color=#cee1f0, offx=1, offy=1);       }       #rightPane{         margin: 0;         padding: 10px;         background-color: #fff;         color: #421b14;         width: 180px;       }        .ds { background: #000; overflow: hidden; position: absolute; z-index: 2; }       #ds-h div { width: 100%; }       #ds-l div, #ds-r div { height: 100%; }       #ds-r div { right: 0; }       #ds .o1 { filter: alpha(opacity=10); opacity: .1; }       #ds .o2 { filter: alpha(opacity=8); opacity: .08; }       #ds .o3 { filter: alpha(opacity=6); opacity: .06; }       #ds .o4 { filter: alpha(opacity=4); opacity: .04; }       #ds .o5 { filter: alpha(opacity=2); opacity: .02; }       #ds .h1 { height: 1px; }       #ds .h2 { height: 2px; }       #ds .h3 { height: 3px; }       #ds .h4 { height: 4px; }       #ds .h5 { height: 5px; }       #ds .v1 { width: 1px; }       #ds .v2 { width: 2px; }       #ds .v3 { width: 3px; }       #ds .v4 { width: 4px; }       #ds .v5 { width: 5px; }        /* make all dijit buttons the same width */       .dijitButton .dijitButtonNode, #drawingWrapper {         width: 160px;       }            </style>     <script>var dojoConfig = { parseOnLoad: true };</script>     <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>     <script>       dojo.require("dijit.layout.BorderContainer");       dojo.require("dijit.layout.ContentPane");       dojo.require("dijit.form.Button");       dojo.require("esri.map");           dojo.require("esri.layers.FeatureLayer");              var theGraphic = "";  //default for graphic/text                    var map = null;    var highlightLayerText           function init() {      esri.config.defaults.io.proxyUrl = "http://svakil/JSProxyPage/proxy.ashx";         esri.config.defaults.io.alwaysUseProxy = false;                  var initialExtent = new esri.geometry.Extent({"xmin":-14788424.73638572,"ymin":3302079.621918744,"xmax":-11657564.057825731,"ymax":5552385.734633734,"spatialReference":{"wkid":102100}});      map = new esri.Map("map", {    extent: initialExtent,             wrapAround180: true         });         dojo.connect(map, 'onLoad', function() {           dojo.connect(dijit.byId('map'), 'resize', map, map.resize);         });             var url = "http://services.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer";         var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer(url, { "id": "Ocean" });         map.addLayer(tiledLayer);    featureLayer = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Earthquakes/Since_1970/MapServer/0", {       mode: esri.layers.FeatureLayer.MODE_ONDEMAND,       outFields: ["*"]      });   map.addLayer(featureLayer);      featureLayer1 = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/2", {       mode: esri.layers.FeatureLayer.MODE_ONDEMAND,       outFields: ["*"]      });   map.addLayer(featureLayer1);     }              dojo.ready(init);     </script>   </head>   <body class="nihilo">     <div id="mainWindow" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width: 100%; height: 100%; margin: 0;">       <div id="map" class="shadow" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div>                   </div>     </div>   </body> </html>

View solution in original post

ShreyasVakil · ‎01-29-2013

I think Feature Layer should reproject on-the fly. I did a quick test and was able to add layers from WKID: 4269 & 4326 on top of web mercator.

Check the code below:

<!doctype html> <html lang="en">   <head>     <meta charset="utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>     <title></title>     <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/nihilo/nihilo.css">         <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />     <style type="text/css">       html, body {          height: 100%; width: 100%;         margin: 0; padding: 0;       }        body{         background-color: #fff; overflow:hidden;          font-family: sans-serif;       }        label {         display: inline-block;         padding: 5px 5px 0 5px;         font-weight: 400;         font-size: 12pt;       }       #header {         padding-top: 4px;         padding-right: 15px;         color: #444;          font-size:16pt; text-align:right;font-weight:bold;         height:55px;         background: #fff;         border-bottom: 1px solid #444;       }       #subheader {         font-size:small;         color: #444;         text-align:right;         padding-right:20px;       }       #header, #subheader {         text-shadow: 1px 1px 1px #cee1f0;         filter: dropshadow(color=#cee1f0, offx=1, offy=1);       }       #rightPane{         margin: 0;         padding: 10px;         background-color: #fff;         color: #421b14;         width: 180px;       }        .ds { background: #000; overflow: hidden; position: absolute; z-index: 2; }       #ds-h div { width: 100%; }       #ds-l div, #ds-r div { height: 100%; }       #ds-r div { right: 0; }       #ds .o1 { filter: alpha(opacity=10); opacity: .1; }       #ds .o2 { filter: alpha(opacity=8); opacity: .08; }       #ds .o3 { filter: alpha(opacity=6); opacity: .06; }       #ds .o4 { filter: alpha(opacity=4); opacity: .04; }       #ds .o5 { filter: alpha(opacity=2); opacity: .02; }       #ds .h1 { height: 1px; }       #ds .h2 { height: 2px; }       #ds .h3 { height: 3px; }       #ds .h4 { height: 4px; }       #ds .h5 { height: 5px; }       #ds .v1 { width: 1px; }       #ds .v2 { width: 2px; }       #ds .v3 { width: 3px; }       #ds .v4 { width: 4px; }       #ds .v5 { width: 5px; }        /* make all dijit buttons the same width */       .dijitButton .dijitButtonNode, #drawingWrapper {         width: 160px;       }            </style>     <script>var dojoConfig = { parseOnLoad: true };</script>     <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>     <script>       dojo.require("dijit.layout.BorderContainer");       dojo.require("dijit.layout.ContentPane");       dojo.require("dijit.form.Button");       dojo.require("esri.map");           dojo.require("esri.layers.FeatureLayer");              var theGraphic = "";  //default for graphic/text                    var map = null;    var highlightLayerText           function init() {      esri.config.defaults.io.proxyUrl = "http://svakil/JSProxyPage/proxy.ashx";         esri.config.defaults.io.alwaysUseProxy = false;                  var initialExtent = new esri.geometry.Extent({"xmin":-14788424.73638572,"ymin":3302079.621918744,"xmax":-11657564.057825731,"ymax":5552385.734633734,"spatialReference":{"wkid":102100}});      map = new esri.Map("map", {    extent: initialExtent,             wrapAround180: true         });         dojo.connect(map, 'onLoad', function() {           dojo.connect(dijit.byId('map'), 'resize', map, map.resize);         });             var url = "http://services.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer";         var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer(url, { "id": "Ocean" });         map.addLayer(tiledLayer);    featureLayer = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Earthquakes/Since_1970/MapServer/0", {       mode: esri.layers.FeatureLayer.MODE_ONDEMAND,       outFields: ["*"]      });   map.addLayer(featureLayer);      featureLayer1 = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/2", {       mode: esri.layers.FeatureLayer.MODE_ONDEMAND,       outFields: ["*"]      });   map.addLayer(featureLayer1);     }              dojo.ready(init);     </script>   </head>   <body class="nihilo">     <div id="mainWindow" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width: 100%; height: 100%; margin: 0;">       <div id="map" class="shadow" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div>                   </div>     </div>   </body> </html>

derekswingley1 · ‎01-29-2013

Should a feature layer automatically project on-the-fly? Is there a way to force it to reproject?

Yes, check out the feature layer in any projection sample. The key is to set esri.Map's spatial reference by passing an extent with the spatial reference of your choice as an option to esri.Map. You can also use that sample to generate extents in any spatial reference.