Hello All,I am getting an error.. "TypeError: Unable to draw graphic (geometry:null, symbol:null): _e is nullhttp://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/layers/FeatureLayer.jsLine 19"I am using ArcGIS server 10.1 and JSAPI 3.2. I have 3 to 4 feature layers and I want to make TOC similar to the example hereThe code is var map, baseMapLayer, featureLayer,t_layer,o_layer,newslayer,music_layer;
var baseMapUrl = "https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer";
var other_url = " http://my server:6080/arcgis/rest/services/type/MapServer/2";
var news_url = " http://my server:6080/arcgis/rest/services/type/MapServer/3";
var music_url = " http://my server:6080/arcgis/rest/services/type/MapServer/4";
function init() {
var initExtent = new esri.geometry.Extent({
"xmin": -16390544.849242661,
"ymin": 1576883.9502372155,
"xmax": -6606605.228742701,
"ymax": 7447247.722537191,
"spatialReference": {
"wkid": 102100
}
});
//extent = esri.geometry.geographicToWebMercator(initExtent);
map = new esri.Map("map", {extent: initExtent});
dojo.connect(featureLayer, "onLoad", function() {
dojo.connect(map, "onZoomEnd", function() {
featureLayer.setMaxAllowableOffset(maxOffset(map,1));
});
});
dojo.connect(map, "onLoad", mapLoaded);
dojo.connect(map,"onUpdateStart",function(){
esri.show(dojo.byId("status"));
});
dojo.connect(map,"onUpdateEnd",function(){
esri.hide(dojo.byId("status"));
});
// base map
baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer(baseMapUrl);
map.addLayer(baseMapLayer);
// for other layer
o_layer = new esri.layers.FeatureLayer(other_url);
map.addLayer(o_layer);
// for new layer
newslayer = new esri.layers.FeatureLayer(news_url);
map.addLayer(newslayer);
//for music layer
music_layer = new esri.layers.FeatureLayer(music_url);
map.addLayer(music_layer);
}
function mapLoaded() {
//resize the map when the browser resizes
dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
var maxOffset = function maxOffset(map, pixelTolerance) {
return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
};
}
function toggleLayer(val){
//alert('val '+val.name);
if(val.name === 'checkOL'){
o_layer.visible ? o_layer.hide():o_layer.show();
}
else if(val.name === 'checkNL'){
newslayer.visible ? newslayer.hide():newslayer.show();
}
else if(val.name === 'checkML'){
music_layer.visible ? music_layer.hide(): music_layer.show();
}
}
dojo.addOnLoad(init);
</script>
</head>
<body class="claro">
<div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width: 100%; height: 100%; margin: 0;">
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'right'" style="width:200px;">
<label for="checkOL">Other Layer</label>
<input data-dojo-type="dijit.form.CheckBox" checked="o_layer.layer.visible" name="checkOL" onChange="toggleLayer(this);"/>
<br />
<label for="checkNL">News Layer</label>
<input data-dojo-type="dijit.form.CheckBox" checked="newslayer.layer.visible" name="checkNL" onChange="toggleLayer(this);"/>
<br />
<label for="checkML">Music Layer</label>
<input data-dojo-type="dijit.form.CheckBox" checked="music_layer.layer.visible" name="checkML" onChange="toggleLayer(this);"/>
</div>
<div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'" style="border:1px solid #000;padding:0;">
<span id="status" style="position: absolute; z-index: 100; right: 5px; top: 5px;">
Loading...
</span>
</div>
</div>
</body>
</html>
Please check the screen shot [ATTACH=CONFIG]18799[/ATTACH]I searched on Google and called support but they unable to resolve this error message.So any help will be highly appreciated.. Thank you..