Map #map { min-height: 80%; min-width: 100%; max-height: 80%; max-width: 100%; } .zoominIcon { background-image: url(images/nav_zoomin.png); width: 16px; height: 16px; }
.zoomoutIcon{ background-image: url(images/nav_zoomout.png); width: 16px; height: 16px;}.zoomfullextIcon{ background-image: url(images/nav_fullextent.png); width: 16px; height: 16px;}.zoomprevIcon{ background-image: url(images/nav_previous.png); width: 16px; height: 16px;}.zoomnextIcon{ background-image: url(images/nav_next.png); width: 16px; height: 16px;}.panIcon{ background-image: url(images/nav_pan.png); width: 16px; height: 16px;}.deactivateIcon{ background-image: url(images/nav_decline.png); width: 16px; height: 16px;} var map; var navToolbar; var grid, store; var dynamiclayer, legendDijit, visible = [], legendlayers = [];
require([ "esri/InfoTemplate", "esri/map", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/tasks/Geoprocessor", "esri/tasks/DataFile", "esri/request", "esri/dijit/BasemapLayer", "esri/dijit/Basemap", "esri/dijit/OverviewMap", "esri/toolbars/navigation", "esri/arcgis/utils", "esri/dijit/Legend", "esri/layers/FeatureLayer", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleMarkerSymbol", "dojo/query", "esri/tasks/QueryTask", "esri/toolbars/draw", "dojo/on", "dojo/dom", "dojo/parser", "dojo/_base/array", "esri/Color", "dojo/dom-construct", "dojo/_base/connect", "dojox/grid/DataGrid", "dojo/data/ItemFileReadStore", "dijit/registry", "dijit/Toolbar", "dijit/form/Button", "dijit/form/CheckBox", "dijit/layout/AccordionContainer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!", "dijit/Dialog"], function ( InfoTemplate, Map, ArcGISDynamicMapServiceLayer, ImageParameters, Geoprocessor, DataFile, esriRequest, BasemapLayer, Basemap, OverviewMap, Navigation, utils, Legend, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol, SimpleMarkerSymbol, query, QueryTask, Draw, on, dom, parser, arrayUtils, Color, domConstruct, connect, DataGrid, ItemFileReadStore, array, registry, CheckBox) { dojo.parser.parse(); //Adding Map Dynamically var firstBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer" }); var firstBasemap = new esri.dijit.Basemap({ id: "Basemap1", layers: [firstBasemapLayer], opacity: 0.8, title: "World topo Map" }); var secondBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer" }); var secondBasemap = new esri.dijit.Basemap({ id: "Basemap2", layers: [secondBasemapLayer], opacity: 0.8, title: "oceans" }); var thirdBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer" }); var thirdBasemap = new esri.dijit.Basemap({ id: "Basemap3", layers: [thirdBasemapLayer], opacity: 0.8, title: "streets" }); map = new Map("map"); dynamiclayer = new ArcGISDynamicMapServiceLayer("http://iicss63:6080/arcgis/rest/services/NCAOR/Test2/MapServer"); map.setBasemap(firstBasemap); changeOverviewMap(); map.on("load", initSelectToolbar); ///////Mouse Coridinates///////// map.on("load", function () { map.on("mouse-move", showCoordinates); }); function showCoordinates(evt) { document.getElementById("info").innerHTML = evt.mapPoint.x.toFixed(3) + ", " + evt.mapPoint.y.toFixed(3); } /////////////////////////////// //Navigation Tool Bar navToolbar = new Navigation(map); on(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler); dijit.registry.byId("zoomin").on("click", function () { navToolbar.activate(Navigation.ZOOM_IN); }); dijit.registry.byId("zoomout").on("click", function () { navToolbar.activate(Navigation.ZOOM_OUT); }); dijit.registry.byId("zoomfullext").on("click", function () { navToolbar.zoomToFullExtent(); }); dijit.registry.byId("zoomprev").on("click", function () { navToolbar.zoomToPrevExtent(); }); dijit.registry.byId("zoomnext").on("click", function () { navToolbar.zoomToNextExtent(); }); dijit.registry.byId("pan").on("click", function () { navToolbar.activate(Navigation.PAN); }); dijit.registry.byId("deactivate").on("click", function () { navToolbar.deactivate(); }); dijit.registry.byId("convert").on("click", function () { myDialog.show(); }); ////////////////////////////////// dynamiclayer.on("load", buildLayerList); map.addLayer(dynamiclayer); legendDijit = new esri.dijit.Legend({ map: map, layerInfos: dynamiclayer[1] }, "legendDiv"); legendDijit.startup(); //////////BuildLayerList////////////////// function buildLayerList() { var items = arrayUtils.map(dynamiclayer.layerInfos, function (info, index) { if (info.defaultVisibility) { visible.push(info.id); } return "" + info.name + ""; }); var ll = dom.byId("DynamicLayers"); ll.innerHTML = items.join('
'); dynamiclayer.setVisibleLayers(visible); on(ll, "click", updateLayerVisibility); } function updateLayerVisibility() { var inputs = query(".list_item"); var input; visible = []; test = []; var i = 0; arrayUtils.forEach(inputs, function (input) { if (input.checked) { visible.push(input.id) arrayUtils.map(dynamiclayer.layerInfos, function (info, index) { if (info.id == i) { test.push(info) } }); i++; } }); if (visible.length === 0) { visible.push(-1); } dynamiclayer.setVisibleLayers(visible); legendDijit.layerInfos = test[0]; legendDijit.refresh(); } var fieldsSelectionSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT, new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.5])); var content = "Area: ${AREA_}" + "
Perimeter: ${PERIMETER}" + "
State Name: ${STATE_NAME}" + "
Total Population: ${TOTAL_POPU}"; var infoTemplate = new InfoTemplate("INDIA SHAPE", content); var content = "FID_Nu: ${FID}" + "
ID_Nu: ${ID}" + "
NAME: ${NAME}" + "
ROAD NAME: ${ROAD_NAME}"; var infoTemplate2 = new InfoTemplate("INDIA ROADS", content); var content = "PLACE_NAME: ${PLACE_NAME}" + "
STATE: ${STATE}" + "
CONTURY: ${COUNTRY}" + "
PLACE: ${PLACE}"; var infoTemplate3 = new InfoTemplate("INDIA PLACES", content); dojo.connect(dojo.byId("basemapDiv"), "onclick", toggleLayer); dojo.connect(dojo.byId("basemapDiv"), "onmouseleave", changeOverviewMap); function toggleLayer() { if (dojo.byId("basemap1").checked) { map.setBasemap(firstBasemap); } if (dojo.byId("basemap2").checked) { map.setBasemap(secondBasemap); } if (dojo.byId("basemap3").checked) { map.setBasemap(thirdBasemap); } } function initSelectToolbar(event) { selectionToolbar = new Draw(event.map); var selectQuery = new query(); on(selectionToolbar, "DrawEnd", function (geometry) { selectionToolbar.deactivate(); selectQuery.geometry = geometry; featureLayer.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW); }); } var gpTaskUrl= "http://iicss63:6080/arcgis/rest/services/NCAOR/ASCII_To_FC/GPServer/Model"; var gp = new esri.tasks.Geoprocessor(gpTaskUrl); gp.outSpatialReference=map.spatialReference; var proxyUrl = "http://iicss63:6080/proxy/proxy.ashx"; esriConfig.defaults.io.proxyUrl = "proxy.jsp"; esriConfig.defaults.io.alwaysUseProxy = false; dijit.registry.byId("ok").on("click", uploadFile); function uploadFile() { var requestHandle = esri.request({ url : "http://iicss63:6080/arcgis/manager/#f=Test_Upload", form : dojo.byId("Upload"), content : { f : "json" }, handleAs : "json", load : displayResult, error : uploadFailed }); requestHandle.then(requestSucceeded, uploadFailed); } function uploadFailed(respo) { alert(respo); alert("Failed!") } function displayResult(evt) { var itemID = evt["item"].itemID; alert(itemID); alert("succeed"); console.log(evt); } function requestSucceeded(response, io) { var dataFile = new DataFile(); var itemID = response["item"].itemID; dataFile.itemID = itemID; var params = { "Input_Ascii": dataFile }; gp.submitJob(params, completeCallback, statusCallback); } function statusCallback(jobInfo) { console.log(jobInfo.jobStatus); } function completeCallback(jobInfo) { console.log("getting data"); gp.getResultData(jobInfo.jobId,"Output_FC", displayResult); } function displayResult(result, messages) { var simpleMarkerSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SOLID, new dojo.Color([255,255,0]), 1); var features = result.value.features; for (var f=0, fl=features.length; f
Search Places
Convert Cancel
<div class="col-md-2 mapright">
.zoomoutIcon{ background-image: url(images/nav_zoomout.png); width: 16px; height: 16px;}.zoomfullextIcon{ background-image: url(images/nav_fullextent.png); width: 16px; height: 16px;}.zoomprevIcon{ background-image: url(images/nav_previous.png); width: 16px; height: 16px;}.zoomnextIcon{ background-image: url(images/nav_next.png); width: 16px; height: 16px;}.panIcon{ background-image: url(images/nav_pan.png); width: 16px; height: 16px;}.deactivateIcon{ background-image: url(images/nav_decline.png); width: 16px; height: 16px;} var map; var navToolbar; var grid, store; var dynamiclayer, legendDijit, visible = [], legendlayers = [];
require([ "esri/InfoTemplate", "esri/map", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/layers/ImageParameters", "esri/tasks/Geoprocessor", "esri/tasks/DataFile", "esri/request", "esri/dijit/BasemapLayer", "esri/dijit/Basemap", "esri/dijit/OverviewMap", "esri/toolbars/navigation", "esri/arcgis/utils", "esri/dijit/Legend", "esri/layers/FeatureLayer", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleMarkerSymbol", "dojo/query", "esri/tasks/QueryTask", "esri/toolbars/draw", "dojo/on", "dojo/dom", "dojo/parser", "dojo/_base/array", "esri/Color", "dojo/dom-construct", "dojo/_base/connect", "dojox/grid/DataGrid", "dojo/data/ItemFileReadStore", "dijit/registry", "dijit/Toolbar", "dijit/form/Button", "dijit/form/CheckBox", "dijit/layout/AccordionContainer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!", "dijit/Dialog"], function ( InfoTemplate, Map, ArcGISDynamicMapServiceLayer, ImageParameters, Geoprocessor, DataFile, esriRequest, BasemapLayer, Basemap, OverviewMap, Navigation, utils, Legend, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol, SimpleMarkerSymbol, query, QueryTask, Draw, on, dom, parser, arrayUtils, Color, domConstruct, connect, DataGrid, ItemFileReadStore, array, registry, CheckBox) { dojo.parser.parse(); //Adding Map Dynamically var firstBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer" }); var firstBasemap = new esri.dijit.Basemap({ id: "Basemap1", layers: [firstBasemapLayer], opacity: 0.8, title: "World topo Map" }); var secondBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer" }); var secondBasemap = new esri.dijit.Basemap({ id: "Basemap2", layers: [secondBasemapLayer], opacity: 0.8, title: "oceans" }); var thirdBasemapLayer = new esri.dijit.BasemapLayer({ url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer" }); var thirdBasemap = new esri.dijit.Basemap({ id: "Basemap3", layers: [thirdBasemapLayer], opacity: 0.8, title: "streets" }); map = new Map("map"); dynamiclayer = new ArcGISDynamicMapServiceLayer("http://iicss63:6080/arcgis/rest/services/NCAOR/Test2/MapServer"); map.setBasemap(firstBasemap); changeOverviewMap(); map.on("load", initSelectToolbar); ///////Mouse Coridinates///////// map.on("load", function () { map.on("mouse-move", showCoordinates); }); function showCoordinates(evt) { document.getElementById("info").innerHTML = evt.mapPoint.x.toFixed(3) + ", " + evt.mapPoint.y.toFixed(3); } /////////////////////////////// //Navigation Tool Bar navToolbar = new Navigation(map); on(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler); dijit.registry.byId("zoomin").on("click", function () { navToolbar.activate(Navigation.ZOOM_IN); }); dijit.registry.byId("zoomout").on("click", function () { navToolbar.activate(Navigation.ZOOM_OUT); }); dijit.registry.byId("zoomfullext").on("click", function () { navToolbar.zoomToFullExtent(); }); dijit.registry.byId("zoomprev").on("click", function () { navToolbar.zoomToPrevExtent(); }); dijit.registry.byId("zoomnext").on("click", function () { navToolbar.zoomToNextExtent(); }); dijit.registry.byId("pan").on("click", function () { navToolbar.activate(Navigation.PAN); }); dijit.registry.byId("deactivate").on("click", function () { navToolbar.deactivate(); }); dijit.registry.byId("convert").on("click", function () { myDialog.show(); }); ////////////////////////////////// dynamiclayer.on("load", buildLayerList); map.addLayer(dynamiclayer); legendDijit = new esri.dijit.Legend({ map: map, layerInfos: dynamiclayer[1] }, "legendDiv"); legendDijit.startup(); //////////BuildLayerList////////////////// function buildLayerList() { var items = arrayUtils.map(dynamiclayer.layerInfos, function (info, index) { if (info.defaultVisibility) { visible.push(info.id); } return "" + info.name + ""; }); var ll = dom.byId("DynamicLayers"); ll.innerHTML = items.join('
'); dynamiclayer.setVisibleLayers(visible); on(ll, "click", updateLayerVisibility); } function updateLayerVisibility() { var inputs = query(".list_item"); var input; visible = []; test = []; var i = 0; arrayUtils.forEach(inputs, function (input) { if (input.checked) { visible.push(input.id) arrayUtils.map(dynamiclayer.layerInfos, function (info, index) { if (info.id == i) { test.push(info) } }); i++; } }); if (visible.length === 0) { visible.push(-1); } dynamiclayer.setVisibleLayers(visible); legendDijit.layerInfos = test[0]; legendDijit.refresh(); } var fieldsSelectionSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT, new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.5])); var content = "Area: ${AREA_}" + "
Perimeter: ${PERIMETER}" + "
State Name: ${STATE_NAME}" + "
Total Population: ${TOTAL_POPU}"; var infoTemplate = new InfoTemplate("INDIA SHAPE", content); var content = "FID_Nu: ${FID}" + "
ID_Nu: ${ID}" + "
NAME: ${NAME}" + "
ROAD NAME: ${ROAD_NAME}"; var infoTemplate2 = new InfoTemplate("INDIA ROADS", content); var content = "PLACE_NAME: ${PLACE_NAME}" + "
STATE: ${STATE}" + "
CONTURY: ${COUNTRY}" + "
PLACE: ${PLACE}"; var infoTemplate3 = new InfoTemplate("INDIA PLACES", content); dojo.connect(dojo.byId("basemapDiv"), "onclick", toggleLayer); dojo.connect(dojo.byId("basemapDiv"), "onmouseleave", changeOverviewMap); function toggleLayer() { if (dojo.byId("basemap1").checked) { map.setBasemap(firstBasemap); } if (dojo.byId("basemap2").checked) { map.setBasemap(secondBasemap); } if (dojo.byId("basemap3").checked) { map.setBasemap(thirdBasemap); } } function initSelectToolbar(event) { selectionToolbar = new Draw(event.map); var selectQuery = new query(); on(selectionToolbar, "DrawEnd", function (geometry) { selectionToolbar.deactivate(); selectQuery.geometry = geometry; featureLayer.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW); }); } var gpTaskUrl= "http://iicss63:6080/arcgis/rest/services/NCAOR/ASCII_To_FC/GPServer/Model"; var gp = new esri.tasks.Geoprocessor(gpTaskUrl); gp.outSpatialReference=map.spatialReference; var proxyUrl = "http://iicss63:6080/proxy/proxy.ashx"; esriConfig.defaults.io.proxyUrl = "proxy.jsp"; esriConfig.defaults.io.alwaysUseProxy = false; dijit.registry.byId("ok").on("click", uploadFile); function uploadFile() { var requestHandle = esri.request({ url : "http://iicss63:6080/arcgis/manager/#f=Test_Upload", form : dojo.byId("Upload"), content : { f : "json" }, handleAs : "json", load : displayResult, error : uploadFailed }); requestHandle.then(requestSucceeded, uploadFailed); } function uploadFailed(respo) { alert(respo); alert("Failed!") } function displayResult(evt) { var itemID = evt["item"].itemID; alert(itemID); alert("succeed"); console.log(evt); } function requestSucceeded(response, io) { var dataFile = new DataFile(); var itemID = response["item"].itemID; dataFile.itemID = itemID; var params = { "Input_Ascii": dataFile }; gp.submitJob(params, completeCallback, statusCallback); } function statusCallback(jobInfo) { console.log(jobInfo.jobStatus); } function completeCallback(jobInfo) { console.log("getting data"); gp.getResultData(jobInfo.jobId,"Output_FC", displayResult); } function displayResult(result, messages) { var simpleMarkerSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SOLID, new dojo.Color([255,255,0]), 1); var features = result.value.features; for (var f=0, fl=features.length; f
Search Places
Convert Cancel
<div class="col-md-2 mapright">