<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
<title>Simple Map</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
<style>
html, body, {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color: #FFF;
overflow: hidden;
font-family: "Trebuchet MS";
}
</style>
<script src="http://js.arcgis.com/3.13/"></script>
<script>
var map;
require(["esri/map", "esri/layers/FeatureLayer", "dojo/domReady!"],
function (Map, FeatureLayer) {
map = new Map("map", {
basemap: "topo",
center: [79.267180899999970000, 17.052389000000000000], // longitude, latitude
});
}); // require ends
function myFunction() {
var layerUrl = document.getElementById("mySelect").value;
var demographicsLayer = new FeatureLayer(layerUrl);
map.addLayer(demographicsLayer);
alert('hello');
}
</script>
</head>
<body>
<div>
<div id="map"></div>
<select id="mySelect" onchange="myFunction()">
<option value="http://localhost:6080/arcgis/rest/services/new/FeatureServer/7">Boundary</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterD/sde_sde_f_distr/ImageServer">Fluorine</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterD/sde_sde_p_distr/ImageServer">Population</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterL/sde_sde_streams/ImageServer">Streams</option>
</select>
</div>
</body>
</html>
Try this code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
<title>Simple Map</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
<style>
html, body, {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color: #FFF;
overflow: hidden;
font-family: "Trebuchet MS";
}
</style>
<script src="http://js.arcgis.com/3.13/"></script>
<script>
var map;
var Fl;
require([
"esri/map",
"esri/layers/FeatureLayer",
"dojo/domReady!"],
function (Map, FeatureLayer) {
Fl = FeatureLayer;
map = new Map("map", {
basemap: "topo",
center: [79.267180899999970000, 17.052389000000000000]}); // longitude, latitude
});
function myFunction() {
var layerUrl = document.getElementById("mySelect").value;
var demographicsLayer = new Fl(layerUrl);
map.addLayer(demographicsLayer);
alert('hello');
}
</script>
</head>
<body>
<div>
<div id="map"></div>
<select id="mySelect" onchange="myFunction()">
<option value="http://localhost:6080/arcgis/rest/services/new/FeatureServer/7">Boundary</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterD/sde_sde_f_distr/ImageServer">Fluorine</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterD/sde_sde_p_distr/ImageServer">Population</option>
<option value="http://localhost:6080/arcgis/rest/services/rasterL/sde_sde_streams/ImageServer">Streams</option>
</select>
</div>
</body>
</html>
Thanks for the reply..
even now i am not able to see my layers....when i selected a layer it is
showing the alert message 'hello'
Thanks for the reply..
even now i am not able to see my layers....when i selected a layer it is showing the alert message 'hello'
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
<title>Simple Map</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
<style>
html, body, {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color: #FFF;
overflow: hidden;
font-family: "Trebuchet MS";
}
</style>
<script src="http://js.arcgis.com/3.13/"></script>
<script>
var map;
var ImgService;
var ImgParams;
var GPoint;
var config = {
"http://sampleserver6.arcgisonline.com/arcgis/rest/services/Toronto/ImageServer":[-79.40, 43.64]
};
require([
"esri/map",
"esri/layers/ArcGISImageServiceLayer",
"esri/layers/ImageServiceParameters",
"esri/geometry/Point",
"dojo/domReady!"],
function (Map, ArcGISImageServiceLayer,ImageServiceParameters,Point) {
ImgService = ArcGISImageServiceLayer;
ImgParams = ImageServiceParameters;
GPoint = Point;
map = new Map("map", {
basemap: "topo",
center: [79.267180899999970000, 17.052389000000000000]}); // longitude, latitude
});
var demographicsLayer = false;
function myFunction() {
var layerUrl = document.getElementById("mySelect").value;
if(layerUrl != "000"){
if(demographicsLayer){ map.removeLayer(demographicsLayer); }
var params = ImgParams();
var demographicsLayer = new ImgService(layerUrl,{ imageServiceParameters: params });
map.addLayer(demographicsLayer);
var mapPoint = new GPoint(config[layerUrl]);
map.centerAndZoom(mapPoint, 12);
}
}
</script>
</head>
<body>
<div>
<div id="map"></div>
<select id="mySelect" onchange="myFunction()">
<option value="000">Choose option</option>
<option value="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Toronto/ImageServer">test</option>
</select>
</div>
</body>
</html>