Last active
February 8, 2019 19:26
-
-
Save thejeshgn/833dd94efde89f37ccb6df5a5e0ba55b to your computer and use it in GitHub Desktop.
Cauvery River Overview Map Credit: India WRIS Project
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<!--Before Map--><link href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/soria/soria.css" rel="stylesheet" type="text/css"><link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/esri/dijit/css/Popup.css"/><script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script><style type="text/css"> | |
/* set title font properties */ | |
.infowindow .window .top .right .user .titlebar .title { font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:12pt; } | |
/* set content font properties */ | |
.infowindow .window .top .right .user .content | |
{ font-style:italic; | |
font-weight:bold; | |
font-size:10pt; | |
} | |
#header { | |
background-color:white; | |
color:#005d9c; | |
font-size:15pt; | |
text-align:center; | |
font-weight:bold; | |
height:40px; | |
} | |
.roundedCorners{ | |
-moz-border-radius: 0px; | |
} | |
.shadow{ | |
} | |
#subheader { | |
font-size:small; | |
padding-left: 40px; | |
color: #003559; | |
} | |
#rightPane{ | |
background-color:white; | |
color:peru; | |
margin:5px; | |
border: solid 0px cornflowerblue; | |
} | |
.esriScalebar{ | |
padding: 20px 20px; | |
} | |
#map{ | |
padding:0; | |
} | |
.esriPopup .titlePane { | |
border-style:solid solid none; | |
color:#FFFFFF; | |
cursor:default; | |
line-height:20px; | |
background-color:#1456A4; | |
} | |
.esriPopup .contentPane { | |
background-color:white; | |
border-color:-moz-use-text-color #999999; | |
border-style:none solid; | |
border-width:medium 1px; | |
color:#333333; | |
max-height:300px; | |
overflow:auto; | |
padding:10px 6px 6px 10px; | |
position:relative; | |
} | |
</style> | |
<script type="text/javascript"> | |
//Imported classes | |
dojo.require("esri.map"); | |
dojo.require("esri.graphic"); | |
dojo.require("esri.tasks.query"); | |
dojo.require("esri.layers.FeatureLayer"); | |
dojo.require("dijit.TooltipDialog"); | |
dojo.require("esri.dijit.Popup"); | |
dojo.require("esri.toolbars.draw"); | |
dojo.require("esri.dijit.Print"); | |
dojo.require("dijit.form.Button"); | |
dojo.require("esri.tasks.geometry"); | |
//Declaration of variables | |
var map; | |
var cGLayer, oGLayer; | |
var RiverWhereClause; | |
var showExt; | |
var featCount; | |
var popup; | |
//Init the function | |
function init() { | |
//set the where clauses | |
RiverWhereClause="RIVNAME in ('Cauvery')"; | |
featcount="1"; | |
esri.config.defaults.io.proxyUrl = "proxy.php"; | |
popup= new esri.dijit.Popup(null,dojo.create("div")); | |
var imgParam = new esri.layers.ImageParameters(); | |
imgParam.format = "png32"; | |
map = new esri.Map("map", {logo:false, infoWindow:popup}); | |
var Adminvisible = [1,2,3]; | |
var WSvisible=[1]; | |
var wrp=[1,2,3,4,5,6,7]; | |
map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/DEM/MapServer",{imageParameters:imgParam})); | |
map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/Outside_India/MapServer",{imageParameters:imgParam})); | |
map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/SubInfoSysLCC/River_SO/MapServer/",{imageParameters:imgParam})); | |
var AdminService=new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/Administrative/MapServer",{imageParameters:imgParam}); | |
var WaterShedService=new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/Watershed/MapServer",{imageParameters:imgParam}); | |
map.addLayer(AdminService); | |
AdminService.setVisibleLayers(Adminvisible); | |
AdminService.setOpacity(0.5); | |
//map.addLayer(WaterShedService); | |
//WaterShedService.setVisibleLayers(WSvisible); | |
var wrplayer= new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/SubInfoSysLCC/WRP/MapServer",{imageParameters:imgParam}); | |
//map.addLayer(wrplayer); | |
//wrplayer.setVisibleLayers(wrp); | |
//map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/SurfaceWaterbody/MapServer/",{imageParameters:imgParam})); | |
//map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/Common/WRP_Canal/MapServer",{imageParameters:imgParam})); | |
//map.addLayer(new esri.layers.ArcGISDynamicMapServiceLayer("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/SubInfoSysLCC/Canal/MapServer/2",{imageParameters:imgParam})); | |
cGLayer=new esri.layers.GraphicsLayer(); | |
oGLayer=new esri.layers.GraphicsLayer(); | |
map.addLayer(cGLayer); | |
map.addLayer(oGLayer); | |
//query | |
if(RiverWhereClause.length>15) | |
{ | |
showRivers(); | |
} | |
} | |
function showRivers() | |
{ | |
//build query task | |
var cQueryTask = new esri.tasks.QueryTask("http://india-wris.nrsc.gov.in/ArcGIS/rest/services/SubInfoSysLCC/River_SO/MapServer/"+"14"); | |
//build query filter | |
var cQuery = new esri.tasks.Query(); | |
cQuery.returnGeometry = true; | |
cQuery.outFields = ["RIVNAME","ORIGIN","SHAPE.LEN","MAJOR_TRIBUTARY"]; | |
cQuery.where=RiverWhereClause; | |
var cSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([34,17,163]), 4), new dojo.Color([255,255,255,0.1])); | |
var ext = new esri.geometry.Extent(); | |
//var feature = featureArray.features[i]; | |
//var ext = new esri.geometry.Extent(feature.geometry.getExtent()); | |
//execution start | |
cQueryTask.execute(cQuery, function(fset) | |
{ | |
var featureSet = fset; | |
var numFeatures = featureSet.features.length; | |
for (var i=0; i<numFeatures; i++) | |
{ | |
var feat=featureSet.features[i]; | |
var exttent = new esri.geometry.Extent(feat.geometry.getExtent()); | |
var xmin = exttent.xmin; | |
var xmax = exttent.xmax; | |
var ymin = exttent.ymin; | |
var ymax = exttent.ymax; | |
var centr= exttent.getCenter(); | |
console.log("X min"+xmin+"<br>Y Min"+ymin+"<br>X max"+xmax+"<br>Y max"+ymax+"center point"+centr); | |
console.log(centr); | |
var Name=feat.attributes.RIVNAME; | |
var len=feat.attributes['SHAPE.LEN']; | |
if (len==null) {len='-';}else {len=(len/1000).toFixed(3);} | |
var orgn=feat.attributes.ORIGIN ; | |
if (orgn==null) {orgn='-';} | |
var mat=feat.attributes.MAJOR_TRIBUTARY ; | |
if (mat==null) {mat='-';} | |
var ext11=featureSet.features[i].geometry.getExtent().getCenter(); | |
//var pt=featureSet.features[i].geometry; | |
var graphic = featureSet.features[i]; | |
//console.log(pt); | |
var leng=Math.ceil(graphic.geometry.paths.length/2); | |
var firstpath=graphic.geometry.paths[0][1]; | |
//console.log(firstpath[0]); | |
//console.log(graphic.geometry.paths); | |
//console.log(pt.getPoint(leng,0)); | |
//get Lat and long | |
var newpoint=graphic.geometry.paths[0][0]; | |
console.log(newpoint); | |
x=newpoint[0]; | |
y=newpoint[1]; | |
console.log(x+"-"+y); | |
//window.location.href = "river_lcctogcs.php?X=" + x + "&Y=" + y; | |
//Popup window | |
var infoTemplate = new esri.InfoTemplate("River Info:", "<b>Name:</b>"+Name +"<br/><b> Length(Km):</b> "+len + "<br/> <b>Origin:</b> "+orgn+"<br/> <b>Tributaries:</b> "+mat); | |
graphic.setInfoTemplate(infoTemplate); | |
graphic.symbol=cSymbol; | |
cGLayer.add(graphic); | |
if(i==0) | |
{ | |
ext=featureSet.features[i].geometry.getExtent(); | |
} | |
else | |
{ | |
ext=ext.union(featureSet.features[i].geometry.getExtent()); | |
} | |
} | |
if(numFeatures>0) | |
{ | |
setMapExt(ext,'CMD'); | |
} | |
}); //execution End here | |
} | |
function setMapExt(ext, type) | |
{ | |
var level=map.getLevel(); | |
//special case when map is not zoomed-in and we have a point input | |
if((level<5)&&(ext.getWidth()<50)&&(featcount==1)) | |
{ | |
map.centerAndZoom(ext.getCenter(),8); | |
showExt=map.extent; | |
} | |
else{ | |
if (showExt==null) | |
{ | |
showExt=ext; | |
} | |
else | |
{ | |
showExt=showExt.union(ext); | |
//map.setExtent(); | |
} | |
map.setExtent(showExt, true); | |
} | |
} | |
dojo.addOnLoad(init); | |
</script> | |
</head> | |
<body class="soria"> | |
<div> | |
<div id="mainWindow" dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width:99%; height:800px;margin-top:9px"> | |
<div id="map" class="soria" style="border:0px solid darkblue; width:99%; height:800px;" dojotype="dijit.layout.ContentPane" region="center"> | |
</div></div> | |
</div> | |
<span>Cauvery River Overview Map <br> <small>(Generated Under India WRIS Project)</small></span><br> | |
</body> | |
<html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment