vedas

Clone or download

Modified Files

--- 'a/src/main/java/com/GisSatellite/Server/Controller/SatelliteController.java'
+++ b/src/main/java/com/GisSatellite/Server/Controller/SatelliteController.java
@@ -64,6 +64,12 @@ public class SatelliteController {
}
+ @GetMapping("/map")
+ public String map() {
+ return "map";
+
+
+ }
/*
* @RequestMapping("/attributenew") public String homenew() { return
--- 'a/src/main/resources/static/assets/css/style.css'
+++ b/src/main/resources/static/assets/css/style.css
@@ -2197,7 +2197,7 @@ form label {
.shw-rside {
right: 0px;
- width: 240px;
+ width: 360px;
display: block
}
@@ -4306,7 +4306,7 @@ table.dataTable thead .sorting:after {
.vtabs .tab-content {
display: table-cell;
- padding: 20px;
+ padding: 10px;
vertical-align: top
}
--- 'a/src/main/resources/static/customol/js/identify.js'
+++ b/src/main/resources/static/customol/js/identify.js
@@ -38,7 +38,7 @@ var Groupcountt=0;
// <span class="togglebutton" id=layer'+i+'"><label for="visible'+i+'"><input id="visible'+i+'" class="visible" type="checkbox"/><span class="toggle"></span></label></span>
- groupcontentt +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" aria-expanded="true" href="#basemap-choicee'+i+'" aria-controls="collapseOne" class="collapsed">'+groupnamee+':<span id="'+'layerscountt'+i+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choicee'+i+'" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordionn" style=""><div class="card-body" id="'+'layerr'+i+'"></div> </div></div>';
+ groupcontentt +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" aria-expanded="true" href="#basemap-choicee'+i+'" aria-controls="collapseOne" class="collapsed">'+groupnamee+':<span id="'+'layerscountt'+i+'"></span><i style="position: absolute;right: 17px;" class="ti-arrow-circle-down"></i></a></h5></div><div id="basemap-choicee'+i+'" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordionn" style=""><div class="card-body" id="'+'layerr'+i+'"></div> </div></div>';
$('#groupss').append($(groupcontentt));
@@ -51,7 +51,7 @@ var Groupcountt=0;
var basecontentt = '';
let layernamee=sublayerr.get('name');
- basecontentt += '<div class="togglebutton" id="layerr'+i+j+'"><label for="visiblee'+i+j+'"> <input id="visiblee'+i+j+'" type="checkbox" class="visible" /> <span class="toggle"></span>'+layernamee+'</label> </div>';
+ basecontentt += '<div class="togglebutton" id="layerr'+i+j+'"><input id="visiblee'+i+j+'" type="checkbox" class="visible" style=" display: contents;"/><label for="visiblee'+i+j+'"> <span class="toggle"></span>'+layernamee+'</label> </div>';
$('#layerr'+i).append($(basecontentt));
--- 'a/src/main/resources/static/customol/js/layerSwitcher.js'
+++ b/src/main/resources/static/customol/js/layerSwitcher.js
@@ -12,7 +12,7 @@ var Groupcount=0;
groupcontent+='';
// <span class="togglebutton" id=layer'+i+'"><label for="visible'+i+'"><input id="visible'+i+'" class="visible" type="checkbox"/><span class="toggle"></span></label></span>
- groupcontent +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" href="#basemap-choice'+i+'" aria-controls="collapseOne" class="collapsed">'+groupname+':<span id="'+'layerscount'+i+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choice'+i+'" class="collapse" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion" style=""><div class="card-body" id="'+'layer'+i+'"></div> <div id="'+'slider-range-min'+i+'" ></div></div></div>';
+ groupcontent +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" href="#basemap-choice'+i+'" aria-controls="collapseOne" class="collapsed">'+groupname+':<span id="'+'layerscount'+i+'"></span><i style="position: absolute;right: 17px;" class="ti-arrow-circle-down"></i></a></h5></div><div id="basemap-choice'+i+'" class="collapse" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion" style=""><div class="card-body" id="'+'layer'+i+'"></div> <div id="'+'slider-range-min'+i+'" ></div></div></div>';
$('#groups').append($(groupcontent));
@@ -25,7 +25,7 @@ var Groupcount=0;
var basecontent = '';
let layername=sublayer.get('name');
- basecontent += '<div class="togglebutton" id="layer'+i+j+'"><label for="visible'+i+j+'"> <input id="visible'+i+j+'" type="checkbox" class="visible" /> <span class="toggle"></span>'+layername+'</label> <input id="opacity" class="opacity" type="range" min="0" max="1" step="0.01"/></div>';
+ basecontent += '<div class="togglebutton" id="layer'+i+j+'"><input id="visible'+i+j+'" type="checkbox" class="visible" style=" display: contents;"/><label for="visible'+i+j+'"> '+layername+'</label> <input id="opacity" class="opacity" type="range" min="0" max="1" step="0.01"/></div>';
$('#layer'+i).append($(basecontent));
--- 'a/src/main/resources/static/customol/js/main.js'
+++ b/src/main/resources/static/customol/js/main.js
@@ -96,8 +96,8 @@ var map = new ol.Map({
//CommonlayersGroup,
//measure(map);
controllers(map);
-//navigation(map);
-//switchlayers(map);
+navigation(map);
+switchlayers(map);
getMousePosition(map);
scaleline(map);
//exportpdf(map);
--- /dev/null
+++ b/src/main/resources/static/customol/js/mainn.js
@@ -0,0 +1,79 @@
+/**
+ * Elements that make up the popup.
+ */
+var container = document.getElementById('popup');
+var content = document.getElementById('popup-content');
+var closer = document.getElementById('popup-closer');
+
+/**
+ * Create an overlay to anchor the popup to the map.
+ */
+var overlay = new ol.Overlay({
+ element: container,
+ autoPan: true,
+ autoPanAnimation: {
+ duration: 250,
+ },
+});
+
+/**
+ * Add a click handler to hide the popup.
+ * @return {boolean} Don't follow the href.
+ */
+closer.onclick = function () {
+ overlay.setPosition(undefined);
+ closer.blur();
+ return false;
+};
+window.onload=init;
+
+
+function init()
+{
+ let india=[ 81.191694, 23.8086 ];
+let jalandhar=[75.57917,31.32556];
+var map = new ol.Map({
+ overlays: [overlay],
+ target: 'target-maps',
+
+ view: new ol.View({
+ center : ol.proj.transform(india, 'EPSG:4326','EPSG:3857'),
+ zoom:4.0,
+ // zoom :9.5,
+ minZoom:4,
+ maxZoom: 17
+ }),
+ layers:[
+ z
+ ],
+ controls: ol.control.defaults({
+ zoom: false,
+ attribution: true,
+ rotate: false
+ }).extend([]),
+ // new ol.control.FullScreen()
+
+
+ });
+
+legend(map);
+geom(map);
+//buffer(map);
+controllers(map);
+navigation(map);
+switchlayers(map);
+getMousePosition(map);
+scaleline(map);
+exportpdf(map);
+identify(map);
+//addGeom(map);
+commonfunctions(map);
+//swipe(map);
+//geocoder(map);
+
+
+
+
+
+
+}
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/LayersGroup/IdentifyLayerGroup.js
@@ -0,0 +1,29 @@
+//var wmsurl='https://gis.ncog.gov.in/CoronaAPI/CoronaWMS';
+//var wmsurl='https://gis.ncog.gov.in/GISWeb/wms'
+var wmsurl='https://gis.ncog.gov.in/GeoserverWebAPI/wms62'
+var IdentifyLayerGroup = new ol.layer.Group({
+ layers : [
+
+
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : 'park_boundary_iis',
+ format_options:'dpi:180',
+ version : '1.1.1',
+ STYLES:''
+ }
+ }),
+ showLegend: true,
+ //maxResolution : 256,
+ name : 'Park Boundry',
+ visible:false
+ }),
+
+
+ ],
+ name : 'Identify'
+ });
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/LayersGroup/commonlayersGroup.js
@@ -0,0 +1,43 @@
+var CommonlayersGroup = new ol.layer.Group({
+ layers : [
+
+ new ol.layer.Tile({
+ visible : false,
+ preload : Infinity,
+ opacity: 1,
+ source : new ol.source.BingMaps(
+ {
+ key : 'Auw0s19PwLEd-w-GFNBPzqs2lekVJE5KjKtxg0EwzB6nuvocKYwMJ7ZJnfnltPgM', //'AkGbxXx6tDWf1swIhPJyoAVp06H0s0gDTYslNWWHZ6RoPqMpB9ld5FY1WutX8UoF',
+ imagerySet : 'Aerial'
+ // use maxZoom 19 to see stretched tiles instead of the BingMaps
+ // "no photos at this zoom level" tiles
+ // maxZoom: 19
+ }),
+ name : 'Aerial'
+ }),
+ new ol.layer.Tile({
+ visible : false,
+ preload : Infinity,
+ source : new ol.source.BingMaps({
+ key :'Auw0s19PwLEd-w-GFNBPzqs2lekVJE5KjKtxg0EwzB6nuvocKYwMJ7ZJnfnltPgM', //'AkGbxXx6tDWf1swIhPJyoAVp06H0s0gDTYslNWWHZ6RoPqMpB9ld5FY1WutX8UoF',
+ imagerySet : 'AerialWithLabels',
+ // use maxZoom 19 to see stretched tiles instead of the BingMaps
+ // "no photos at this zoom level" tiles
+ // maxZoom: 19
+ }),
+ name : 'Aerial+Labels'
+ }),
+ new ol.layer.Tile({
+ visible : false,
+ source : new ol.source.OSM(),
+ name : 'OSM'
+ }),
+ new ol.layer.Tile({
+ visible : true,
+ source: new ol.source.TileImage({url: 'http://maps.google.com/maps/vt?pb=!1m5!1m4!1i{z}!2i{x}!3i{y}!4i256!2m3!1e0!2sm!3i375060738!3m9!2spl!3sUS!5e18!12m1!1e47!12m3!1e37!2m1!1ssmartmaps!4e0'}),
+ name : 'Google Map'
+ })
+
+ ],
+ name : 'Basemaps'
+ });
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/LayersGroup/geomGroup.js
@@ -0,0 +1,27 @@
+//var wmsurl='https://gis.ncog.gov.in/CoronaAPI/CoronaWMS';
+var wmsurl='http://localhost:8080/geoserver/PostgresSql/wms'
+var geomLayerGroup = new ol.layer.Group({
+ layers : [
+
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :'http://localhost:8080/geoserver/PostgresSql/wms',
+ // crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : 'geom',
+ format_options:'dpi:180',
+ version : '1.1.1',
+ STYLES:''
+ }
+ }),
+ showLegend: false,
+ //maxResolution : 256,
+ name : 'Geom',
+ visible:true
+ }),
+
+
+ ],
+ name : 'GeomGroup'
+ });
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/LayersGroup/indianmapLayersGroup.js
@@ -0,0 +1,86 @@
+//var wmsurl='https://gis.ncog.gov.in/CoronaAPI/CoronaWMS';
+var wmsurl='https://gis.ncog.gov.in/GISWeb/wms';
+//var wmsurl='https://gis.ncog.gov.in/GeoserverWebAPI/wms62'
+var st="STCODE11='03'";
+var di="dtcode11 ='037'";
+var ta="dtcode11 ='037'";
+var vil="DT_2011 ='037'";
+
+var indianMapLayersGroup = new ol.layer.Group({
+ layers : [
+
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : 'VillageIndia',
+ format_options:'dpi:180',
+ version : '1.1.1',
+ // CQL_FILTER : vil
+ }
+ }),
+ showLegend: true,
+ maxResolution : 256,
+ name : 'Village',
+ visible:true
+ }),
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : wmsurl,//'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ layers : 'TalukaIndia',
+ version : '1.1.1',format_options:'dpi:110',
+ // CQL_FILTER : ta
+ }
+ }),
+ showLegend: true,
+ maxResolution : 1024,
+ name : 'Taluka',
+ visible:true
+ }),
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ layers : 'DistrictIndia',
+ // CQL_FILTER : di,
+ version : '1.1.1',format_options:'dpi:110'
+ //version : '1.1.1',CQL_FILTER : 'dtcode11 IN (001,003,004)' ,format_options:'dpi:110'
+ }
+ }),
+ showLegend: true,
+ maxResolution : 2048,
+ name : 'District',
+ visible:true
+
+ })
+ ,
+
+
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ layers : 'StateIndia',
+ // CQL_FILTER : st,
+ version : '1.1.1',format_options:'dpi:110',
+ //CQL_FILTER : di
+ //version : '1.1.1',CQL_FILTER : 'STCODE11 IN (01,02,004)' ,format_options:'dpi:110'
+ }
+ }),
+ styles:'IndiaState',
+ showLegend: true,
+ visible:true,
+ name : 'State'
+ }),
+ ],
+ name : 'India Boundaries'
+ });
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/LayersGroup/transportGroup.js
@@ -0,0 +1,58 @@
+//var wmsurl='https://gis.ncog.gov.in/CoronaAPI/CoronaWMS';
+var wmsurl='https://gis.ncog.gov.in/GISWeb/wms'
+var transportLayerGroup = new ol.layer.Group({
+ layers : [
+
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : 'india_airport_location_basemap',
+ format_options:'dpi:180',
+ version : '1.1.1',
+ STYLES:''
+ }
+ }),
+ showLegend: false,
+ //maxResolution : 256,
+ name : 'Airport',
+ visible:false
+ }),
+
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : 'india_nhai',
+ format_options:'dpi:180',
+ version : '1.1.1',
+ STYLES:''
+ }
+ }),
+ showLegend: true,
+ //maxResolution : 256,
+ name : 'National Highway',
+ visible:false
+ }),
+ // new ol.layer.Tile({
+ // source : new ol.source.TileWMS({
+ // url :wmsurl,// 'http://192.168.1.89:8090/geoserver/cite/wms',
+ // crossOrigin: 'anonymous',
+ // params : {
+ // 'LAYERS' : 'plot_boundary_new',
+ // format_options:'dpi:180',
+ // version : '1.1.1',
+ // STYLES:''
+ // }
+ // }),
+ // showLegend: true,
+ // //maxResolution : 256,
+ // name : 'Dehgam',
+ // visible:true
+ // })
+ ],
+ name : 'Transport'
+ });
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/buffer/buffer.js
@@ -0,0 +1,185 @@
+var map;
+var clickEvent;
+var range = document.getElementById('range');
+var value=document.getElementById('bufferrange').defaultValue;
+var selecterange=value;
+
+function buffer(m)
+{
+ map=m;
+range.innerHTML=value;
+
+
+
+}
+$("#buffer").bind("click", function() {
+
+ activatebuffer();
+});
+function activatebuffer()
+{
+
+ deactivateClick();
+ setCursor(cursorStyle);
+
+ clickEvent = (evt) => {
+ // map.removeLayer(vectorLayer_buffer);
+ // vectorSource.getSource().clear();
+ var features=[];
+ var lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ var lat= lonlat[0];
+ var lon=lonlat[1];
+ var coordMin = ol.proj.fromLonLat([lon,lat], 'EPSG:3857');
+ var coordMax = ol.proj.fromLonLat([lon,lat], 'EPSG:3857');
+ var extent=[coordMin[0],coordMin[1],coordMax[0],coordMax[1]];
+
+
+
+ extent = ol.proj.transformExtent(extent, 'EPSG:4326', 'EPSG:3857');
+
+
+ map.getView().fit(extent);
+ map.getView().setCenter(ol.proj.transform([lat, lon], 'EPSG:4326', 'EPSG:3857'));
+
+ map.getView().setZoom(12);
+
+
+ getvillagebuffer(lat,lon,selecterange);
+ console.log(value)
+ var point = new ol.geom.Circle(ol.proj.transform([lat,lon],'EPSG:4326', 'EPSG:3857'),selecterange*1210);
+ console.log(point.getCenter());
+ console.log(point);
+ var pointFeature = new ol.Feature(point);
+ features.push(pointFeature);
+
+
+ var vectorSource = new ol.source.Vector({
+ projection: 'EPSG:4326',
+ features: features
+ });
+ var vectorLayer_buffer = new ol.layer.Vector({
+ source : vectorSource,
+ style : customStyleFunction()
+ });
+ console.log(vectorLayer_buffer)
+ map.addLayer(vectorLayer_buffer);
+
+
+
+
+
+ };
+
+
+
+
+ map.on('singleclick', clickEvent);
+}
+function customStyleFunction()
+{
+ return [ new ol.style.Style({
+ fill : new ol.style.Fill({
+
+ opacity : 0.6,
+ color : 'rgba(255,255,204,0.3)'
+ }),
+ stroke : new ol.style.Stroke({
+ width : 2,
+
+ color : 'red',
+ radius : 1
+ }),
+ image : new ol.style.Circle({
+ fill : new ol.style.Fill({
+
+ color : 'rgba(51, 204, 255,0.3)'
+ }),
+ stroke : new ol.style.Stroke({
+ width : 1,
+ color : 'blue'
+
+ }),
+ radius : 3
+ }),
+ })];
+
+
+}
+var bufferrange=$('#bufferrange');
+bufferrange.on('change', function () {
+
+ range.innerHTML = '';
+
+ if(this.value!=="")
+ {
+ range.innerHTML = this.value ;
+ selecterange=this.value;
+ }
+
+
+
+
+
+
+
+
+ });
+ function getvillagebuffer(lat,lon,value)
+ {
+
+ var features = [];
+ var j=getBuffer(lat,lon,value);
+
+ if(j!="") {
+
+ var data={"lat":lat,"lon":lon,"range":value};
+ var dataObjectString = JSON.stringify(data);
+
+ console.log(dataObjectString);
+
+ var enc = Base64.encode(dataObjectString);
+
+ window.open('bufferReport?data='+enc,"_blank");
+
+ console.log(j);
+ var geomP, feature;
+
+
+
+ for (var i = 0; i < j.length; i++) {
+ latitude=j[i].lon;
+ longitude=j[i].lat;
+ geomP = new ol.geom.Point(ol.proj.transform([latitude, longitude ], 'EPSG:4326', 'EPSG:3857'));
+ feature = new ol.Feature(geomP);
+ features.push(feature);
+ }
+
+ var point_geom = new ol.geom.Point(
+ [20, 20]
+ );
+ point_feature.setGeometry(point_geom);
+ var vector_layer = new ol.layer.Vector({
+ source: new ol.source.Vector({
+ features: [point_feature]
+ })
+ })
+ map.addLayer(vector_layer);
+
+ var vectorSource = new ol.source.Vector({
+
+ features : features
+ });
+
+ var vectorLayer = new ol.layer.Vector({
+ source : vectorSource,
+ style : customStyleFunction()
+ });
+ console.log(vectorLayer);
+ map.addLayer(vectorLayer);
+
+
+ };
+
+
+ }
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/buffer/bufferReport.js
@@ -0,0 +1,126 @@
+$(document).ready(function() {
+ var url_string = window.location;
+ var url = new URL(url_string);
+ var data = url.searchParams.get("data");
+ var d=JSON.parse(Base64.decode(data));
+console.log(d);
+ let lat=d.lat;
+ let lon=d.lon;
+ let range=d.range;
+
+ var j=getBuffer(lat,lon,range);
+
+ if(j) {
+
+ loadtable(j);
+
+
+
+
+
+
+ };
+
+});
+
+
+
+ function loadtable(data)
+{
+
+
+ if ( $.fn.DataTable.isDataTable( '#BufferReportList' ) ) {
+ $("#BufferReportList").dataTable().fnDestroy();
+ $('#BufferReportList').empty();
+ }
+ var gid=data.map(x=>x.gid);
+
+ console.log(gid);
+ var table=$('#BufferReportList').DataTable({
+ pageLength : 10,
+ dom: 'Bfrtip',
+
+ 'processing': true,
+
+ "data":data ,
+
+ columns : [{
+ title : 'SR_NO',
+ data : 'gid'
+
+ }, {
+ title : 'First Name',
+ data : 'firstname'
+ }, {
+ title : 'Last Name',
+ data : 'lastname'
+ }, {
+ title : 'STATE',
+ data : 'statename'
+ }, {
+ title : 'DISTRICT',
+ data : 'distictname',
+
+ }, {
+ title : 'TALUKA',
+ data : 'talukaname',
+
+ },{
+ title : 'VILLAGE',
+ data : 'villagename',
+
+ }
+ ,{title : 'Action',
+ data: null,
+ className: "center",
+ defaultContent: '<button class="btn btn-danger btn-sm " id="delete">Delete </button>'
+ },{title : 'Action',
+ data: null,
+ className: "center",
+ defaultContent: '<button class="btn btn-primary btn-sm" id="update">Update </button>'
+ }
+
+ ]
+
+ });
+
+ $('#BufferReportList tbody').on('click', 'button#update', function ()
+ {
+
+ var data = table.row( $(this).closest('tr') ).data();
+
+
+ id=data['gid'];
+
+ $("#editId").val(id);
+ $("#editASIMonumentFrom").submit();
+
+
+
+ } )
+
+
+ $('#BufferReportList tbody').on('click', 'button#delete', function ()
+ {
+
+ var data = table.row( $(this).closest('tr') ).data();
+
+
+ id=data['gid'];
+
+
+ var data=DeleteGeomreportbyId(id);
+ loadtable(data);
+ location.reload();
+ } )
+
+
+
+
+}
+
+
+
+
+
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/commonfunctions/Base64.js
@@ -0,0 +1,125 @@
+var Base64 = {
+ _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
+ encode: function(input) {
+ var output = "";
+ var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
+ var i = 0;
+ input = Base64._utf8_encode(input);
+ while (i < input.length) {
+ chr1 = input.charCodeAt(i++);
+ chr2 = input.charCodeAt(i++);
+ chr3 = input.charCodeAt(i++);
+ enc1 = chr1 >> 2;
+ enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+ enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+ enc4 = chr3 & 63;
+
+ if (isNaN(chr2)) {
+ enc3 = enc4 = 64;
+ } else if (isNaN(chr3)) {
+ enc4 = 64;
+ }
+
+ output = output + this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
+
+ }
+
+ return output;
+ },
+
+
+ decode: function(input) {
+ var output = "";
+ var chr1, chr2, chr3;
+ var enc1, enc2, enc3, enc4;
+ var i = 0;
+
+ input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
+
+ while (i < input.length) {
+
+ enc1 = this._keyStr.indexOf(input.charAt(i++));
+ enc2 = this._keyStr.indexOf(input.charAt(i++));
+ enc3 = this._keyStr.indexOf(input.charAt(i++));
+ enc4 = this._keyStr.indexOf(input.charAt(i++));
+
+ chr1 = (enc1 << 2) | (enc2 >> 4);
+ chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+ chr3 = ((enc3 & 3) << 6) | enc4;
+
+ output = output + String.fromCharCode(chr1);
+
+ if (enc3 != 64) {
+ output = output + String.fromCharCode(chr2);
+ }
+ if (enc4 != 64) {
+ output = output + String.fromCharCode(chr3);
+ }
+
+ }
+
+ output = Base64._utf8_decode(output);
+
+ return output;
+
+ },
+
+ _utf8_encode: function(string) {
+ string = string.replace(/\r\n/g, "\n");
+ var utftext = "";
+
+ for (var n = 0; n < string.length; n++) {
+
+ var c = string.charCodeAt(n);
+
+ if (c < 128) {
+ utftext += String.fromCharCode(c);
+ }
+ else if ((c > 127) && (c < 2048)) {
+ utftext += String.fromCharCode((c >> 6) | 192);
+ utftext += String.fromCharCode((c & 63) | 128);
+ }
+ else {
+ utftext += String.fromCharCode((c >> 12) | 224);
+ utftext += String.fromCharCode(((c >> 6) & 63) | 128);
+ utftext += String.fromCharCode((c & 63) | 128);
+ }
+
+ }
+
+ return utftext;
+ },
+
+ _utf8_decode: function(utftext) {
+ var string = "";
+ var i = 0;
+ var c = c1 = c2 = 0;
+
+ while (i < utftext.length) {
+
+ c = utftext.charCodeAt(i);
+
+ if (c < 128) {
+ string += String.fromCharCode(c);
+ i++;
+ }
+ else if ((c > 191) && (c < 224)) {
+ c2 = utftext.charCodeAt(i + 1);
+ string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
+ i += 2;
+ }
+ else {
+ c2 = utftext.charCodeAt(i + 1);
+ c3 = utftext.charCodeAt(i + 2);
+ string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
+ i += 3;
+ }
+
+ }
+
+ return string;
+ }
+
+ }
+
+
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/commonfunctions/clear.js
@@ -0,0 +1,24 @@
+var map;
+
+function clear(m)
+{
+map=m;
+}
+
+function deactivateClick()
+{
+
+ setCurser('');
+ if (clickEvent) {
+ map.un('singleclick', clickEvent);
+ }
+}
+function setCurser(cursorType){
+ if (map) {
+
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+}
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/commonfunctions/commonfunctions.js
@@ -0,0 +1,15 @@
+var map;
+function commonfunctions(m)
+{
+map=m;
+
+}
+function setCursor(cursorType)
+ {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/controllers/controllers.js
@@ -0,0 +1,100 @@
+
+var map;
+function controllers(maps)
+{
+ map=maps;
+}
+
+function zoomIn()
+{
+
+map.getView().animate({
+ zoom: map.getView().getZoom() + 1,
+ duration: 500
+ });
+
+
+
+
+}
+
+function zoomOut()
+{
+ map.getView().animate({
+ zoom: map.getView().getZoom() - 1,
+ duration: 500
+ });
+}
+
+function defaultmap()
+{
+ //for Gujarat
+// var extent = [ 66.9973, 19.4081, 75.5887, 24.9398];
+ //for India
+ var extent = [68.17665, 7.96553, 97.40256, 35.49401];
+extent = ol.proj.transformExtent(extent, 'EPSG:4326', 'EPSG:3857');
+map.getView().fit(extent);
+ map.getView().animate({
+ zoom: 4.7,
+ duration: 600
+ });
+
+}
+function fullscreen()
+{
+
+ var elem = document.getElementById('target-map');
+ if (elem.requestFullscreen) {
+ elem.requestFullscreen();
+ } else if (elem.msRequestFullscreen) {
+ elem.msRequestFullscreen();
+ } else if (elem.mozRequestFullScreen) {
+ elem.mozRequestFullScreen();
+ } else if (elem.webkitRequestFullscreen) {
+ elem.webkitRequestFullscreen();
+ }
+}
+function geolocation()
+{
+
+ // if (navigator.geolocation) {
+ // navigator.geolocation.getCurrentPosition(showPosition);
+ // } else {
+ // alert( "Geolocation is not supported by this browser.");
+ // }
+
+
+
+
+ var geolocation = new ol.Geolocation({
+ tracking: true
+ });
+
+
+ geolocation.on('change:position', function() {
+ var coordinate = geolocation.getPosition();
+ let lat=coordinate[1];
+ let lon=coordinate[0];
+ if(lat!=null && lon!=null)
+ {
+ var coordMin = ol.proj.fromLonLat([lon,lat], 'EPSG:3857');
+ var coordMax = ol.proj.fromLonLat([lon,lat], 'EPSG:3857');
+ var extent=[coordMin[0],coordMin[1],coordMax[0],coordMax[1]];
+ map.getView().fit(extent,map.getSize());
+ }
+ else
+ {
+ alert("Position not found");
+ }
+
+ // map.getView().setCenter(coordinate);
+
+ });
+
+
+}
+function showPosition(position) {
+alert(position)
+ var l= "Latitude: " + position.coords.latitude ;
+ var lon="<br>Longitude: " + position.coords.longitude;
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/controllers/mouse-position.js
@@ -0,0 +1,36 @@
+function getMousePosition(map)
+{
+ var latnong=fromLotlong(map.getView().getCenter());
+
+ var pointerMoveListener = map.on('pointermove', (evt) => {
+ if (evt.dragging)
+ {
+ return;
+ }
+ else
+ {
+
+
+ latnong = fromLotlong(evt.coordinate);
+
+ document.getElementById("latlon").innerHTML=latnong;
+ }
+
+ });
+ document.getElementById("latlon").innerHTML=latnong;
+
+
+
+ function fromLotlong(coords)
+ {
+
+ let lonlat = ol.proj.transform(coords, 'EPSG:3857', 'EPSG:4326');
+ let formattedLatlong= [];
+ return formattedLatlong=lonlat.map(x=>x.toFixed(4));
+
+
+
+ }
+
+
+}
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/controllers/scaleline.js
@@ -0,0 +1,13 @@
+function scaleline(map)
+{
+ let target = map.getTarget();
+ console.log(target);
+ const scaleLineControl = new ol.control.ScaleLine({
+ target: document.getElementById(scale),
+
+ });
+ map.addControl(scaleLineControl);
+
+
+}
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/export/exportpdf.js
@@ -0,0 +1,129 @@
+function exportpdf(map)
+{
+
+ var dims = {
+ a0: [1189, 841],
+ a1: [841, 594],
+ a2: [594, 420],
+ a3: [420, 297],
+ a4: [297, 210],
+ a5: [210, 148]
+ };
+ var exportButton = document.getElementById('export-pdf');
+
+ exportButton.addEventListener('click', function() {
+
+ exportButton.disabled = true;
+ document.body.style.cursor = 'progress';
+
+ var format = document.getElementById('format').value;
+ var resolution = document.getElementById('resolution').value;
+ var dim = dims[format];
+ var width = Math.round(dim[0] * resolution / 25.4);
+ var height = Math.round(dim[1] * resolution / 25.4);
+ var size = map.getSize();
+ var viewResolution = map.getView().getResolution();
+
+ map.once('rendercomplete', function() {
+ var mapCanvas = document.createElement('canvas');
+ mapCanvas.width = width;
+ mapCanvas.height = height;
+ var mapContext = mapCanvas.getContext('2d');
+ Array.prototype.forEach.call(document.querySelectorAll('.ol-layer canvas'), function(canvas) {
+ if (canvas.width > 0) {
+ var opacity = canvas.parentNode.style.opacity;
+ mapContext.globalAlpha = opacity === '' ? 1 : Number(opacity);
+ var transform = canvas.style.transform;
+ // Get the transform parameters from the style's transform matrix
+ var matrix = transform.match(/^matrix\(([^\(]*)\)$/)[1].split(',').map(Number);
+ // Apply the transform to the export map context
+ CanvasRenderingContext2D.prototype.setTransform.apply(mapContext, matrix);
+ mapContext.drawImage(canvas, 0, 0);
+ }
+ });
+ var pdf = new jsPDF('landscape', undefined, format);
+ pdf.addImage(mapCanvas.toDataURL('image/jpeg'), 'JPEG', 0, 0, dim[0], dim[1]);
+ pdf.save('map.pdf');
+ // Reset original map size
+ map.setSize(size);
+ map.getView().setResolution(viewResolution);
+ exportButton.disabled = false;
+ document.body.style.cursor = 'auto';
+ });
+
+ // Set print size
+ var printSize = [width, height];
+ map.setSize(printSize);
+ var scaling = Math.min(width / size[0], height / size[1]);
+ map.getView().setResolution(viewResolution / scaling);
+
+ }, false);
+
+
+
+
+}function exportpdf(map)
+{
+
+ var dims = {
+ a0: [1189, 841],
+ a1: [841, 594],
+ a2: [594, 420],
+ a3: [420, 297],
+ a4: [297, 210],
+ a5: [210, 148]
+ };
+ var exportButton = document.getElementById('export-pdf');
+
+ exportButton.addEventListener('click', function() {
+
+ exportButton.disabled = true;
+ document.body.style.cursor = 'progress';
+
+ var format = document.getElementById('format').value;
+ var resolution = document.getElementById('resolution').value;
+ var dim = dims[format];
+ var width = Math.round(dim[0] * resolution / 25.4);
+ var height = Math.round(dim[1] * resolution / 25.4);
+ var size = map.getSize();
+ var viewResolution = map.getView().getResolution();
+
+ map.once('rendercomplete', function() {
+ var mapCanvas = document.createElement('canvas');
+ mapCanvas.width = width;
+ mapCanvas.height = height;
+ var mapContext = mapCanvas.getContext('2d');
+ Array.prototype.forEach.call(document.querySelectorAll('.ol-layer canvas'), function(canvas) {
+ if (canvas.width > 0) {
+ var opacity = canvas.parentNode.style.opacity;
+ mapContext.globalAlpha = opacity === '' ? 1 : Number(opacity);
+ var transform = canvas.style.transform;
+ // Get the transform parameters from the style's transform matrix
+ var matrix = transform.match(/^matrix\(([^\(]*)\)$/)[1].split(',').map(Number);
+ // Apply the transform to the export map context
+ CanvasRenderingContext2D.prototype.setTransform.apply(mapContext, matrix);
+ mapContext.drawImage(canvas, 0, 0);
+ }
+ });
+ var pdf = new jsPDF('landscape', undefined, format);
+ pdf.addImage(mapCanvas.toDataURL('image/jpeg'), 'JPEG', 0, 0, dim[0], dim[1]);
+ pdf.save('map.pdf');
+ // Reset original map size
+ map.setSize(size);
+ map.getView().setResolution(viewResolution);
+ exportButton.disabled = false;
+ document.body.style.cursor = 'auto';
+ });
+
+ // Set print size
+ var printSize = [width, height];
+ map.setSize(printSize);
+ var scaling = Math.min(width / size[0], height / size[1]);
+ map.getView().setResolution(viewResolution / scaling);
+
+ }, false);
+
+
+
+
+}
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/findbylocation/findbylocation.js
@@ -0,0 +1,206 @@
+var map;
+var maxFeatures =10;
+var cursorStyle = 'crosshair';
+var placeholder = 'Select query layer';
+var zoomOnRowClick = true;
+var hlightFeatures = true;
+
+var clickEvent;
+var vectorLayer6= new ol.layer.Vector;
+var features= new ol.Feature;
+var hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+var latitude;
+var logitude;
+var geojson=new ol.format.GeoJSON();
+var WMSGetFeatureInfo=ol.format.WMSGetFeatureInfo;
+
+function findbylocation(maps)
+{
+
+ map=maps;
+
+
+
+
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+
+ activateClick(layer);
+}
+
+function findlayeByName(layer, key, value) {
+
+ if (layer.get(key) === value) {
+ return layer;
+ }
+ // Find recursively if it is a group
+ if (layer.getLayers) {
+ var layers = layer.getLayers().getArray(), len = layers.length, result;
+ for (var i = 0; i < len; i++) {
+ result = findlayeByName(layers[i], key, value);
+ if (result) {
+ return result;
+ }
+ }
+ }
+ return null;
+}
+
+function addHoverLayer()
+{
+
+
+ if (placeholder) {
+ hoverLayer.setStyle(hoverStyle);
+ }
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+ }
+}
+function activateClick(layer)
+{
+ hoverLayer.getSource().clear();
+ deactivateClick();
+
+
+
+
+
+
+
+
+
+
+ clickEvent = (evt) => {
+console.log(vectorLayer6);
+ // if(layer!=null)
+ /* {
+ features = layer.getSource().getFeatures();
+ features.forEach((feature) => {
+ layer.getSource().removeFeature(feature);
+ }); */
+ // }
+
+
+
+ let lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ latitude= lonlat[0];
+ logitude=lonlat[1];
+
+
+ // this.geomService.getstaelistmap(latong,'Point').subscribe(data => this.statlistmap = data,);
+
+
+
+
+
+ features = [];
+ filterdata=[];
+
+ if (layer instanceof ol.layer.Tile ||layer instanceof ol.layer.Image || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Heatmap || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Layer || layer instanceof ol.layer.VectorTile)
+ {
+
+ const url = _getFeatureInfoUrl(
+ layer.getSource(),
+ evt.coordinate,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+
+ );
+ }
+
+/* if (url)
+ {
+
+
+
+ $.get(url, function(response)
+
+ {
+ response = JSON.parse(response);
+
+ var a= response.features[0].properties.vill_id
+
+
+
+
+
+
+ if (data.hasOwnProperty('features'))
+ {
+
+ // convert the GeoJSON response to Feature array
+ features = geojson.readFeatures(data);
+
+
+
+ features.forEach((feat) => {
+ const props = { ...feat.getProperties() };
+ console.log(props.dist_id);
+
+ });
+
+
+
+
+ }
+ });
+
+
+ }
+ }
+ else
+
+ {
+ alert('Currently only WMS query is supported. Please select another layer!')
+
+
+
+ }*/
+ };
+ map.on('singleclick', clickEvent);
+
+
+}
+
+function deactivateClick() {
+ setCursor('');
+ if (clickEvent) {
+ map.un('singleclick', sclickEvent);
+ }
+ }
+
+function setCursor(cursorType) {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
+
+function _getFeatureInfoUrl( source,coordinate,resolution, srs)
+ {
+
+ const styles = source.getParams().hasOwnProperty('STYLES')
+ ? source.getParams().STYLES
+ : '';
+ /* const url = source.getSource().getGetFeatureInfoUrl(
+ coordinate, resolution, 'EPSG:3857',
+ {'INFO_FORMAT': 'application/json'}); */
+
+ const url = source.getGetFeatureInfoUrl(coordinate, resolution, srs,{
+ INFO_FORMAT: 'application/json',
+ FEATURE_COUNT: maxFeatures,
+ STYLES: styles
+
+ });
+
+ /* const url = source.getGetFeatureInfoUrl(coordinate, resolution, 'EPSG:3857',
+ {'INFO_FORMAT': 'application/json'})*/
+
+ return url;
+ }
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geocoder/geocoder.js
@@ -0,0 +1,40 @@
+var map;
+function geocoder(m)
+ {
+ map=m;
+
+
+
+
+
+var geocoder = new Geocoder('nominatim', {
+ provider : 'osm',
+ key : ' AIzaSyClQ0GOW55zhw4PvFh73FyGLHdSd4bJfpM',
+ lang : 'en',
+ //targetType: 'text-input',
+ placeholder : 'Search location',
+ autoComplete: true,
+ limit : 5,
+ keepOpen : false
+});
+map.addControl(geocoder);
+
+
+
+
+
+//Listen when an address is chosen
+geocoder.on('addresschosen', function(evt){
+ var feature = evt.feature,
+ coord = evt.coordinate,
+ address = evt.address;
+ geocoder.getSource().clear();
+ geocoder.getSource().addFeature(feature);
+ // some popup solution
+ content.innerHTML = '<p>'+ address.formatted +'</p>';
+ overlay.setPosition(coord);
+});
+
+
+
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/addGeom.js
@@ -0,0 +1,317 @@
+var map;
+var clickEvent;
+var vectorLayer6=ol.layer.Vector;
+var features= ol.Feature[10];
+var geojson = new ol.format.GeoJSON;
+var hoverLayer =ol.layer.Vector;
+var vectorSource;
+var zoomOnRowClick;
+var maxFeatures;
+ var highlightFeatures;
+ var cursorStyle;
+ var hoverStyle= [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+
+ var pointStyle =[
+
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: 'rgba(255, 255, 255, 0.2)'
+ }),
+ stroke: new ol.style.Stroke({
+ color: 'red',
+ width: 1
+ }),
+ image: new ol.style.Circle({
+ radius: 3,
+ fill: new ol.style.Fill({
+ color: 'red'
+ })
+ })
+ })
+ ];
+
+
+
+function addGeom(m)
+{
+map=m;
+maxFeatures = 1;
+cursorStyle = 'crosshair';
+zoomOnRowClick = true;
+highlightFeatures = true;
+
+addHoverLayer();
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+activateGeomLayer(layer);
+}
+$("#geom").bind("click", function() {
+
+
+ });
+function addHoverLayer()
+ {
+
+ hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+
+ pointLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+ if(pointStyle)
+ {
+ pointLayer.setStyle(pointStyle);
+ }
+ if (hoverStyle) {
+
+ hoverLayer.setStyle(hoverStyle);
+ }
+ map.addLayer(pointLayer);
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+
+ }
+
+
+
+
+ }
+ function customStyleFunction ()
+ {
+ return [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+ }
+function activateGeomLayer(layer)
+{
+console.log(layer);
+hoverLayer.getSource().clear();
+pointLayer.getSource().clear();
+
+
+
+deactivateClick();
+setCursor(cursorStyle);
+
+
+
+clickEvent = (evt) =>
+{
+
+// onFeatureSelected(evt);
+
+// if(vectorLayer6!=null)
+// {
+
+// var f = vectorLayer6.getSource().getFeatures();
+// f.forEach((fe) => {
+// vectorLayer6.getSource().removeFeature(fe);
+// });
+//}
+
+
+
+
+ var lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ latitude= lonlat[0];
+ logitude=lonlat[1];
+
+
+// this.geomService.getstaelistmap(latong,'Point').subscribe(data => this.statlistmap = data,);
+
+
+
+
+
+ features = [];
+ filterdata=[];
+
+ if (layer instanceof ol.layer.Tile ||layer instanceof layer.Image || layer instanceof layer.Vector || layer instanceof layer.Heatmap || layer instanceof layer.Vector || layer instanceof layer.Layer || layer instanceof layer.VectorTile)
+ {
+
+
+
+ const styles = layer.getSource().getParams().STYLES;
+
+
+const url = layer.getSource().getFeatureInfoUrl(
+
+ evt.coordinate,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+ {
+ 'INFO_FORMAT' : 'application/json',
+ 'FEATURE_COUNT': maxFeatures,
+ 'STYLES': styles
+
+ }
+
+ );
+
+
+
+ if (url) {
+
+ $.get(url, function(response) {
+
+ hoverLayer.getSource().clear();
+ pointLayer.getSource().clear();
+
+
+ features = geojson.readFeatures(response);
+ features.forEach((feat) => {
+ console.log(feat)
+ const extent=feat.getGeometry().getExtent();
+
+ hoverLayer.getSource().addFeature(feat);
+
+
+ map.getView().fit(extent,{ duration: 600});
+
+ const props = { ...feat.getProperties() };
+ console.log(props)
+ });
+ var response = JSON.parse(response);
+
+
+ const a=response.features.map(x=>x.properties)[0];
+ console.log(a);
+ let lat=latitude;
+ let lon=logitude;
+ let stateCode=a.ST_2011;
+ let districtCode=a.DT_2011;
+ let talukaCode=a.SDT_2011;
+ let villageCode=a.VIL_2011;
+ let villageName=a.VIL_NAME11;
+
+
+ document.getElementById("lat").value =lat;
+ document.getElementById("lon").value =lon;
+ loadstate(stateCode);
+ loaddistrict(stateCode,districtCode);
+ loadtaluka(districtCode,talukaCode);
+ loadvillage(talukaCode,villageCode);
+
+
+
+
+
+
+
+
+
+
+
+ })
+
+
+
+ }
+ }
+else
+
+ {
+ alert(
+ 'Currently only WMS query is supported. Please select another layer!'
+
+ );
+ }
+
+
+}
+map.on('singleclick', clickEvent);
+
+
+
+
+
+
+
+
+}
+
+ function onFeatureSelected(evt= ol.Feature) {
+console.log(evt);
+ hoverLayer.getSource().clear();
+
+ if (evt !== null)
+ {
+
+ // const projCode: string = this.selected.getLayer().getSource().getProjection().getCode();
+ const viewProjCode = map.getView().getProjection().getCode();
+ const projCode='EPSG:3857';
+ // const projCode='EPSG:4326';
+
+
+ const feat = evt.clone();
+
+ feat.setGeometry(feat.getGeometry().transform(projCode, viewProjCode));
+
+ hoverLayer.getSource().addFeature(feat);
+
+
+
+
+ map.getView().fit(feat.getGeometry().getExtent(), {
+ duration: 500
+ });
+ }
+
+
+
+ }
+function removeHoverLayer() {
+
+ map.removeLayer(hoverLayer);
+
+ }
+function setCursor(cursorType) {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
+
+
+function findlayeByName(layer, key, value) {
+
+ if (layer.get(key) === value) {
+ return layer;
+ }
+ // Find recursively if it is a group
+ if (layer.getLayers) {
+ var layers = layer.getLayers().getArray(), len = layers.length, result;
+ for (var i = 0; i < len; i++) {
+ result = findlayeByName(layers[i], key, value);
+ if (result) {
+ return result;
+ }
+ }
+ }
+ return null;
+}
+
+
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/addGeomNew.js
@@ -0,0 +1,319 @@
+var map;
+var clickEvent;
+var vectorLayer6=ol.layer.Vector;
+var features= ol.Feature[10];
+var geojson = new ol.format.GeoJSON;
+var hoverLayer =ol.layer.Vector;
+var vectorSource;
+var zoomOnRowClick;
+var maxFeatures;
+ var highlightFeatures;
+ var cursorStyle;
+ var hoverStyle= [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+
+ var pointStyle =[
+
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: 'rgba(255, 255, 255, 0.2)'
+ }),
+ stroke: new ol.style.Stroke({
+ color: 'red',
+ width: 1
+ }),
+ image: new ol.style.Circle({
+ radius: 3,
+ fill: new ol.style.Fill({
+ color: 'red'
+ })
+ })
+ })
+ ];
+
+
+
+function addGeom(m)
+{
+map=m;
+maxFeatures = 1;
+cursorStyle = 'crosshair';
+zoomOnRowClick = true;
+highlightFeatures = true;
+
+addHoverLayer();
+}
+$("#geom").bind("click", function() {
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+activateGeomLayer(layer);
+
+ });
+function addHoverLayer()
+ {
+
+ hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+
+ pointLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+ if(pointStyle)
+ {
+ pointLayer.setStyle(pointStyle);
+ }
+ if (hoverStyle) {
+
+ hoverLayer.setStyle(hoverStyle);
+ }
+ map.addLayer(pointLayer);
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+
+ }
+
+
+
+
+ }
+ function customStyleFunction ()
+ {
+ return [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+ }
+function activateGeomLayer(layer)
+{
+console.log(layer);
+hoverLayer.getSource().clear();
+pointLayer.getSource().clear();
+
+
+
+deactivateClick();
+setCursor(cursorStyle);
+
+
+
+clickEvent = (evt) =>
+{
+
+// onFeatureSelected(evt);
+
+// if(vectorLayer6!=null)
+// {
+
+// var f = vectorLayer6.getSource().getFeatures();
+// f.forEach((fe) => {
+// vectorLayer6.getSource().removeFeature(fe);
+// });
+//}
+
+
+
+
+ var lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ latitude= lonlat[0];
+ logitude=lonlat[1];
+
+
+// this.geomService.getstaelistmap(latong,'Point').subscribe(data => this.statlistmap = data,);
+
+
+
+
+
+ features = [];
+ filterdata=[];
+
+ if (layer instanceof ol.layer.Tile ||layer instanceof layer.Image || layer instanceof layer.Vector || layer instanceof layer.Heatmap || layer instanceof layer.Vector || layer instanceof layer.Layer || layer instanceof layer.VectorTile)
+ {
+
+
+
+ const styles = layer.getSource().getParams().STYLES;
+
+
+const url = layer.getSource().getFeatureInfoUrl(
+
+ evt.coordinate,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+ {
+ 'INFO_FORMAT' : 'application/json',
+ 'FEATURE_COUNT': maxFeatures,
+ 'STYLES': styles
+
+ }
+
+ );
+
+
+
+ if (url) {
+
+ $.get(url, function(response) {
+
+ hoverLayer.getSource().clear();
+ pointLayer.getSource().clear();
+
+
+ features = geojson.readFeatures(response);
+ demo.showSwal('success-message');
+ features.forEach((feat) => {
+ console.log(feat)
+ const extent=feat.getGeometry().getExtent();
+
+ hoverLayer.getSource().addFeature(feat);
+
+
+ map.getView().fit(extent,{ duration: 600});
+
+ const props = { ...feat.getProperties() };
+ console.log(props)
+ });
+ var response = JSON.parse(response);
+
+
+ const a=response.features.map(x=>x.properties)[0];
+ console.log(a);
+ let lat=latitude;
+ let lon=logitude;
+ let stateCode=a.ST_2011;
+ let districtCode=a.DT_2011;
+ let talukaCode=a.SDT_2011;
+ let villageCode=a.VIL_2011;
+ let villageName=a.VIL_NAME11;
+ //selectedstate(stateCode);
+ //selecteddistrict(districtCode);
+ //selectedtaluka(talukaCode);
+ //selectedvillage(villageCode);
+
+
+ var data={"lat":lat,"lon":lon,"stateCode":stateCode,"districtCode":districtCode,"talukaCode":talukaCode,"villageCode":villageCode};
+ var dataObjectString = JSON.stringify(data);
+ //var b=$.base64.encode("hello");
+ //console.log(b);
+
+ var enc = Base64.encode(dataObjectString);
+ console.log(enc);
+ window.open('addgeom?id='+enc,"_blank");
+
+
+
+
+
+
+
+ })
+
+
+
+ }
+ }
+else
+
+ {
+ alert(
+ 'Currently only WMS query is supported. Please select another layer!'
+
+ );
+ }
+
+
+}
+map.on('singleclick', clickEvent);
+
+
+
+
+
+
+
+
+}
+
+ function onFeatureSelected(evt= ol.Feature) {
+console.log(evt);
+ hoverLayer.getSource().clear();
+
+ if (evt !== null)
+ {
+
+ // const projCode: string = this.selected.getLayer().getSource().getProjection().getCode();
+ const viewProjCode = map.getView().getProjection().getCode();
+ const projCode='EPSG:3857';
+ // const projCode='EPSG:4326';
+
+
+ const feat = evt.clone();
+
+ feat.setGeometry(feat.getGeometry().transform(projCode, viewProjCode));
+
+ hoverLayer.getSource().addFeature(feat);
+
+
+
+
+ map.getView().fit(feat.getGeometry().getExtent(), {
+ duration: 500
+ });
+ }
+
+
+
+ }
+function removeHoverLayer() {
+
+ map.removeLayer(hoverLayer);
+
+ }
+function setCursor(cursorType) {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
+
+
+function findlayeByName(layer, key, value) {
+
+ if (layer.get(key) === value) {
+ return layer;
+ }
+ // Find recursively if it is a group
+ if (layer.getLayers) {
+ var layers = layer.getLayers().getArray(), len = layers.length, result;
+ for (var i = 0; i < len; i++) {
+ result = findlayeByName(layers[i], key, value);
+ if (result) {
+ return result;
+ }
+ }
+ }
+ return null;
+}
+
+
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/geom.js
@@ -0,0 +1,389 @@
+var map;
+var layers=new ol.layer.Vector;
+var feature=new ol.Feature;
+var geometryType='Point';
+var precision = 2;
+var cursorStyle = 'pointer';
+var fillColor = [255, 255, 255, 0.5];
+var strokeColor = [72, 72, 72, 1];
+var textColor = [strokeColor[0], strokeColor[1], strokeColor[2], 1];
+var textOutlineColor = [fillColor[0], fillColor[1], fillColor[2], 0.7];
+var font = 'normal 14px Arial';
+
+var draw;
+
+var displaylength = document.getElementById('distance');
+var displayarea = document.getElementById('area');
+
+
+var sourceDraw = new ol.source.Vector();
+
+var vectorDraw = new ol.layer.Vector({
+ source: sourceDraw,
+ style: new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: 'rgba(255, 255, 255, 0.2)'
+ }),
+ stroke: new ol.style.Stroke({
+ color: 'red',
+ width: 1
+ }),
+ image: new ol.style.Circle({
+ radius: 3,
+ fill: new ol.style.Fill({
+ color: 'red'
+ })
+ })
+ })
+ });
+
+
+function geom(m)
+{
+map=m
+
+
+ units= map.getView().getProjection().getUnits();
+
+
+layers = new ol.layer.Vector({
+ source: new ol.source.Vector(),
+ style: (feature ) => {
+ return getStyle(feature);
+ }
+ });
+
+// activateDraw();
+
+
+
+}
+function selectedType(gtype)
+{
+ displaylength.innerHTML = '';
+ displayarea.innerHTML = '';
+
+geometryType=gtype;
+
+activateDraw();
+
+}
+
+function activateDraw()
+{
+
+deactivateDraw();
+
+map.addLayer(layers);
+var wkt = new ol.format.WKT();
+//setCursor(cursorStyle);
+draw= new ol.interaction.Draw({
+ source: vectorDraw.getSource(),
+ type: geometryType,
+
+});
+
+
+
+draw.on('drawstart', (e) => {
+
+ map.removeLayer(vectorDraw);
+ sourceDraw.clear();//
+
+ layers.getSource().clear();
+});
+draw.on('drawend', (e) => {
+
+
+ let feature = e.feature;
+ let featureClone = feature.clone();
+ featureClone.getGeometry().transform('EPSG:3857', 'EPSG:4326');
+
+ modifiedWKT = wkt.writeFeature(featureClone);
+ map.addLayer(vectorDraw);
+
+
+
+
+ let area=getLengthOrArea(feature);
+let cords=Addpolygongeometry(feature);
+
+ addGeom(cords,modifiedWKT,area);
+
+
+
+ const feat = new ol.Feature({
+
+ geometry: e.target
+ }
+
+ );
+
+
+ getLengthOrArea(feat);
+
+});
+draw.setActive(true);
+map.addInteraction(draw);
+}
+
+
+function deactivateDraw() {
+
+ setCursor('');
+value = null;
+try {
+map.removeInteraction(draw);
+layers.getSource().clear();
+map.removeLayer(layers);
+sourceDraw.clear();
+
+} catch (error) {}
+}
+
+
+
+
+
+
+function getStyle(feature)
+{
+ return [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color:fillColor
+ })
+ }),
+ new ol.style.Style({
+ stroke: new ol.style.Stroke({
+ color: strokeColor,
+ width: 2,
+ lineDash: [5, 5]
+ }),
+ text: new ol.style.Text({
+ textAlign: 'center',
+ textBaseline: 'middle',
+ text: getLengthOrArea(feature),
+ font: font,
+ fill: new ol.style.Fill({
+ color: textColor
+ }),
+ offsetX: 0,
+ offsetY: 0,
+ rotation: 0,
+ stroke: new ol.style.Stroke({
+ color: textOutlineColor,
+ width: 3
+ })
+ })
+ })
+ ];
+ }
+
+
+
+
+
+
+function Addpolygongeometry(feature)
+{
+
+
+ let cordinate = '';
+
+ switch (geometryType) {
+
+
+ case 'LineString':
+ try {
+ cordinate = feature.getGeometry().getFirstCoordinate();
+
+
+ } catch (error) {}
+ break;
+ case 'Polygon':
+ try {
+ cordinate =feature.getGeometry().getFirstCoordinate();
+
+
+ } catch (error) {}
+ break;
+ case 'Square':
+ try {
+ cordinate =feature.getGeometry().getFirstCoordinate();
+
+
+ } catch (error) {}
+ break;
+
+ default:
+ try {
+ cordinate = feature.getGeometry().getCoordinates();
+
+
+ } catch (error) {}
+ break;
+ }
+ // if (cordinate !== '') {
+
+ // cordinate += cordinate;
+
+
+ // }
+
+ return cordinate;
+ }
+function addGeom(cords,wkt,area)
+{
+ console.log(cords);
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+
+ var lonlat = ol.proj.transform(cords, 'EPSG:3857', 'EPSG:4326');
+
+latitude= lonlat[0];
+logitude=lonlat[1];
+
+
+features = [];
+filterdata=[];
+
+
+const styles = layer.getSource().getParams().STYLES;
+
+
+const url = layer.getSource().getFeatureInfoUrl(
+
+ cords,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+ {
+ 'INFO_FORMAT' : 'application/json',
+ 'FEATURE_COUNT': maxFeatures,
+ 'STYLES': styles
+
+}
+
+);
+
+
+
+if (url) {
+
+$.get(url, function(response) {
+
+
+ features = geojson.readFeatures(response);
+ features.forEach((feat) => {
+ console.log(feat)
+ // const extent=feat.getGeometry().getExtent();
+
+ // hoverLayer.getSource().addFeature(feat);
+
+
+ //map.getView().fit(extent,{ duration: 600});
+
+ const props = { ...feat.getProperties() };
+ console.log(props)
+ });
+
+
+ //const extent=a.getGeometry().getExtent();
+ ////alert(extent);
+
+ var response = JSON.parse(response);
+
+const a=response.features.map(x=>x.properties)[0];
+console.log(a);
+
+let lat=latitude;
+let lon=logitude;
+let stateCode=a.ST_2011;
+let districtCode=a.DT_2011;
+let talukaCode=a.SDT_2011;
+let villageCode=a.VIL_2011;
+
+
+
+var data={"lat":lat,"lon":lon,"stateCode":stateCode,"districtCode":districtCode,"talukaCode":talukaCode,"villageCode":villageCode,"area":area,"wkt":wkt};
+var dataObjectString = JSON.stringify(data);
+//var b=$.base64.encode("hello");
+console.log(dataObjectString);
+
+var enc = Base64.encode(dataObjectString);
+
+ window.open('addgeom?id='+enc,"_blank");
+
+
+
+
+
+
+
+ })
+
+
+
+}
+
+}
+
+function getLengthOrArea(feature)
+ {
+
+ let value = '';
+ const geom= feature.getGeometry();
+
+
+
+
+
+
+ switch (geometryType)
+ {
+
+ case 'LineString':
+ try {
+ value = parseFloat(geom.getLength().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ case 'Polygon':
+ try {
+ value = parseFloat(geom.getArea().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+
+ default:
+ try {
+ value = parseFloat(geom.getRadius().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ }
+
+
+ if (value !== '')
+ {
+
+
+ value = value;
+ displaylength.innerHTML = value + ' m';
+ displayarea.innerHTML = value + ' m &sup2;';
+
+
+ }
+
+
+
+
+
+
+
+
+
+ return value;
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/geomForm.js
@@ -0,0 +1,121 @@
+$(document).ready(function() {
+ var url_string = window.location;
+ var url = new URL(url_string);
+ var data = url.searchParams.get("id");
+ var d=JSON.parse(Base64.decode(data));
+console.log(d);
+ let stateCode=d.stateCode;
+ let districtCode=d.districtCode;
+ let talukaCode=d.talukaCode;
+ let villageCode=d.villageCode;
+ let lat=d.lat;
+ let lon=d.lon;
+ let wkt=d.wkt;
+
+ loadstate(stateCode);
+ loaddistrict(stateCode,districtCode);
+ loadtaluka(districtCode,talukaCode);
+ loadvillage(talukaCode,villageCode);
+
+ document.getElementById("lat").value =lat.toFixed(4);
+ document.getElementById("lon").value =lon.toFixed(4);
+ document.getElementById("wktGeom").value = wkt;
+
+
+});
+function loadstate(stateCode)
+{
+var stateId_Hidden=stateCode;
+var j=getState();
+
+var options = '<option value="' + "--Select--" + '" disabled selected>'+"--Select--" + '</option>';
+
+for (var i = 0; i < j.length; i++) {
+
+
+ if (stateId_Hidden == j[i].statecode)
+ {
+
+ options += '<option value="' + j[i].statecode + '" selected="selected">' + j[i].statename+ '</option>';
+
+
+ }
+ else {
+ options += '<option value="' + j[i].statecode + '">' + j[i].statename+ '</option>';
+ }
+}
+$("select#selectedstate").html(options);
+}
+
+function loaddistrict(stateCode,districtCode)
+{
+var distictId_Hidden=districtCode;
+var j=getDistrict(stateCode);
+
+var options = '<option value="' + "--Select--" + '" disabled selected>'+"--Select--" + '</option>';
+
+for (var i = 0; i < j.length; i++) {
+ // alert( " j[i].stcode11 == " + j[i].stcode11);
+
+ if (distictId_Hidden == j[i].districtcode)
+ {
+ // alert("if"+stateId_Hidden);
+ options += '<option value="' + j[i].districtcode + '" selected="selected">' + j[i].districtname+ '</option>';
+
+ // loadDistrict(j[i].stcode11);
+ }
+ else {
+ options += '<option value="' + j[i].districtcode + '">' + j[i].districtname+ '</option>';
+ }
+}
+$("select#selecteddistrict").html(options);
+}
+function loadtaluka(districtCode,talukaCode)
+{
+var talukaId_Hidden=talukaCode;
+var j=getTalukas(districtCode);
+
+var options = '<option value="' + "--Select--" + '" disabled selected>'+"--Select--" + '</option>';
+
+for (var i = 0; i < j.length; i++) {
+ // alert( " j[i].stcode11 == " + j[i].stcode11);
+
+ if (talukaId_Hidden == j[i].talukacode)
+ {
+ // alert("if"+stateId_Hidden);
+ options += '<option value="' + j[i].talukacode + '" selected="selected">' + j[i].talukaname+ '</option>';
+
+ // loadDistrict(j[i].stcode11);
+ }
+ else {
+ options += '<option value="' + j[i].talukacode + '">' + j[i].talukaname+ '</option>';
+ }
+}
+$("select#selectedtaluka").html(options);
+
+}
+function loadvillage(talukaCode,villageCode)
+{
+
+var villageId_Hidden=villageCode;
+var j=getVillage(talukaCode);
+
+var options = '<option value="' + "--Select--" + '" disabled selected>'+"--Select--" + '</option>';
+
+for (var i = 0; i < j.length; i++) {
+ // alert( " j[i].stcode11 == " + j[i].stcode11);
+
+ if (villageId_Hidden == j[i].villagecode)
+ {
+ // alert("if"+stateId_Hidden);
+ options += '<option value="' + j[i].villagecode + '" selected="selected">' + j[i].villagename+ '</option>';
+
+ // loadDistrict(j[i].stcode11);
+ }
+ else {
+ options += '<option value="' + j[i].villagecode + '">' + j[i].villagename+ '</option>';
+ }
+}
+$("select#selectedvillage").html(options);
+
+}
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/measureNEW.js
@@ -0,0 +1,415 @@
+var map;
+var layers=new ol.layer.Vector;
+var feature=new ol.Feature;
+var geojson = new ol.format.GeoJSON;
+var geometryType = 'Point';
+var precision = 2;
+var cursorStyle = 'crosshair';
+var fillColor = [255, 255, 255, 0.5];
+var strokeColor = [72, 72, 72, 1];
+var textColor = [strokeColor[0], strokeColor[1], strokeColor[2], 1];
+var textOutlineColor = [fillColor[0], fillColor[1], fillColor[2], 0.7];
+var font = 'normal 14px Arial';
+var maxFeatures=1;
+var draw;
+
+var displaylength = document.getElementById('distance');
+var displayarea = document.getElementById('area');
+var displayradious = document.getElementById('radious');
+
+
+function selectedType(gtype)
+{
+ displaylength.innerHTML = '';
+ displayarea.innerHTML = '';
+ displayradious.innerHTML = '';
+geometryType=gtype;
+
+activateDraw(geometryType);
+
+}
+
+function activateDraw(geometryType)
+{
+
+
+ hoverLayer.getSource().clear();
+
+ // vectorDraw.getSource().clear();
+
+ var wkt = new ol.format.WKT();
+
+//deactivateDraw();
+
+map.addLayer(layers);
+
+setCursor(cursorStyle);
+
+
+
+
+
+var sourceDraw = new ol.source.Vector();
+
+var vectorDraw = new ol.layer.Vector({
+ source: sourceDraw,
+ style: new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: 'rgba(255, 255, 255, 0.2)'
+ }),
+ stroke: new ol.style.Stroke({
+ color: 'red',
+ width: 1
+ }),
+ image: new ol.style.Circle({
+ radius: 3,
+ fill: new ol.style.Fill({
+ color: 'red'
+ })
+ })
+ })
+ });
+
+ var hoverStyle= [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+
+
+ draw= new ol.interaction.Draw({
+ source: vectorDraw.getSource(),
+ type: geometryType,
+ // style: (feature) => {
+ // return getStyle(feature);
+ // }
+ });
+ map.addInteraction(draw);
+
+draw.on('drawstart', (e) => {
+
+
+
+ layers.getSource().clear();
+
+});
+
+
+draw.on('drawend', (e) => {
+
+
+
+
+
+
+ let feature = e.feature;
+ let featureClone = feature.clone();
+ featureClone.getGeometry().transform('EPSG:3857', 'EPSG:4326');
+
+ modifiedWKT = wkt.writeFeature(featureClone);
+ map.addLayer(vectorDraw);
+
+ let coords= feature.getGeometry().getCoordinates();
+let firstcoords= feature.getGeometry().getFirstCoordinate();
+let area=getLengthOrArea(feature);
+
+
+//console.log(wkt);
+alctivateLayer(modifiedWKT,area,firstcoords)
+
+
+
+ const feat = new ol.Feature({
+
+ geometry: e.target
+ }
+
+ );
+
+
+
+
+
+
+
+
+
+
+map.removeInteraction(draw);
+
+
+});
+draw.setActive(true);
+
+
+}
+function alctivateLayer(wkt,area,firstcoords)
+{
+var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+var lonlat = ol.proj.transform(firstcoords, 'EPSG:3857', 'EPSG:4326');
+
+latitude= lonlat[0];
+logitude=lonlat[1];
+
+
+features = [];
+filterdata=[];
+
+
+const styles = layer.getSource().getParams().STYLES;
+
+
+const url = layer.getSource().getFeatureInfoUrl(
+
+ firstcoords,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+ {
+ 'INFO_FORMAT' : 'application/json',
+ 'FEATURE_COUNT': maxFeatures,
+ 'STYLES': styles
+
+}
+
+);
+
+
+
+if (url) {
+
+$.get(url, function(response) {
+
+
+ features = geojson.readFeatures(response);
+ features.forEach((feat) => {
+ console.log(feat)
+ const extent=feat.getGeometry().getExtent();
+
+ hoverLayer.getSource().addFeature(feat);
+
+
+ map.getView().fit(extent,{ duration: 600});
+
+ const props = { ...feat.getProperties() };
+ console.log(props)
+ });
+
+
+ //const extent=a.getGeometry().getExtent();
+ ////alert(extent);
+
+ var response = JSON.parse(response);
+
+const a=response.features.map(x=>x.properties)[0];
+
+let lat=latitude;
+let lon=logitude;
+let stateCode=a.ST_2011;
+let districtCode=a.DT_2011;
+let talukaCode=a.SDT_2011;
+let villageCode=a.VIL_2011;
+
+
+
+var data={"lat":lat,"lon":lon,"stateCode":stateCode,"districtCode":districtCode,"talukaCode":talukaCode,"villageCode":villageCode,"area":area,"wkt":wkt};
+var dataObjectString = JSON.stringify(data);
+//var b=$.base64.encode("hello");
+console.log(dataObjectString);
+
+var enc = Base64.encode(dataObjectString);
+
+window.open('monument?id='+enc,"_blank");
+
+
+
+
+
+
+
+ })
+
+
+
+}
+}
+
+
+
+
+
+
+function deactivateDraw() {
+
+ setCursor('');
+value = null;
+try {
+map.removeInteraction(draw);
+layers.getSource().clear();
+map.removeLayer(layers);
+
+} catch (error) {}
+}
+
+
+
+function measure(m)
+{
+map=m
+ // Read user-defined parameters
+
+ units= map.getView().getProjection().getUnits();
+
+
+layers = new ol.layer.Vector({
+ source: new ol.source.Vector(),
+ style: (feature ) => {
+ return getStyle(feature);
+ }
+ });
+ addHoverLayer();
+ // activateDraw(geometryType)
+
+
+
+}
+function addHoverLayer()
+ {
+
+
+ hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+
+
+
+ if (hoverStyle) {
+
+ hoverLayer.setStyle(hoverStyle);
+ }
+ map.addLayer(pointLayer);
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+
+ }
+
+
+
+
+ }
+
+function getStyle(feature)
+{
+ return [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color:fillColor
+ })
+ }),
+ new ol.style.Style({
+ stroke: new ol.style.Stroke({
+ color: strokeColor,
+ width: 2,
+ lineDash: [5, 5]
+ }),
+ text: new ol.style.Text({
+ textAlign: 'center',
+ textBaseline: 'middle',
+ text: getLengthOrArea(feature),
+ font: font,
+ fill: new ol.style.Fill({
+ color: textColor
+ }),
+ offsetX: 0,
+ offsetY: 0,
+ rotation: 0,
+ stroke: new ol.style.Stroke({
+ color: textOutlineColor,
+ width: 3
+ })
+ })
+ })
+ ];
+ }
+
+
+
+
+function setCursor(cursorType)
+{
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+}
+
+
+function getLengthOrArea(feature)
+ {
+
+ let value = '';
+ const geom= feature.getGeometry();
+
+
+
+
+
+
+ switch (geometryType)
+ {
+
+ case 'LineString':
+ try {
+ value = parseFloat(geom.getLength().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ case 'Polygon':
+ try {
+ value = parseFloat(geom.getArea().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ case 'Circle':
+ try {
+ value = parseFloat(geom.getRadius().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ default:
+ break;
+ }
+
+
+ if (value !== '')
+ {
+
+
+ value = value;
+ displaylength.innerHTML = value + ' m';
+ displayarea.innerHTML = value + ' m &sup2;';
+ displayradious.innerHTML = value+ ' m';
+
+ }
+
+
+
+
+
+
+
+
+
+ return value;
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/geom/measureold.js
@@ -0,0 +1,335 @@
+var map;
+var layers=new ol.layer.Vector;
+var feature=new ol.Feature;
+var geojson = new ol.format.GeoJSON;
+var geometryType='Point';
+var precision = 2;
+var cursorStyle = 'crosshair';
+var fillColor = [255, 255, 255, 0.5];
+var strokeColor = [72, 72, 72, 1];
+var textColor = [strokeColor[0], strokeColor[1], strokeColor[2], 1];
+var textOutlineColor = [fillColor[0], fillColor[1], fillColor[2], 0.7];
+var font = 'normal 14px Arial';
+var maxFeatures=1;
+var draw;
+
+var displaylength = document.getElementById('distance');
+var displayarea = document.getElementById('area');
+var displayradious = document.getElementById('radious');
+
+
+function selectedType(gtype)
+{
+ displaylength.innerHTML = '';
+ displayarea.innerHTML = '';
+ displayradious.innerHTML = '';
+geometryType=gtype;
+
+
+
+}
+
+function activateDraw()
+{
+
+
+
+
+ var wkt = new ol.format.WKT();
+
+deactivateDraw();
+
+map.addLayer(layers);
+
+setCursor(cursorStyle);
+draw= new ol.interaction.Draw({
+ source: layers.getSource(),
+ type: geometryType,
+ style: (feature) => {
+ return getStyle(feature);
+ }
+});
+
+
+
+draw.on('drawstart', (e) => {
+
+
+
+ layers.getSource().clear();
+
+});
+ map.addInteraction(draw);
+
+draw.on('drawend', (e) => {
+
+
+
+
+
+
+ let feature = e.feature;
+ let featureClone = feature.clone();
+ featureClone.getGeometry().transform('EPSG:3857', 'EPSG:4326');
+
+ modifiedWKT = wkt.writeFeature(featureClone);
+ let coords= feature.getGeometry().getCoordinates();
+let firstcoords= feature.getGeometry().getFirstCoordinate();
+let area=getLengthOrArea(feature);
+
+
+//console.log(wkt);
+alctivateLayer(modifiedWKT,area,firstcoords)
+
+
+
+ const feat = new ol.Feature({
+
+ geometry: e.target
+ }
+
+ );
+
+
+
+
+
+
+
+
+
+
+map.removeInteraction(draw);
+
+
+});
+draw.setActive(true);
+
+
+}
+function alctivateLayer(wkt,area,firstcoords)
+{
+var layer = findlayeByName(map.getLayerGroup(), 'name','Village');
+var lonlat = ol.proj.transform(firstcoords, 'EPSG:3857', 'EPSG:4326');
+
+latitude= lonlat[0];
+logitude=lonlat[1];
+
+
+features = [];
+filterdata=[];
+
+
+const styles = layer.getSource().getParams().STYLES;
+
+
+const url = layer.getSource().getFeatureInfoUrl(
+
+ firstcoords,
+ map.getView().getResolution(),
+ map.getView().getProjection(),
+ {
+ 'INFO_FORMAT' : 'application/json',
+ 'FEATURE_COUNT': maxFeatures,
+ 'STYLES': styles
+
+}
+
+);
+
+
+
+if (url) {
+
+$.get(url, function(response) {
+
+
+
+
+
+ var response = JSON.parse(response);
+
+
+const a=response.features.map(x=>x.properties)[0];
+
+let lat=latitude;
+let lon=logitude;
+let stateCode=a.ST_2011;
+let districtCode=a.DT_2011;
+let talukaCode=a.SDT_2011;
+let villageCode=a.VIL_2011;
+
+
+
+var data={"lat":lat,"lon":lon,"stateCode":stateCode,"districtCode":districtCode,"talukaCode":talukaCode,"villageCode":villageCode,"area":area,"wkt":wkt};
+var dataObjectString = JSON.stringify(data);
+//var b=$.base64.encode("hello");
+console.log(dataObjectString);
+
+var enc = Base64.encode(dataObjectString);
+
+window.open('monument?id='+enc,"_blank");
+
+
+
+
+
+
+
+ })
+
+
+
+}
+}
+
+
+
+
+
+
+function deactivateDraw() {
+
+ setCursor('');
+value = null;
+try {
+map.removeInteraction(draw);
+layers.getSource().clear();
+map.removeLayer(layers);
+
+} catch (error) {}
+}
+
+
+
+function measure(m)
+{
+map=m
+ // Read user-defined parameters
+
+ units= map.getView().getProjection().getUnits();
+
+
+layers = new ol.layer.Vector({
+ source: new ol.source.Vector(),
+ style: (feature ) => {
+ return getStyle(feature);
+ }
+ });
+
+
+activateDraw();
+
+
+}
+
+
+function getStyle(feature)
+{
+ return [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color:fillColor
+ })
+ }),
+ new ol.style.Style({
+ stroke: new ol.style.Stroke({
+ color: strokeColor,
+ width: 2,
+ lineDash: [5, 5]
+ }),
+ text: new ol.style.Text({
+ textAlign: 'center',
+ textBaseline: 'middle',
+ text: getLengthOrArea(feature),
+ font: font,
+ fill: new ol.style.Fill({
+ color: textColor
+ }),
+ offsetX: 0,
+ offsetY: 0,
+ rotation: 0,
+ stroke: new ol.style.Stroke({
+ color: textOutlineColor,
+ width: 3
+ })
+ })
+ })
+ ];
+ }
+
+
+
+
+function setCursor(cursorType)
+{
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+}
+
+
+function getLengthOrArea(feature)
+ {
+
+ let value = '';
+ const geom= feature.getGeometry();
+
+
+
+
+
+
+ switch (geometryType)
+ {
+
+ case 'LineString':
+ try {
+ value = parseFloat(geom.getLength().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ case 'Polygon':
+ try {
+ value = parseFloat(geom.getArea().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ case 'Circle':
+ try {
+ value = parseFloat(geom.getRadius().toString())
+ .toFixed(precision)
+ .toString();
+ } catch (error) {}
+ break;
+ default:
+ break;
+ }
+
+
+ if (value !== '')
+ {
+
+
+ value = value;
+ displaylength.innerHTML = value + ' m';
+ displayarea.innerHTML = value + ' m &sup2;';
+ displayradious.innerHTML = value+ ' m';
+
+ }
+
+
+
+
+
+
+
+
+
+ return value;
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/googleapi/googlemaps copy.js
@@ -0,0 +1,38 @@
+
+// function myMap() {
+
+// var directionsDisplay = new google.maps.DirectionsRenderer();
+// var map;
+// var mapProp= {
+// center:new google.maps.LatLng(23.232683,72.641768),
+// zoom:4.5,
+// };
+// map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
+
+// directionsDisplay.setMap(map);
+
+
+// google.maps.event.addDomListener(document.getElementById('routebtn'), 'click', calcRoute);
+
+
+// }
+// function calcRoute()
+// {
+// var directionsService = new google.maps.DirectionsService();
+// var directionsDisplay = new google.maps.DirectionsRenderer();
+// var start = new google.maps.LatLng(23.1508, 72.3600);
+// var end = new google.maps.LatLng(23.1642, 72.6549);
+// var request = {
+// origin: start,
+// destination: end,
+// travelMode: google.maps.TravelMode.DRIVING
+// };
+// directionsService.route(request, function(response, status) {
+// if (status == google.maps.DirectionsStatus.OK) {
+// directionsDisplay.setDirections(response);
+// directionsDisplay.setMap(map);
+// } else {
+// alert("Directions Request from " + start.toUrlValue(6) + " to " + end.toUrlValue(6) + " failed: " + status);
+// }
+// });
+// }
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/googleapi/googlemaps.js
@@ -0,0 +1,43 @@
+function mapLocation() {
+ var directionsDisplay;
+ var directionsService = new google.maps.DirectionsService();
+ var map;
+
+ function initialize() {
+ directionsDisplay = new google.maps.DirectionsRenderer();
+
+ var mapOptions = {
+ zoom: 4.5 ,
+ center:new google.maps.LatLng(23.232683,72.641768),
+ };
+ map = new google.maps.Map(document.getElementById('googleMap'), mapOptions);
+ directionsDisplay.setMap(map);
+ google.maps.event.addDomListener(document.getElementById('routebtn'), 'click', calcRoute);
+ }
+
+ function calcRoute() {
+ var start = new google.maps.LatLng(23.1508, 72.3600);
+ var end = new google.maps.LatLng(23.1642, 72.6549);
+
+ var bounds = new google.maps.LatLngBounds();
+ bounds.extend(start);
+ bounds.extend(end);
+ map.fitBounds(bounds);
+ var request = {
+ origin: start,
+ destination: end,
+ travelMode: google.maps.TravelMode.DRIVING
+ };
+ directionsService.route(request, function (response, status) {
+ if (status == google.maps.DirectionsStatus.OK) {
+ directionsDisplay.setDirections(response);
+ directionsDisplay.setMap(map);
+ } else {
+ alert("Directions Request from " + start.toUrlValue(6) + " to " + end.toUrlValue(6) + " failed: " + status);
+ }
+ });
+ }
+
+ google.maps.event.addDomListener(window, 'load', initialize);
+}
+mapLocation();
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/identify/identify.js
@@ -0,0 +1,261 @@
+var map;
+var maxFeatures =1;
+var cursorStyle = 'crosshair';
+var placeholder = 'Select query layer';
+var zoomOnRowClick = true;
+var hlightFeatures = true;
+
+var clickEvent;
+var vectorLayer6= new ol.layer.Vector;
+var features= new ol.Feature;
+var hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+var latitude;
+var logitude;
+var geojson=new ol.format.GeoJSON();
+var WMSGetFeatureInfo=ol.format.WMSGetFeatureInfo;
+
+function identify(maps)
+{
+
+ map=maps;
+
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Airport');
+
+
+
+var Groupcountt=0;
+
+ map.getLayers().forEach(function (layerr, i) {
+ Groupcountt=i+1;
+ var groupnamee=layerr.get('name');
+ if(groupnamee=='Identify')
+ {
+ var groupcontentt='';
+
+ groupcontentt+='';
+ // <span class="togglebutton" id=layer'+i+'"><label for="visible'+i+'"><input id="visible'+i+'" class="visible" type="checkbox"/><span class="toggle"></span></label></span>
+
+
+ groupcontentt +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" aria-expanded="true" href="#basemap-choicee'+i+'" aria-controls="collapseOne" class="collapsed">'+groupnamee+':<span id="'+'layerscountt'+i+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choicee'+i+'" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordionn" style=""><div class="card-body" id="'+'layerr'+i+'"></div> </div></div>';
+
+ $('#groupss').append($(groupcontentt));
+
+ bindInputs('#layerr' + i, layerr);
+ var subGroupcountt=0;
+ if (layerr instanceof ol.layer.Group) {
+
+ layerr.getLayers().forEach(function (sublayerr, j) {
+ subGroupcountt=j+1;
+ var basecontentt = '';
+ let layernamee=sublayerr.get('name');
+
+ basecontentt += '<div class="togglebutton" id="layerr'+i+j+'"><label for="visiblee'+i+j+'"> <input id="visiblee'+i+j+'" type="checkbox" class="visible" /> <span class="toggle"></span>'+layernamee+'</label> </div>';
+
+ $('#layerr'+i).append($(basecontentt));
+
+ bindInputss('#layerr' + i + j, sublayerr);
+ });
+ $('#layerscountt'+i).append(subGroupcountt);
+
+ }
+ }
+
+ });
+
+ $('#groupscountt').append(Groupcountt);
+
+
+
+
+
+
+
+}
+function bindInputss(layerid, layer)
+{
+ var visibilityInput = $(layerid + ' input.visible');
+
+ visibilityInput.on('change', function () {
+
+ layer.setVisible(this.checked);
+
+ if(layer.getVisible()==true)
+ {
+
+ activateClick(layer);
+ }
+ else{
+ deactivateClick();
+ }
+ });
+ visibilityInput.prop('checked', layer.getVisible());
+
+
+}
+function findlayeByName(layer, key, value) {
+
+ if (layer.get(key) === value) {
+ return layer;
+ }
+ // Find recursively if it is a group
+ if (layer.getLayers) {
+ var layers = layer.getLayers().getArray(), len = layers.length, result;
+ for (var i = 0; i < len; i++) {
+ result = findlayeByName(layers[i], key, value);
+ if (result) {
+ return result;
+ }
+ }
+ }
+ return null;
+}
+
+function addHoverLayer()
+{
+
+
+ if (placeholder) {
+ hoverLayer.setStyle(hoverStyle);
+ }
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+ }
+}
+function activateClick(layer)
+{
+
+ console.log(layer)
+ var layername=layer.get('name');
+// hoverLayer.getSource().clear();
+
+ // deactivateClick();
+
+
+ clickEvent = (evt) =>
+ {
+
+
+
+ var coordinate = evt.coordinate;
+
+
+
+
+
+ let lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ latitude= lonlat[0];
+ logitude=lonlat[1];
+
+ features = [];
+ filterdata=[];
+
+ if (layer instanceof ol.layer.Tile ||layer instanceof ol.layer.Image || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Heatmap || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Layer || layer instanceof ol.layer.VectorTile)
+ {
+
+ const styles = layer.getSource().getParams().STYLES;
+ var url = layer.getSource().getFeatureInfoUrl(
+ evt.coordinate,
+ map.getView().getResolution(),
+ 'EPSG:3857', {
+ 'INFO_FORMAT' : 'application/json',
+ FEATURE_COUNT: maxFeatures,
+ STYLES: styles
+
+ });
+
+ if (url)
+ {
+
+
+ $.get(url, function(response) {
+
+
+
+
+ response = JSON.parse(response);
+
+ {
+ {
+ const a=response.features.map(x=>x.properties)[0];
+ console.log(a);
+
+ if(layername=='Rail')
+ {
+
+
+
+ content.innerHTML = '<p style="color:green;">ID:<span style="color:black">' + a.bsid + '</span></p><p style="color:green;">Name:<span style="color:black">' + a.name + '</span></p>';
+ }
+ if(layername=='National Highway')
+ {
+
+
+
+ content.innerHTML = '<p style="color:green;">ID:<span style="color:black">' + a.objectid + '</span></p><p style="color:green;">Name:<span style="color:black">' + a.name + '</span></p>';
+ }
+ if(layername=='Park Boundry')
+ {
+
+ content.innerHTML = '<p style="color:green;">Statename:<span style="color:black">' + a.st_name + '</span></p><p style="color:green;">District:<span style="color:black">' + a.dist_name + '</span></p><p style="color:green;">Taluka:<span style="color:black">' + a.sub_dist + '</span></p><p style="color:green;">Village:<span style="color:black">' + a.vname + '</span></p><p style="color:green;">Park Name:<span style="color:black">' + a.park_name + '</span></p><p style="color:green;">Park Type:<span style="color:black">' + a.park_type + '</span></p>';
+ }
+ overlay.setPosition(coordinate);
+ // overlay.setPosition(evt.coordinate);
+
+ }
+
+ }
+
+ });
+
+
+ }
+ else{
+ alert("NOt Suported");
+ }
+
+
+ }
+ else
+
+ {
+ alert('Currently only WMS query is supported. Please select another layer!')
+
+
+
+ }
+ };
+ map.on('singleclick', clickEvent);
+
+}
+
+
+
+
+function setCursor(cursorType) {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
+
+function getFeatureInfoUrl( source,coordinate,resolution, srs)
+ {
+
+ const styles = source.getParams().hasOwnProperty('STYLES')
+ ? source.getParams().STYLES
+ : '';
+ return source.getGetFeatureInfoUrl(coordinate, resolution, srs,{
+ INFO_FORMAT: 'application/json',
+// FEATURE_COUNT: maxFeatures,
+// STYLES: styles
+ });
+
+ // return url;
+
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/identify/identifyfortwo.js
@@ -0,0 +1,255 @@
+var map;
+var maxFeatures =10;
+var cursorStyle = 'crosshair';
+var placeholder = 'Select query layer';
+var zoomOnRowClick = true;
+var hlightFeatures = true;
+
+var clickEvent;
+var vectorLayer6= new ol.layer.Vector;
+var features= new ol.Feature;
+var hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+var latitude;
+var logitude;
+var geojson=new ol.format.GeoJSON();
+var WMSGetFeatureInfo=ol.format.WMSGetFeatureInfo;
+
+function identify(maps)
+{
+
+ map=maps;
+
+ var layer = findlayeByName(map.getLayerGroup(), 'name','Airport');
+
+
+
+var Groupcountt=0;
+
+ map.getLayers().forEach(function (layerr, i) {
+ Groupcountt=i+1;
+ var groupnamee=layerr.get('name');
+ if(groupnamee=='Identify')
+ {
+ var groupcontentt='';
+
+ groupcontentt+='';
+ // <span class="togglebutton" id=layer'+i+'"><label for="visible'+i+'"><input id="visible'+i+'" class="visible" type="checkbox"/><span class="toggle"></span></label></span>
+
+
+ groupcontentt +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" aria-expanded="true" href="#basemap-choicee'+i+'" aria-controls="collapseOne" class="collapsed">'+groupnamee+':<span id="'+'layerscountt'+i+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choicee'+i+'" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordionn" style=""><div class="card-body" id="'+'layerr'+i+'"></div> </div></div>';
+
+ $('#groupss').append($(groupcontentt));
+
+ bindInputs('#layerr' + i, layerr);
+ var subGroupcountt=0;
+ if (layerr instanceof ol.layer.Group) {
+
+ layerr.getLayers().forEach(function (sublayerr, j) {
+ subGroupcountt=j+1;
+ var basecontentt = '';
+ let layernamee=sublayerr.get('name');
+
+ basecontentt += '<div class="togglebutton" id="layerr'+i+j+'"><label for="visiblee'+i+j+'"> <input id="visiblee'+i+j+'" type="checkbox" class="visible" /> <span class="toggle"></span>'+layernamee+'</label> </div>';
+
+ $('#layerr'+i).append($(basecontentt));
+
+ bindInputss('#layerr' + i + j, sublayerr);
+ });
+ $('#layerscountt'+i).append(subGroupcountt);
+
+ }
+ }
+
+ });
+
+ $('#groupscountt').append(Groupcountt);
+
+
+
+
+
+
+
+}
+function bindInputss(layerid, layer)
+{
+ var visibilityInput = $(layerid + ' input.visible');
+
+ visibilityInput.on('change', function () {
+
+ layer.setVisible(this.checked);
+
+ if(layer.getVisible()==true)
+ {
+
+ activateClick(layer);
+ }
+ else{
+ deactivateClick();
+ }
+ });
+ visibilityInput.prop('checked', layer.getVisible());
+
+
+}
+function findlayeByName(layer, key, value) {
+
+ if (layer.get(key) === value) {
+ return layer;
+ }
+ // Find recursively if it is a group
+ if (layer.getLayers) {
+ var layers = layer.getLayers().getArray(), len = layers.length, result;
+ for (var i = 0; i < len; i++) {
+ result = findlayeByName(layers[i], key, value);
+ if (result) {
+ return result;
+ }
+ }
+ }
+ return null;
+}
+
+function addHoverLayer()
+{
+
+
+ if (placeholder) {
+ hoverLayer.setStyle(hoverStyle);
+ }
+ if (highlightFeatures) {
+
+ map.addLayer(hoverLayer);
+ }
+}
+function activateClick(layer)
+{
+
+ console.log(layer)
+ var layername=layer.get('name');
+// hoverLayer.getSource().clear();
+console.log(layername);
+ deactivateClick();
+
+
+ clickEvent = (evt) =>
+ {
+
+
+
+
+
+ let lonlat = ol.proj.transform(evt.coordinate, 'EPSG:3857', 'EPSG:4326');
+
+ latitude= lonlat[0];
+ logitude=lonlat[1];
+
+ features = [];
+ filterdata=[];
+
+ if (layer instanceof ol.layer.Tile ||layer instanceof ol.layer.Image || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Heatmap || layer instanceof ol.layer.Vector || layer instanceof ol.layer.Layer || layer instanceof ol.layer.VectorTile)
+ {
+
+
+ var url = layer.getSource().getFeatureInfoUrl(
+ evt.coordinate,
+ map.getView().getResolution(),
+ 'EPSG:3857', {
+ 'INFO_FORMAT' : 'application/json',
+
+
+ });
+
+ if (url)
+ {
+
+
+ $.get(url, function(response) {
+
+
+
+
+ response = JSON.parse(response);
+
+ {
+ {
+ const a=response.features.map(x=>x.properties)[0];
+ console.log(a);
+
+ if(layername=='Rail')
+ {
+
+
+
+ content.innerHTML = '<p style="color:green;">ID:<span style="color:black">' + a.bsid + '</span></p><p style="color:green;">Name:<span style="color:black">' + a.name + '</span></p>';
+ }
+ if(layername=='National Highway')
+ {
+
+
+
+ content.innerHTML = '<p style="color:green;">ID:<span style="color:black">' + a.objectid + '</span></p><p style="color:green;">Name:<span style="color:black">' + a.name + '</span></p>';
+ }
+ if(layername=='Park Boundry')
+ {
+
+ content.innerHTML = '<p style="color:green;">Statename:<span style="color:black">' + a.st_name + '</span></p><p style="color:green;">District:<span style="color:black">' + a.dist_name + '</span></p><p style="color:green;">Taluka:<span style="color:black">' + a.sub_dist + '</span></p><p style="color:green;">Village:<span style="color:black">' + a.vname + '</span></p><p style="color:green;">Park Name:<span style="color:black">' + a.park_name + '</span></p><p style="color:green;">Park Type:<span style="color:black">' + a.park_type + '</span></p>';
+ }
+ overlay.setPosition(evt.coordinate);
+
+ }
+
+ }
+
+ });
+
+
+ }
+ else{
+ alert("NOt Suported");
+ }
+
+
+ }
+ else
+
+ {
+ alert('Currently only WMS query is supported. Please select another layer!')
+
+
+
+ }
+ };
+ map.on('singleclick', clickEvent);
+
+}
+
+
+
+
+function setCursor(cursorType) {
+ if (map) {
+ const target = map.getTarget();
+ // jQuery hack to convert the mouse cursor to a crosshair
+ const jTarget = typeof target === 'string' ? $('#' + target) : $(target);
+ jTarget.css('cursor', cursorType);
+ }
+ }
+
+function getFeatureInfoUrl( source,coordinate,resolution, srs)
+ {
+
+ const styles = source.getParams().hasOwnProperty('STYLES')
+ ? source.getParams().STYLES
+ : '';
+ return source.getGetFeatureInfoUrl(coordinate, resolution, srs,{
+ INFO_FORMAT: 'application/json',
+// FEATURE_COUNT: maxFeatures,
+// STYLES: styles
+ });
+
+ // return url;
+
+ }
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/layerswitcher/layerSwitcher old.js
@@ -0,0 +1,95 @@
+
+
+ function switchlayers(map)
+ {
+
+
+ const layerGroups = map.getLayers().getArray();
+ const groupCount=layerGroups.length
+ $('#groupscount').append(groupCount);
+
+ const groupcount=layerGroups.length;
+
+ for(var j=0;j<layerGroups.length;j++)
+
+ {
+ var groupname=layerGroups[j].get('name');
+
+ var groupcontent='';
+
+ groupcontent+='';
+
+ groupcontent +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" href="#basemap-choice'+j+'" aria-controls="collapseOne" class="collapsed">'+groupname+':<span id="'+'layerscount'+j+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choice'+j+'" class="collapse" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion" style=""><div class="card-body" id="'+'layers'+j+'"></div> <div id="'+'slider-range-min'+j+'" ></div></div></div>';
+
+ $('#groups').append($(groupcontent));
+
+
+ if(layerGroups[j].getVisible()==true)
+ {
+ let sublayers=new Array();
+
+ for(var i=0;i<layerGroups[j].getLayers().getArray().length;i++)
+ {
+ sublayers.push(layerGroups[j].getLayers().getArray()[i]);
+
+
+ }
+
+
+ getlayersfunction(sublayers,j);
+ sublayers=[];
+
+
+ }
+
+
+ }
+
+
+
+ function getlayersfunction(sublayers,ind)
+ {
+
+ $.each(sublayers, function(index)
+ {
+
+
+
+ var basecontent = '';
+ var layer = this.getProperties();
+ console.log(layer.name+"-"+layer.visible);
+
+
+
+ if(layer.visible==true) {
+
+
+ basecontent += '<div class="togglebutton"><label ><input id="check'+ind+'" type="checkbox" name="radio-basemap" checked=""><span class="toggle"></span>'+layer.name+'</label></div>';
+
+ }
+ else
+ {
+
+ basecontent += '<div class="togglebutton"><label ><input id="check'+ind+'" type="checkbox" name="radio-basemap" ><span class="toggle"></span>'+layer.name+'</label></div>';
+
+ }
+
+
+
+ $('#layers'+ind).append($(basecontent));
+
+
+
+
+ });
+
+
+
+ $('#layerscount'+ind).append(sublayers.length);
+
+
+ }
+
+
+ }
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/layerswitcher/layerSwitcher.js
@@ -0,0 +1,82 @@
+
+
+function switchlayers(map)
+{
+
+var Groupcount=0;
+bindallopacity();
+ map.getLayers().forEach(function (layer, i) {
+ Groupcount=i+1;
+ var groupname=layer.get('name');
+
+ if(groupname!=undefined && groupname!='Identify')
+ {
+
+ var groupcontent='';
+
+ groupcontent+='';
+ // <span class="togglebutton" id=layer'+i+'"><label for="visible'+i+'"><input id="visible'+i+'" class="visible" type="checkbox"/><span class="toggle"></span></label></span>
+ groupcontent +=' <div class="card-collapse" ><div class="card-header" role="tab" id="headingOne"><h5 class="mb-0"> <a data-toggle="collapse" href="#basemap-choice'+i+'" aria-controls="collapseOne" class="collapsed">'+groupname+':<span id="'+'layerscount'+i+'"></span><i class="material-icons">keyboard_arrow_down</i></a></h5></div><div id="basemap-choice'+i+'" class="collapse" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion" style=""><div class="card-body" id="'+'layer'+i+'"></div> <div id="'+'slider-range-min'+i+'" ></div></div></div>';
+
+ $('#groups').append($(groupcontent));
+
+ bindInputs('#layer' + i, layer);
+ var subGroupcount=0;
+ if (layer instanceof ol.layer.Group) {
+
+ layer.getLayers().forEach(function (sublayer, j) {
+ subGroupcount=j+1;
+ var basecontent = '';
+ let layername=sublayer.get('name');
+
+ basecontent += '<div class="togglebutton" id="layer'+i+j+'"><label for="visible'+i+j+'"> <input id="visible'+i+j+'" type="checkbox" class="visible" /> <span class="toggle"></span>'+layername+'</label> <input id="opacity" class="opacity" type="range" min="0" max="1" step="0.01"/></div>';
+
+ $('#layer'+i).append($(basecontent));
+
+ bindInputs('#layer' + i + j, sublayer);
+ });
+ $('#layerscount'+i).append(subGroupcount);
+
+ }
+ }
+ });
+
+ $('#groupscount').append(Groupcount);
+
+
+
+}
+function bindallopacity()
+{
+ $('#opacity').hide();
+ var allopacity=$('#allopacity');
+ allopacity.on('change', function () {
+
+
+ });
+}
+function bindInputs(layerid, layer) {
+
+
+
+ var visibilityInput = $(layerid + ' input.visible');
+
+ visibilityInput.on('change', function () {
+
+ layer.setVisible(this.checked);
+
+ });
+ visibilityInput.prop('checked', layer.getVisible());
+
+
+
+
+ var opacityInput = $(layerid + ' input.opacity');
+
+ opacityInput.on('input change', function () {
+
+ layer.setOpacity(parseFloat(this.value));
+ });
+ opacityInput.val(String(layer.getOpacity()));
+ }
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/legend/legend.js
@@ -0,0 +1,58 @@
+var map;
+var legendImg;
+var ImageArray=[];
+function legend(m)
+{
+ map=m;
+// map.getLayers().forEach(function (grouplayers) {
+
+
+
+
+
+
+
+
+// grouplayers.getLayers().forEach(function (layer) {
+
+// if(layer.getVisible()==true)
+// {
+// console.log(layer);
+// // const layername = layer.params["LAYERS"] ;
+// // console.log(layername);
+
+// }
+
+// });
+// });
+
+// const grouplayers = map.getLayers().getArray();
+
+// grouplayers.forEach((sublayers) => {
+
+
+
+// // alert(sublayers.get('name'));
+
+// sublayers.forEach((layer) => {
+// if(layer.getVisible()==true)
+// {
+
+// alert(layer.get('name'));
+// // const layername = layer.getSource().getParams().LAYERS ;
+
+// // this.legendImg = gidcGisUrl + '?REQUEST=GetLegendGraphic&sld_version=1.0.0&layer=' + layername + '&format= image/png &legend_options=fontSize:13;fontName:san-sarif;bgColor:0xffffff;forceLabels:on'+'&WIDTH=12&HEIGHT=12&Scale=1';
+
+// //this.ImageArray.push( this.legendImg);
+// }
+// });
+
+// });
+
+}
+function updateLegend(layer) {
+ let layername=layer.getSource().getParams().LAYERS;
+ var graphicUrl = '?REQUEST=GetLegendGraphic&sld_version=1.0.0&layer=' + layername + '&format= image/png &legend_options=fontSize:13;fontName:san-sarif;bgColor:0xffffff;forceLabels:on'+'&WIDTH=12&HEIGHT=12&Scale=1';
+ var img = document.getElementById('legend');
+ img.src = graphicUrl;
+ };
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/main.js
@@ -0,0 +1,80 @@
+/**
+ * Elements that make up the popup.
+ */
+var container = document.getElementById('popup');
+var content = document.getElementById('popup-content');
+var closer = document.getElementById('popup-closer');
+
+/**
+ * Create an overlay to anchor the popup to the map.
+ */
+var overlay = new ol.Overlay({
+ element: container,
+ autoPan: true,
+ autoPanAnimation: {
+ duration: 250,
+ },
+});
+
+/**
+ * Add a click handler to hide the popup.
+ * @return {boolean} Don't follow the href.
+ */
+closer.onclick = function () {
+ overlay.setPosition(undefined);
+ closer.blur();
+ return false;
+};
+window.onload=init;
+
+
+function init()
+{
+ let india=[ 81.191694, 23.8086 ];
+let jalandhar=[75.57917,31.32556];
+var map = new ol.Map({
+ overlays: [overlay],
+ target: 'target-maps',
+
+ view: new ol.View({
+ center : ol.proj.transform(india, 'EPSG:4326','EPSG:3857'),
+ zoom:4.0,
+ // zoom :9.5,
+ minZoom:4,
+ maxZoom: 17
+ }),
+ layers:[
+ CommonlayersGroup,indianMapLayersGroup,
+ IdentifyLayerGroup,geomLayerGroup
+ ],
+ controls: ol.control.defaults({
+ zoom: false,
+ attribution: true,
+ rotate: false
+ }).extend([]),
+ // new ol.control.FullScreen()
+
+
+ });
+
+legend(map);
+geom(map);
+//buffer(map);
+controllers(map);
+navigation(map);
+switchlayers(map);
+getMousePosition(map);
+scaleline(map);
+exportpdf(map);
+identify(map);
+//addGeom(map);
+commonfunctions(map);
+//swipe(map);
+//geocoder(map);
+
+
+
+
+
+
+}
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/navigation/navigation.js
@@ -0,0 +1,581 @@
+var map
+var GisUrl='https://gis.ncog.gov.in/GISWeb/wms';
+var hoverLayer =ol.layer.Vector;
+var geojson = new ol.format.GeoJSON;
+var vectorSource;
+var hoverStyle= [
+ new ol.style.Style({
+ fill: new ol.style.Fill({
+ color: [255, 255, 0, 0.5]
+ }),
+ stroke: new ol.style.Stroke({
+ color: [0,204,0,1],
+ width: 4
+ })
+ })
+ ];
+
+var statelist=[];
+var districtlist=[];
+var talukalist=[];
+var villagelist=[];
+var cql;
+var Alllayers=[];
+var Alllayersname= [];
+var layersname="Village,Taluka,District,State";
+var layer="VillageIndia,TalukaIndia,DistrictIndia,StateIndia";
+function navigation(m)
+{
+ map=m;
+ zoomOnRowClick = true;
+highlightFeatures = true;
+ getstate();
+ addHoverLayer();
+
+}
+function addHoverLayer()
+ {
+ hoverLayer = new ol.layer.Vector({
+ source: new ol.source.Vector()
+ });
+
+
+ if (hoverStyle) {
+
+ hoverLayer.setStyle(hoverStyle);
+ }
+ if (highlightFeatures) {
+
+ map.addLayer(this.hoverLayer);
+ }
+
+
+
+
+ }
+
+function getstate()
+{
+ statelist=[];
+ districtlist=[];
+ talukalist=[];
+ villagelist=[];
+ var options="";
+ var j=getState();
+
+ if(j)
+ {
+ var statename="";
+ // options=' <option disabled selected>State</option>';
+ for ( var i = 0; i < j.length; i++) {
+
+
+
+ options += '<option value="' + j[i].statecode+ '" >'
+ + j[i].statename + '</option>';
+ statelist.push({"statecode":j[i].statecode,"minx":j[i].minx,"miny":j[i].miny,"maxx":j[i].maxx,"maxy":j[i].maxy});
+
+
+
+ }
+
+ $("select#state").html(options);
+
+
+ }
+
+ $("#state").change(function(){
+
+
+
+ var selectedstatecode = $(this).children("option:selected").val();
+
+ var s=statelist.find(x=>x.statecode==selectedstatecode);
+ var extent=[s.minx,s.miny,s.maxx,s.maxy];
+ zoom(extent);
+ removestatelayer(selectedstatecode);
+ getDistricts(selectedstatecode);
+
+
+
+ var vectorSource = new ol.source.Vector({
+ url: 'https://gis.ncog.gov.in/GISWeb/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=cite:StateIndia&PROPERTYNAME=geom,stcode11&CQL_FILTER=stcode11=%27'+selectedstatecode +'%27&maxFeatures=50&outputFormat=json',
+ format :new ol.format.GeoJSON()
+
+
+ });
+
+ var vectorLayer1 = new ol.layer.Vector({
+ source: vectorSource,
+ style: customStyleFunction,
+
+
+ });
+
+ map.addLayer(vectorLayer1);
+
+
+ })
+
+}
+function customStyleFunction()
+ {
+
+
+ return [new styles.Style({
+ stroke: new styles.Stroke({
+ color: '#00ff00',
+ width: 2
+ })
+ })];
+
+
+
+ }
+
+
+function zoom(extent)
+{
+
+ extent = ol.proj.transformExtent(extent, 'EPSG:4326', 'EPSG:3857');
+ map.getView().fit(extent), { duration: 200 };
+
+
+
+
+}
+function clearmap()
+{
+ const layers = map.getLayers().getArray();
+ layers.forEach((layer) => {
+ if(layer.getVisible()==true)
+ {
+ layer.setVisible(false)
+ }
+ });
+}
+function removestatelayer(selectedcode)
+ {
+ clearmap();
+ Alllayersname=layersname.split(',');
+ Alllayers=layer.split(',');
+
+
+ for (var j=0;j<Alllayers.length;j++)
+ {
+ if ( Alllayers[j]=="TalukaIndia")
+ {
+ cql="STCODE11="+selectedcode;
+ }
+ else if (Alllayers[j]=="VillageIndia")
+ {
+ cql="ST_2011="+selectedcode;
+
+ }
+ else
+ {
+ cql="stcode11="+selectedcode;
+ }
+
+ if (Alllayers[j]=="VillageIndia")
+ {
+
+ new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ // crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS' : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution : 256,
+
+
+ })
+
+
+
+
+
+ }
+ else if (Alllayers[j]=="TalukaIndia")
+ {
+
+ var new_lyr =
+ new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ // crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS': Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution : 800,//1024,
+
+ // name : Alllayersname[j]
+ })
+
+ }
+ else
+
+ {
+
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url :GisUrl,
+ // crossOrigin: 'anonymous',
+ params : {
+ 'LAYERS': Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ // name : Alllayersname[j]
+ })
+ }
+ // newlyr=new_lyr;
+
+ map.addLayer(new_lyr);
+ }
+
+ }
+
+
+function getDistricts(selectedstatecode)
+{
+
+ if(selectedstatecode!=null)
+ {
+
+ districtlist=[];
+ talukalist=[];
+ villagelist=[];
+ var options="";
+ var j=getDistrict(selectedstatecode);
+ if(j)
+ {
+
+ var districtname="";
+
+
+ for ( var i = 0; i < j.length; i++) {
+
+
+ options += '<option value="' + j[i].districtcode+ '" >'
+ + j[i].districtname + '</option>';
+
+ districtlist.push({"districtcode":j[i].districtcode,"minx":j[i].minx,"miny":j[i].miny,"maxx":j[i].maxx,"maxy":j[i].maxy});
+
+
+
+
+ }
+
+ $("select#district").html(options);
+ }
+
+
+
+ $("#district").change(function(){
+ var selecteddistrictcode = $(this).children("option:selected").val();
+
+ var s=districtlist.find(x=>x.districtcode==selecteddistrictcode);
+
+ var extent=[s.minx,s.miny,s.maxx,s.maxy];
+ zoom(extent);
+ removedistrictlayer(selecteddistrictcode)
+ getTaluka(selecteddistrictcode)
+ });
+ }
+
+}
+
+function removedistrictlayer(selectedcode)
+{
+ clearmap();
+ Alllayersname=layersname.split(',');
+ Alllayers=layer.split(',');
+
+ for (var j=0;j<Alllayers.length;j++)
+ {
+
+ if ( Alllayers[j]=="TalukaIndia")
+ {
+ cql="DTCODE11='"+selectedcode+"'";
+ }
+
+ else if (Alllayers[j]=="VillageIndia")
+ {
+ cql="DT_2011='"+selectedcode+"'";
+ }
+ else
+ {
+
+ cql="dtcode11='"+selectedcode+"'";
+ }
+ // alert("district...."+Alllayers[j])
+ if (Alllayers[j]=="VillageIndia")
+ {
+ // alert("if...."+cql_dist);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution :256,
+
+ });
+ }
+ else if (Alllayers[j]=="TalukaIndia")
+ {
+ // alert("else ifff...."+Alllayers[j]);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution :800,
+
+ });
+ }
+ else
+ {
+ // alert("else...."+Alllayers[j]);
+ // alert("cql...."+cql_dist);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ //maxResolution : 256,
+
+ });
+ }
+ // newlyr=new_lyr;
+ map.addLayer(new_lyr);
+
+ }
+
+}
+
+function getTaluka(selecteddistrictcode)
+{
+ if(selecteddistrictcode!=null)
+ {
+ talukalist=[];
+ villagelist=[];
+var options="";
+var j=getTalukas(selecteddistrictcode)
+
+ if(j)
+ {
+
+ var talukaname="";
+ // options=' <option disabled selected>State</option>';
+ for ( var i = 0; i < j.length; i++) {
+
+ if(j[i].talukacode!=null)
+ {
+ options += '<option value="' + j[i].talukacode+ '" >'
+ + j[i].talukaname + '</option>';
+ talukalist.push({"talukacode":j[i].talukacode,"minx":j[i].minx,"miny":j[i].miny,"maxx":j[i].maxx,"maxy":j[i].maxy});
+
+ }
+
+ }
+ $("select#taluka").html(options);
+ }
+
+ }
+
+$("#taluka").change(function(){
+ var selectedtalukacode = $(this).children("option:selected").val();
+ getVillages(selectedtalukacode);
+ var s=talukalist.find(x=>x.talukacode==selectedtalukacode);
+
+ var extent=[s.minx,s.miny,s.maxx,s.maxy];
+ zoom(extent);
+ removetalukalayer(selectedtalukacode);
+
+})
+}
+function removetalukalayer(selectedcode)
+{
+ clearmap();
+ Alllayersname=layersname.split(',');
+ Alllayers=layer.split(',');
+ for (var j=0;j<Alllayers.length;j++)
+ {
+
+ if ( Alllayers[j]=="TalukaIndia")
+ {
+ cql="SDTCODE11='"+selectedcode+"'";
+ }
+ else if (Alllayers[j]=="VillageIndia")
+ {
+ cql="SDT_2011='"+selectedcode+"'";
+ }
+ /* else
+ {
+ cql="dtcode11='"+dist+"'";
+ }*/
+ // alert("district...."+Alllayers[j])
+ if (Alllayers[j]=="VillageIndia")
+ {
+ // alert("if...."+Alllayers[j]);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution : 856,
+
+ });
+ }
+ else if (Alllayers[j]=="TalukaIndia")
+ {
+ // alert("else ifff...."+Alllayers[j]);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ //maxResolution : 1024,//1024,
+
+ });
+ }
+
+ map.addLayer(new_lyr);
+
+
+ }
+}
+function getVillages(selectedtalukacode)
+{
+ var options="";
+ var j=getVillage(selectedtalukacode)
+
+ if(j)
+ {
+
+ var villagename="";
+ // options=' <option disabled selected>State</option>';
+ for ( var i = 0; i < j.length; i++) {
+
+ if(j[i].villagecode!=null)
+ {
+ options += '<option value="' + j[i].villagecode+ '" >'
+ + j[i].villagename + '</option>';
+ villagelist.push({"villagecode":j[i].villagecode,"minx":j[i].minx,"miny":j[i].miny,"maxx":j[i].maxx,"maxy":j[i].maxy});
+ }
+
+ }
+ $("select#village").html(options);
+ }
+
+
+}
+
+$("#village").change(function(){
+ var selectedvillagecode = $(this).children("option:selected").val();
+
+
+
+
+
+ var s=villagelist.find(x=>x.villagecode==selectedvillagecode);
+
+ var extent=[s.minx,s.miny,s.maxx,s.maxy];
+ zoom(extent);
+ removevillagelayer(selectedvillagecode);
+})
+function removevillagelayer(selectedcode)
+{
+ clearmap();
+ Alllayersname=layersname.split(',');
+ Alllayers=layer.split(',');
+ for (var j=0;j<Alllayers.length;j++)
+ {
+
+ if (Alllayers[j]=="VillageIndia")
+ {
+ cql="VIL_2011='"+selectedcode+"'";
+ }
+ /* else
+ {
+ cql="dtcode11='"+dist+"'";
+ }*/
+ // alert("district...."+Alllayers[j])
+ if (Alllayers[j]=="VillageIndia")
+ {
+ // alert("if...."+Alllayers[j]);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution : 256,
+
+ });
+ }
+ else if (Alllayers[j]=="TalukaIndia")
+ {
+ // alert("else ifff...."+Alllayers[j]);
+ var new_lyr = new ol.layer.Tile({
+ source : new ol.source.TileWMS({
+ url : GisUrl,
+ params : {
+ layers : Alllayers[j],
+ CQL_FILTER :cql,
+ version : '1.1.1',
+ transparent : 'true'
+ }
+ }),
+ maxResolution : 800,//1024,
+
+ });
+ }
+
+ map.addLayer(new_lyr);
+
+ }
+
+
+}
\ No newline at end of file
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/services/services.js
@@ -0,0 +1,137 @@
+var apiurl="https://api3.ncog.gov.in/BaseRest/";
+function getState()
+{
+ var data=null;
+ $.ajax({
+ url:apiurl+"getstate",
+ method:"POST",
+ dtaType:"json",
+ async: false,
+ data:{},
+ success:function(j)
+ {
+
+ data=j;
+
+ },
+ error:function (error)
+ {
+ alert(error);
+ }
+ });
+ return data;
+
+
+}
+
+function getDistrict(id)
+{
+ //var code={};
+ // code.statecode=id;
+ // var codobject=JSON.stringify(code);
+ var data=null;
+ $.ajax({
+ url:apiurl+"getdistrict/"+id,
+ method:"POST",
+ async: false,
+ contentType:"application/json;charset=utf-8",
+
+ // data:codobject,
+ success:function(j)
+ {
+ data=j;
+ },
+ error:function(error)
+ {
+ alert(error);
+ }
+
+
+ });
+ return data;
+ }
+
+function getTalukas(id)
+{
+// var code={};
+/// code.districtcode=id;
+// var codobject=JSON.stringify(code);
+ var options="";
+ var data=null;
+ $.ajax({
+ url:apiurl+"gettaluka/"+id,
+ method:"POST",
+ async: false,
+ contentType:"application/json;charset=utf-8",
+
+ // data:codobject,
+ success:function(j)
+ {
+
+ data=j;
+ },
+ error:function(error)
+ {
+ alert(error);
+ }
+
+
+ });
+ return data;
+}
+function getVillage(id)
+{
+// var code={};
+// code.talukacode=id;
+// var codobject=JSON.stringify(code);
+ var options="";
+ var data=null;
+ $.ajax({
+ url:apiurl+"getvillage/"+id,
+ method:"POST",
+ async: false,
+ contentType:"application/json;charset=utf-8",
+
+ // data:codobject,
+ success:function(j)
+ {
+
+ data=j;
+ },
+ error:function(error)
+ {
+ alert(error);
+ }
+
+
+ });
+ return data;
+}
+function getBuffer(lat,lon,range)
+{
+
+ var data=null;
+ $.ajax({
+ url:"/buffer/"+lat+"/"+lon+"/"+range,
+ method:"GET",
+ async: false,
+ contentType:"application/json;charset=utf-8",
+
+ // data:codobject,
+ success:function(j)
+ {
+ data=j;
+ },
+ error:function(error)
+ {
+ alert(error);
+ }
+
+
+ });
+ return data;
+ }
+
+
+
+
--- /dev/null
+++ b/src/main/resources/static/customol/jsnew/swipe/swipe.js
@@ -0,0 +1,44 @@
+var map;
+function swipe(m)
+{
+map=m;
+var aerial = findlayeByName(map.getLayerGroup(), 'name','Aerial');
+console.log(aerial.get('name'));
+startswipe(aerial)
+}
+function startswipe(aerial)
+{
+ var swipe = document.getElementById('swipe');
+
+aerial.on('prerender', function (event) {
+ var ctx = event.context;
+ var mapSize = map.getSize();
+ var width = mapSize[0] * (swipe.value / 100);
+ var tl = getRenderPixel(event, [width, 0]);
+ var tr = getRenderPixel(event, [mapSize[0], 0]);
+ var bl = getRenderPixel(event, [width, mapSize[1]]);
+ var br = getRenderPixel(event, mapSize);
+
+ ctx.save();
+ ctx.beginPath();
+ ctx.moveTo(tl[0], tl[1]);
+ ctx.lineTo(bl[0], bl[1]);
+ ctx.lineTo(br[0], br[1]);
+ ctx.lineTo(tr[0], tr[1]);
+ ctx.closePath();
+ ctx.clip();
+});
+
+aerial.on('postrender', function (event) {
+ var ctx = event.context;
+ ctx.restore();
+});
+
+swipe.addEventListener(
+ 'input',
+ function () {
+ map.render();
+ },
+ false
+);
+}
\ No newline at end of file
--- 'a/src/main/webapp/views/attributenew.jsp'
+++ b/src/main/webapp/views/attributenew.jsp
@@ -561,53 +561,73 @@
<!-- Right sidebar -->
<!-- ============================================================== -->
<!-- .right-sidebar -->
- <div class="right-sidebar">
+ <div class="right-sidebar" >
<div class="slimscrollright">
<div class="rpanel-title"> Service Panel <span><i class="ti-close right-side-toggle"></i></span> </div>
<div class="r-panel-body">
- <ul id="themecolors" class="m-t-20">
- <li><b>With Light sidebar</b></li>
- <li><a href="javascript:void(0)" data-theme="default" class="default-theme">1</a></li>
- <li><a href="javascript:void(0)" data-theme="green" class="green-theme">2</a></li>
- <li><a href="javascript:void(0)" data-theme="red" class="red-theme">3</a></li>
- <li><a href="javascript:void(0)" data-theme="blue" class="blue-theme working">4</a></li>
- <li><a href="javascript:void(0)" data-theme="purple" class="purple-theme">5</a></li>
- <li><a href="javascript:void(0)" data-theme="megna" class="megna-theme">6</a></li>
- <li class="d-block m-t-30"><b>With Dark sidebar</b></li>
- <li><a href="javascript:void(0)" data-theme="default-dark" class="default-dark-theme">7</a></li>
- <li><a href="javascript:void(0)" data-theme="green-dark" class="green-dark-theme">8</a></li>
- <li><a href="javascript:void(0)" data-theme="red-dark" class="red-dark-theme">9</a></li>
- <li><a href="javascript:void(0)" data-theme="blue-dark" class="blue-dark-theme">10</a></li>
- <li><a href="javascript:void(0)" data-theme="purple-dark" class="purple-dark-theme">11</a></li>
- <li><a href="javascript:void(0)" data-theme="megna-dark" class="megna-dark-theme ">12</a></li>
- </ul>
- <ul class="m-t-20 chatonline">
- <li><b>Chat option</b></li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/1.jpg" alt="user-img" class="img-circle"> <span>Varun Dhavan <small class="text-success">online</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/2.jpg" alt="user-img" class="img-circle"> <span>Genelia Deshmukh <small class="text-warning">Away</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/3.jpg" alt="user-img" class="img-circle"> <span>Ritesh Deshmukh <small class="text-danger">Busy</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/4.jpg" alt="user-img" class="img-circle"> <span>Arijit Sinh <small class="text-muted">Offline</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/5.jpg" alt="user-img" class="img-circle"> <span>Govinda Star <small class="text-success">online</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/6.jpg" alt="user-img" class="img-circle"> <span>John Abraham<small class="text-success">online</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/7.jpg" alt="user-img" class="img-circle"> <span>Hritik Roshan<small class="text-success">online</small></span></a>
- </li>
- <li>
- <a href="javascript:void(0)"><img src="assets/images/users/8.jpg" alt="user-img" class="img-circle"> <span>Pwandeep rajan <small class="text-success">online</small></span></a>
- </li>
- </ul>
+
+
+ <div class="vtabs ">
+ <ul class="nav nav-tabs tabs-vertical" role="tablist" style="width: 50px;">
+ <li class="nav-item"> <a class="nav-link active" data-toggle="tab" href="#home9" role="tab"><span><i class="ti-layers-alt"></i></span></a> </li>
+ <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#profile9" role="tab"><span><i class="ti-location-arrow"></i></span></a> </li>
+ <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#messages9" role="tab"><span><i class="ti-location-pin"></i></span></a> </li>
+ </ul>
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div class="tab-pane active" id="home9" role="tabpanel">
+ <div class="ribbon-wrapper card" style="width:280px;">
+ <h3 class="ribbon ribbon-bookmark ribbon-info" style=" width: 240px;top:0px;">Layers</h3>
+ <div id="groups"></div>
+
+ </div>
+ </div>
+ <div class="tab-pane " id="profile9" role="tabpanel">
+ <div class="ribbon-wrapper card" style="width:280px;">
+ <h3 class="ribbon ribbon-bookmark ribbon-info" style=" width: 240px;top:0px;">Navigation</h3>
+ <div class="col-lg-12 col-md-6 col-sm-3">
+ <select id="state" class="form-control" data-style="btn btn-primary btn-round" title="Single Select">
+ <!-- <option disabled selected>State</option> -->
+
+ </select>
+ </div>
+ <div class="col-lg-12 col-md-6 col-sm-3">
+ <select id="district" class="form-control" data-style="btn btn-primary btn-round" title="Single Select">
+
+
+ </select>
+ </div>
+
+ <div class="col-lg-12 col-md-6 col-sm-3">
+ <select id="taluka" class="form-control" data-style="btn btn-primary btn-round" title="Single Select">
+
+
+ </select>
+ </div>
+ <div class="col-lg-12 col-md-6 col-sm-3">
+ <select id="village" class="form-control" data-style="btn btn-primary btn-round" title="Single Select">
+
+
+ </select>
+ </div>
+
+
+ </div>
+ </div>
+ <div class="tab-pane " id="messages9" role="tabpanel">
+
+ <div class="ribbon-wrapper card" style="width:280px;">
+ <h3 class="ribbon ribbon-bookmark ribbon-info" style=" width: 240px;top:0px;">Identify</h3>
+ <div id="groupss">
+
+ </div>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+
</div>
</div>
</div>
@@ -685,7 +705,7 @@
<script src="customol/js/scaleline.js"></script>
<script src="customol/js/mouse-position.js"></script>
<script src="customol/js/layerSwitcher.js"></script>
-<script src="customol/js/findbylocation.js"></script>
+<!-- <script src="customol/js/findbylocation.js"></script> -->
<script src="customol/js/LayersGroup/indianmapLayersGroup.js"></script>
<script src="customol/js/LayersGroup/satelliteGroup.js"></script>
@@ -702,7 +722,7 @@
<script src="mis/js/services/misservices.js"></script>
<script src="mis/js/customscripts/search.js"></script>
-<script src=https://code.jquery.com/jquery-3.5.1.js></script>
+<!-- <script src=https://code.jquery.com/jquery-3.5.1.js></script> -->
<script src=https://cdn.datatables.net/1.10.23/js/jquery.dataTables.min.js></script>
<script src=https://cdn.datatables.net/buttons/1.6.5/js/dataTables.buttons.min.js></script>
<script src=https://cdn.datatables.net/buttons/1.6.5/js/buttons.flash.min.js></script>
--- /dev/null
+++ b/src/main/webapp/views/map.jsp
@@ -0,0 +1,722 @@
+<%@ page language="java" contentType="text/html; charset=UTF-8"
+ pageEncoding="UTF-8"%>
+<!DOCTYPE html>
+<html lang="en">
+
+
+<!-- Mirrored from themedesigner.in/demo/admin-press/main/index.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 04 May 2019 05:11:28 GMT -->
+<head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <!-- Tell the browser to be responsive to screen width -->
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <!-- Favicon icon -->
+ <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon.png">
+ <title>Admin Press Admin Template - The Ultimate Bootstrap 4 Admin Template</title>
+ <!-- Bootstrap Core CSS -->
+ <link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+ <!-- morris CSS -->
+ <link href="assets/plugins/morrisjs/morris.css" rel="stylesheet">
+ <!-- Custom CSS -->
+ <link href="assets/css/style.css" rel="stylesheet">
+ <!-- You can change the theme colors from here -->
+ <link href="assets/css/colors/blue.css" id="theme" rel="stylesheet">
+
+ <link href="ol/ol.css" rel="stylesheet">
+<link href="customol/css/customOlStyle.css" rel="stylesheet" />
+ <link href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css">
+<link href="https://cdn.datatables.net/buttons/1.6.5/css/buttons.dataTables.min.css">
+ <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+ <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+ <!--[if lt IE 9]>
+ <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+ <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
+<![endif]-->
+</head>
+
+<body class="fix-header fix-sidebar card-no-border">
+ <!-- ============================================================== -->
+ <!-- Preloader - style you can find in spinners.css -->
+ <!-- ============================================================== -->
+ <div class="preloader">
+ <svg class="circular" viewBox="25 25 50 50">
+ <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" /> </svg>
+ </div>
+ <!-- ============================================================== -->
+ <!-- Main wrapper - style you can find in pages.scss -->
+ <!-- ============================================================== -->
+ <div id="main-wrapper">
+ <!-- ============================================================== -->
+ <!-- Topbar header - style you can find in pages.scss -->
+ <!-- ============================================================== -->
+ <header class="topbar" style="background: #1976d2;">
+ <nav class="navbar top-navbar navbar-expand-md navbar-light">
+ <!-- ============================================================== -->
+ <!-- Logo -->
+ <!-- ============================================================== -->
+ <div class="navbar-header">
+ <a class="navbar-brand" href="index.html">
+ <!-- Logo icon --><b>
+ <!--You can put here icon as well // <i class="wi wi-sunset"></i> //-->
+ <!-- Dark Logo icon -->
+ <!-- <img src="assets/images/logo-icon.png" alt="homepage" class="dark-logo" /> -->
+ <!-- Light Logo icon -->
+ <!-- <img src="assets/images/logo-light-icon.png" alt="homepage" class="light-logo" /> -->
+ </b>
+ <!--End Logo icon -->
+ <!-- Logo text --><span>
+ <!-- dark Logo text -->
+ <img src="assets/images/bisag_logo.png" alt="homepage" class="dark-logo" style="height: 48px;" />
+ <!-- Light Logo text -->
+ <img src="assets/images/logo-light-text.png" class="light-logo" alt="homepage" /></span> </a>
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Logo -->
+ <!-- ============================================================== -->
+ <div class="navbar-collapse">
+ <!-- ============================================================== -->
+ <!-- toggle and nav items -->
+ <!-- ============================================================== -->
+ <ul class="navbar-nav mr-auto mt-md-0">
+ <!-- This is -->
+ <li class="nav-item"> <a class="nav-link nav-toggler hidden-md-up text-muted waves-effect waves-dark" href="javascript:void(0)"><i class="mdi mdi-menu"></i></a> </li>
+
+ <!-- ============================================================== -->
+ <!-- Comment -->
+ <!-- ============================================================== -->
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle text-muted text-muted waves-effect waves-dark" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="mdi mdi-message"></i>
+ <div class="notify"> <span class="heartbit"></span> <span class="point"></span> </div>
+ </a>
+ <div class="dropdown-menu mailbox animated slideInUp">
+ <ul>
+ <li>
+ <div class="drop-title">Notifications</div>
+ </li>
+ <li>
+ <div class="message-center">
+ <!-- Message -->
+ <a href="#">
+ <div class="btn btn-danger btn-circle"><i class="fa fa-link"></i></div>
+ <div class="mail-contnet">
+ <h5>Luanch Admin</h5> <span class="mail-desc">Just see the my new admin!</span> <span class="time">9:30 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="btn btn-success btn-circle"><i class="ti-calendar"></i></div>
+ <div class="mail-contnet">
+ <h5>Event today</h5> <span class="mail-desc">Just a reminder that you have event</span> <span class="time">9:10 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="btn btn-info btn-circle"><i class="ti-settings"></i></div>
+ <div class="mail-contnet">
+ <h5>Settings</h5> <span class="mail-desc">You can customize this template as you want</span> <span class="time">9:08 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="btn btn-primary btn-circle"><i class="ti-user"></i></div>
+ <div class="mail-contnet">
+ <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:02 AM</span> </div>
+ </a>
+ </div>
+ </li>
+ <li>
+ <a class="nav-link text-center" href="javascript:void(0);"> <strong>Check all notifications</strong> <i class="fa fa-angle-right"></i> </a>
+ </li>
+ </ul>
+ </div>
+ </li>
+ <!-- ============================================================== -->
+ <!-- End Comment -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Messages -->
+ <!-- ============================================================== -->
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark" href="#" id="2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="mdi mdi-email"></i>
+ <div class="notify"> <span class="heartbit"></span> <span class="point"></span> </div>
+ </a>
+ <div class="dropdown-menu mailbox animated slideInUp" aria-labelledby="2">
+ <ul>
+ <li>
+ <div class="drop-title">You have 4 new messages</div>
+ </li>
+ <li>
+ <div class="message-center">
+ <!-- Message -->
+ <a href="#">
+ <div class="user-img"> <img src="assets/images/users/1.jpg" alt="user" class="img-circle"> <span class="profile-status online pull-right"></span> </div>
+ <div class="mail-contnet">
+ <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:30 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="user-img"> <img src="assets/images/users/2.jpg" alt="user" class="img-circle"> <span class="profile-status busy pull-right"></span> </div>
+ <div class="mail-contnet">
+ <h5>Sonu Nigam</h5> <span class="mail-desc">I've sung a song! See you at</span> <span class="time">9:10 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="user-img"> <img src="assets/images/users/3.jpg" alt="user" class="img-circle"> <span class="profile-status away pull-right"></span> </div>
+ <div class="mail-contnet">
+ <h5>Arijit Sinh</h5> <span class="mail-desc">I am a singer!</span> <span class="time">9:08 AM</span> </div>
+ </a>
+ <!-- Message -->
+ <a href="#">
+ <div class="user-img"> <img src="assets/images/users/4.jpg" alt="user" class="img-circle"> <span class="profile-status offline pull-right"></span> </div>
+ <div class="mail-contnet">
+ <h5>Pavan kumar</h5> <span class="mail-desc">Just see the my admin!</span> <span class="time">9:02 AM</span> </div>
+ </a>
+ </div>
+ </li>
+ <li>
+ <a class="nav-link text-center" href="javascript:void(0);"> <strong>See all e-Mails</strong> <i class="fa fa-angle-right"></i> </a>
+ </li>
+ </ul>
+ </div>
+ </li>
+ <!-- ============================================================== -->
+ <!-- End Messages -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Messages -->
+ <!-- ============================================================== -->
+ <li class="nav-item dropdown mega-dropdown"> <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="mdi mdi-view-grid"></i></a>
+ <div class="dropdown-menu animated slideInUp">
+ <ul class="mega-dropdown-menu row">
+ <li class="col-lg-3 col-xlg-2 m-b-30">
+ <h4 class="m-b-20">CAROUSEL</h4>
+ <!-- CAROUSEL -->
+ <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
+ <div class="carousel-inner" role="listbox">
+ <div class="carousel-item active">
+ <div class="container"> <img class="d-block img-fluid" src="assets/images/big/img1.jpg" alt="First slide"></div>
+ </div>
+ <div class="carousel-item">
+ <div class="container"><img class="d-block img-fluid" src="assets/images/big/img2.jpg" alt="Second slide"></div>
+ </div>
+ <div class="carousel-item">
+ <div class="container"><img class="d-block img-fluid" src="assets/images/big/img3.jpg" alt="Third slide"></div>
+ </div>
+ </div>
+ <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a>
+ <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a>
+ </div>
+ <!-- End CAROUSEL -->
+ </li>
+ <li class="col-lg-3 m-b-30">
+ <h4 class="m-b-20">ACCORDION</h4>
+ <!-- Accordian -->
+ <div id="accordion" class="nav-accordion" role="tablist" aria-multiselectable="true">
+ <div class="card">
+ <div class="card-header" role="tab" id="headingOne">
+ <h5 class="mb-0">
+ <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+ Collapsible Group Item #1
+ </a>
+ </h5> </div>
+ <div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne">
+ <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high. </div>
+ </div>
+ </div>
+ <div class="card">
+ <div class="card-header" role="tab" id="headingTwo">
+ <h5 class="mb-0">
+ <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+ Collapsible Group Item #2
+ </a>
+ </h5> </div>
+ <div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo">
+ <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. </div>
+ </div>
+ </div>
+ <div class="card">
+ <div class="card-header" role="tab" id="headingThree">
+ <h5 class="mb-0">
+ <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
+ Collapsible Group Item #3
+ </a>
+ </h5> </div>
+ <div id="collapseThree" class="collapse" role="tabpanel" aria-labelledby="headingThree">
+ <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. </div>
+ </div>
+ </div>
+ </div>
+ </li>
+ <li class="col-lg-3 m-b-30">
+ <h4 class="m-b-20">CONTACT US</h4>
+ <!-- Contact -->
+ <form>
+ <div class="form-group">
+ <input type="text" class="form-control" id="exampleInputname1" placeholder="Enter Name"> </div>
+ <div class="form-group">
+ <input type="email" class="form-control" placeholder="Enter email"> </div>
+ <div class="form-group">
+ <textarea class="form-control" id="exampleTextarea" rows="3" placeholder="Message"></textarea>
+ </div>
+ <button type="submit" class="btn btn-info">Submit</button>
+ </form>
+ </li>
+ <li class="col-lg-3 col-xlg-4 m-b-30">
+ <h4 class="m-b-20">List style</h4>
+ <!-- List style -->
+ <ul class="list-style-none">
+ <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> You can give link</a></li>
+ <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Give link</a></li>
+ <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Another Give link</a></li>
+ <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Forth link</a></li>
+ <li><a href="javascript:void(0)"><i class="fa fa-check text-success"></i> Another fifth link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </li>
+ <!-- ============================================================== -->
+ <!-- End Messages -->
+ <!-- ============================================================== -->
+ </ul>
+ <!-- ============================================================== -->
+ <!-- User profile and search -->
+ <!-- ============================================================== -->
+ <ul class="navbar-nav my-lg-0">
+ <!-- ============================================================== -->
+ <!-- Search -->
+ <!-- ============================================================== -->
+ <li class="nav-item hidden-sm-down search-box"> <a class="nav-link hidden-sm-down text-muted waves-effect waves-dark" href="javascript:void(0)"><i class="ti-search"></i></a>
+ <form class="app-search">
+ <input type="text" class="form-control" placeholder="Search & enter"> <a class="srh-btn"><i class="ti-close"></i></a> </form>
+ </li>
+ <!-- ============================================================== -->
+ <!-- Language -->
+ <!-- ============================================================== -->
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="flag-icon flag-icon-us"></i></a>
+ <div class="dropdown-menu dropdown-menu-right scale-up"> <a class="dropdown-item" href="#"><i class="flag-icon flag-icon-in"></i> India</a> <a class="dropdown-item" href="#"><i class="flag-icon flag-icon-fr"></i> French</a> <a class="dropdown-item" href="#"><i class="flag-icon flag-icon-cn"></i> China</a> <a class="dropdown-item" href="#"><i class="flag-icon flag-icon-de"></i> Dutch</a> </div>
+ </li>
+ <!-- ============================================================== -->
+ <!-- Profile -->
+ <!-- ============================================================== -->
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle text-muted waves-effect waves-dark" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-power-off"></i> </a>
+ <div class="dropdown-menu dropdown-menu-right scale-up">
+ <ul class="dropdown-user">
+
+
+
+
+ <li><a href="/logout"><i class="fa fa-power-off"></i> Logout</a></li>
+ </ul>
+ </div>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </header>
+ <!-- ============================================================== -->
+ <!-- End Topbar header -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Left Sidebar - style you can find in sidebar.scss -->
+ <!-- ============================================================== -->
+
+ <!-- End User profile text-->
+ <!-- Sidebar navigation-->
+
+ <!-- ============================================================== -->
+ <!-- End Left Sidebar - style you can find in sidebar.scss -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Page wrapper -->
+ <!-- ============================================================== -->
+ <div class="page-wrapper">
+ <!-- ============================================================== -->
+ <!-- Bread crumb and right sidebar toggle -->
+ <!-- ============================================================== -->
+ <div class="row page-titles">
+ <div class="col-md-5 align-self-center">
+ <h3 class="text-themecolor">Dashboard</h3>
+ </div>
+ <div class="col-md-7 align-self-center">
+ <ol class="breadcrumb">
+ <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
+ <li class="breadcrumb-item active">Dashboard</li>
+ </ol>
+ </div>
+ <div>
+ <button class="right-side-toggle waves-effect waves-light btn-inverse btn btn-circle btn-sm pull-right m-l-10"><i class="ti-settings text-white"></i></button>
+ </div>
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Bread crumb and right sidebar toggle -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Container fluid -->
+ <!-- ============================================================== -->
+ <div class="container-fluid">
+ <!-- ============================================================== -->
+ <!-- Start Page Content -->
+ <!-- ============================================================== -->
+ <!-- Row -->
+ <!-- Row -->
+
+ <!-- Row -->
+ <!-- Row -->
+ <!-- Row -->
+ <!-- Row -->
+ <div class="row">
+ <div class="col-lg-4 col-xlg-3">
+ <div class="card">
+ <div class="card-body bg-inverse" style="background: url(../assets/images/background/user-info.jpg) / cover;">
+ <h3 class="text-white card-title">Filter</h3>
+
+ </div>
+ <div class="card-body">
+ <div class="message-box contact-box">
+
+ <div class="message-widget contact-widget">
+ <ul class="nav nav-tabs" id="myTab" role="tablist">
+ <li class="nav-item"> <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home5" role="tab" aria-controls="home5" aria-expanded="true"><span class="hidden-sm-up"><i class="ti-home"></i></span> <span class="hidden-xs-down">Attribute</span></a> </li>
+ <li class="nav-item"> <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile5" role="tab" aria-controls="profile"><span class="hidden-sm-up"><i class="ti-user"></i></span> <span class="hidden-xs-down">Spatial</span></a></li>
+
+ </ul>
+ <div class="tab-content tabcontent-border p-20" id="myTabContent">
+ <div role="tabpanel" class="tab-pane fade show active" id="home5" aria-labelledby="home-tab">
+
+ <form id ="filterform" >
+
+
+ <input name="localIdFrom" style="border:2px solid black" id="localIdFrom" type="hidden" placeholder="From" >
+ <input style =" width:120px;" id="localIdTo" name="localIdTo" type="hidden" placeholder="To" >
+
+
+ Satellite
+
+ <select name="satelite" id="satelite" class="form-control" >
+ <option selected disabled>Choose one</option>
+ <option value="CARTOSAT-1">CARTOSAT-1</option>
+ <option value="CARTOSAT-2">CARTOSAT-2</option>
+ <option value="CARTOSAT-2D">CARTOSAT-2D</option>
+ <option value="CARTOSAT-2E">CARTOSAT-2E</option>
+ <option value="IKONOS">IKONOS</option>
+ <option value="IRS-1A">IRS-1A</option>
+ <option value="IRS-1B">IRS-1B</option>
+ <option value="IRS-1C">IRS-1C</option>
+ <option value="IRS-1D">IRS-1D</option>
+ <option value="IRS-P3">IRS-P3</option>
+ <option value="IRS-P4">IRS-P4</option>
+ <option value="IRS-P6">IRS-P6</option>
+ <option value="IRS-R2">IRS-R2</option>
+ <option value="IRS-R2A">IRS-R2A</option>
+ <option value="OCEANSAT-2">OCEANSAT-2</option>
+ <option value="RISAT-1">RISAT-1</option>
+ </select>
+ <br><br>
+ Sensor
+ <select name="sensors" id="sensors" class="form-control">
+ <optgroup >
+ <option selected disabled>Choose one</option>
+ <option value="AW">AW</option>
+ <option value="L1">L1</option>
+ <option value="L2">L2</option>
+ <option value="L3">L3</option>
+ <option value="L4">L4</option>
+ <option value="MX">MX</option>
+ <option value="OCM">OCM</option>
+ <option value="PAN">PAN</option>
+ <option value="PAN/MSI">PAN/MSI</option>
+ <option value="SAR">SAR</option>
+ <option value="WIF">WIF</option>
+ </optgroup>
+
+ </select>
+ <br><br>
+
+ Date :
+ <br>
+ From
+ <input name="dateOfPassFrom" style =" width:120px;" class="form-control" placeholder="From" type="text" onfocus="(this.type='date')" onblur="(this.type='text')" id="dateOfPassFrom" value="2020-12-01" >
+
+ To
+ <input name="dateOfPassTo" style =" width:120px;" class="form-control" placeholder="To" type="text" onfocus="(this.type='date')" onblur="(this.type='text')" id="dateOfPassTo" value="2020-12-31" >
+ <br><br>
+
+ Path
+ <input name="pathFrom" class="form-control" style =" width:120px;margin-left:10px" id="pathFrom" type="number" placeholder="From">
+
+ <span>-</span>
+
+
+ <input name="pathTo" class="form-control" style =" width:120px;" id="pathTo" type="number" placeholder="To">
+
+ <br><br>
+
+
+
+ Row
+
+ <input name="rowFrom" class="form-control" id="rowFrom" type="number" placeholder="From">
+
+
+ <input name="rowTo" class="form-control" style ="" id="rowTo" type="number" placeholder="To">
+
+ <br><br>
+
+
+
+ <div class="modal-footer">
+ <button id="filter" value="val_1" name="but1" class="btn btn-rounded btn-outline-info">Filter</button>
+ <!-- <input value="Submit" type="submit" onclick="filterData()"> -->
+ <button id="reset" name="reset" onclick="resetForm()" class="btn btn-rounded btn-outline-info">Reset</button>
+ </div>
+
+
+ </form>
+
+ </div>
+ <div class="tab-pane fade" id="profile5" role="tabpanel" aria-labelledby="profile-tab">
+
+ <form id ="filterform1">
+
+ <div >
+
+ <h5 >Select Special Type</h5>
+
+
+
+ <select name="selectnone" class="form-control" id="selectnone" onchange="changeFunc();">
+
+
+ <option value="selectnone">Select None</option>
+ <option value="city">City</option>
+ <option value="point">Point</option>
+ <option value="administrator">Administrator Boundaries</option>
+ <option value="rectangular">Rectangular Extent</option>
+
+
+ </select>
+
+
+ </div>
+ <br><input style ="display:none;" id="cityname" class="form-control" type="text" name="gid" placeholder="city name" >
+ <div id="search-result"></div>
+ <div class="clear"></div>
+
+ <div class="modal-footer">
+ <button id="cityfilter" type="button" class="btn btn-rounded btn-outline-info" onclick="onclicktaluka()">Filter</button>
+ <button id="reset2" name="reset2" onclick="resetForm1()" class="btn btn-rounded btn-outline-info">Reset</button>
+
+ </div>
+
+
+
+</form>
+
+ </div>
+
+ </div>
+
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-lg-8 col-xlg-9">
+ <div class="card">
+ <!-- <div class="card-body"> -->
+
+ <div id="target-map" style="width:100%!important; height:680px;"></div>
+ <div id="latlon" class="latlon"></div>
+ <div id="scale" class="scale-line"></div>
+ <div id="location"
+ style="width: 24px; height: 24px; font-size: 24px;">
+ <div id="popup" class="ol-popup">
+ <a href="#" id="popup-closer" class="ol-popup-closer"></a>
+ <div id="popup-content"></div>
+
+ </div>
+ </div>
+ <!-- </div> -->
+ </div>
+ </div>
+ </div>
+ <!-- Row -->
+ <div class="row">
+
+
+
+
+
+ <div class="col-lg-12">
+ <div class="card">
+ <div class="card-body">
+
+ <div class="table-responsive">
+ <table id="getASIReportList" class="table color-table " style="height: 335px;"></table >
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- Row -->
+ <!-- ============================================================== -->
+ <!-- End PAge Content -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- Right sidebar -->
+ <!-- ============================================================== -->
+ <!-- .right-sidebar -->
+ <div class="right-sidebar">
+ <div class="slimscrollright">
+ <div class="rpanel-title"> Service Panel <span><i class="ti-close right-side-toggle"></i></span> </div>
+ <div class="r-panel-body">
+ <ul id="themecolors" class="m-t-20">
+ <li><b>With Light sidebar</b></li>
+ <li><a href="javascript:void(0)" data-theme="default" class="default-theme">1</a></li>
+ <li><a href="javascript:void(0)" data-theme="green" class="green-theme">2</a></li>
+ <li><a href="javascript:void(0)" data-theme="red" class="red-theme">3</a></li>
+ <li><a href="javascript:void(0)" data-theme="blue" class="blue-theme working">4</a></li>
+ <li><a href="javascript:void(0)" data-theme="purple" class="purple-theme">5</a></li>
+ <li><a href="javascript:void(0)" data-theme="megna" class="megna-theme">6</a></li>
+ <li class="d-block m-t-30"><b>With Dark sidebar</b></li>
+ <li><a href="javascript:void(0)" data-theme="default-dark" class="default-dark-theme">7</a></li>
+ <li><a href="javascript:void(0)" data-theme="green-dark" class="green-dark-theme">8</a></li>
+ <li><a href="javascript:void(0)" data-theme="red-dark" class="red-dark-theme">9</a></li>
+ <li><a href="javascript:void(0)" data-theme="blue-dark" class="blue-dark-theme">10</a></li>
+ <li><a href="javascript:void(0)" data-theme="purple-dark" class="purple-dark-theme">11</a></li>
+ <li><a href="javascript:void(0)" data-theme="megna-dark" class="megna-dark-theme ">12</a></li>
+ </ul>
+ <ul class="m-t-20 chatonline">
+ <li><b>Chat option</b></li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/1.jpg" alt="user-img" class="img-circle"> <span>Varun Dhavan <small class="text-success">online</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/2.jpg" alt="user-img" class="img-circle"> <span>Genelia Deshmukh <small class="text-warning">Away</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/3.jpg" alt="user-img" class="img-circle"> <span>Ritesh Deshmukh <small class="text-danger">Busy</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/4.jpg" alt="user-img" class="img-circle"> <span>Arijit Sinh <small class="text-muted">Offline</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/5.jpg" alt="user-img" class="img-circle"> <span>Govinda Star <small class="text-success">online</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/6.jpg" alt="user-img" class="img-circle"> <span>John Abraham<small class="text-success">online</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/7.jpg" alt="user-img" class="img-circle"> <span>Hritik Roshan<small class="text-success">online</small></span></a>
+ </li>
+ <li>
+ <a href="javascript:void(0)"><img src="assets/images/users/8.jpg" alt="user-img" class="img-circle"> <span>Pwandeep rajan <small class="text-success">online</small></span></a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Right sidebar -->
+ <!-- ============================================================== -->
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Container fluid -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- footer -->
+ <!-- ============================================================== -->
+ <footer class="footer">
+ © 2019 Admin Press Admin by themedesigner.in
+ </footer>
+ <!-- ============================================================== -->
+ <!-- End footer -->
+ <!-- ============================================================== -->
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Page wrapper -->
+ <!-- ============================================================== -->
+ </div>
+ <!-- ============================================================== -->
+ <!-- End Wrapper -->
+ <!-- ============================================================== -->
+ <!-- ============================================================== -->
+ <!-- All Jquery -->
+ <!-- ============================================================== -->
+ <script src="assets/plugins/jquery/jquery.min.js"></script>
+ <!-- Bootstrap tether Core JavaScript -->
+ <script src="assets/plugins/bootstrap/js/popper.min.js"></script>
+ <script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
+ <!-- slimscrollbar scrollbar JavaScript -->
+ <script src="assets/js/jquery.slimscroll.js"></script>
+ <!--Wave Effects -->
+ <script src="assets/js/waves.js"></script>
+ <!--Menu sidebar -->
+ <script src="assets/js/sidebarmenu.js"></script>
+ <!--stickey kit -->
+ <script src="assets/plugins/sticky-kit-master/dist/sticky-kit.min.js"></script>
+ <!--Custom JavaScript -->
+ <script src="assets/js/custom.min.js"></script>
+ <!-- ============================================================== -->
+ <!-- This page plugins -->
+ <!-- ============================================================== -->
+ <!--sparkline JavaScript -->
+ <script src="assets/plugins/sparkline/jquery.sparkline.min.js"></script>
+ <!--morris JavaScript -->
+ <script src="assets/plugins/raphael/raphael-min.js"></script>
+ <script src="assets/plugins/morrisjs/morris.min.js"></script>
+ <!-- Chart JS -->
+ <script src="assets/js/dashboard1.js"></script>
+ <!-- ============================================================== -->
+ <!-- Style switcher -->
+ <!-- ============================================================== -->
+ <script src="assets/plugins/styleswitcher/jQuery.style.switcher.js"></script>
+
+
+ <script src="ol/ol.js"></script>
+<script src="customol/js/clear.js"></script>
+<script src="customol/js/identify.js"></script>
+<script src="customol/js/exportpdf.js"></script>
+<script src="customol/js/measure.js"></script>
+<script src="customol/js/controllers.js"></script>
+<script src="customol/js/navigation.js"></script>
+<script src="customol/js/scaleline.js"></script>
+<script src="customol/js/mouse-position.js"></script>
+<script src="customol/js/layerSwitcher.js"></script>
+<script src="customol/js/findbylocation.js"></script>
+
+<script src="customol/js/LayersGroup/indianmapLayersGroup.js"></script>
+<script src="customol/js/LayersGroup/satelliteGroup.js"></script>
+
+<script src="customol/js/LayersGroup/commonlayersGroup.js"></script>
+<script src="customol/js/LayersGroup/transportGroup.js"></script>
+<script src="customol/js/LayersGroup/IdentifyLayerGroup.js"></script>
+<script src="customol/js/addGeom.js"></script>
+
+<script src="customol/js/main.js"></script>
+<script src="customol/js/services/services.js"></script>
+<script src="customol/js/Base64.js"></script>
+<script src="customol/js/geomForm.js"></script>
+<script src="mis/js/services/misservices.js"></script>
+<script src="mis/js/customscripts/search.js"></script>
+
+<!-- <script src=https://code.jquery.com/jquery-3.5.1.js></script> -->
+<script src=https://cdn.datatables.net/1.10.23/js/jquery.dataTables.min.js></script>
+<script src=https://cdn.datatables.net/buttons/1.6.5/js/dataTables.buttons.min.js></script>
+<script src=https://cdn.datatables.net/buttons/1.6.5/js/buttons.flash.min.js></script>
+<script src=https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js></script>
+<script src=https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js></script>
+<script src=https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js></script>
+<script src=https://cdn.datatables.net/buttons/1.6.5/js/buttons.html5.min.js></script>
+<script src=https://cdn.datatables.net/buttons/1.6.5/js/buttons.print.min.js></script>
+<script src="mis/js/customscripts/tables.js"></script>
+<script src="mis/js/customscripts/filter.js"></script>
+
+</body>
+
+
+<!-- Mirrored from themedesigner.in/demo/admin-press/main/index.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 04 May 2019 05:15:28 GMT -->
+</html>
\ No newline at end of file