mfajri
/
gis_app
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

new update

master
Choirul Fajri 2 years ago
parent
8c245a2ac4
commit
462acbc934
3 changed files with 105 additions and 27 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      assets/css/index.css
  2. 50
      index.html
  3. 49
      main.js

13
assets/css/index.css
Unescape View File

@ -24,21 +24,22 @@
height: 100%; height: 100%;
width: 100%; width: 100%;
min-height: 700px; min-height: 700px;
} }
#content { #content {
padding: 0; padding: 0;
margin: 0; margin: 0;
height: 100%; height: 100%;
width: 100%; width: 100%;
min-height: 650px; min-height: 650px;
} }
.navigatorMenu { .sidebarMenu {
padding-right: 0 !important; padding-right: 0 !important;
} position: fixed
}
#HomeButton { #HomeButton {
position: absolute; position: absolute;
top: 100px; top: 100px;
left: 15px; left: 15px;

50
index.html
Unescape View File

@ -19,7 +19,7 @@
</head> </head>
<body> <body>
<div class="container-fluid mt-3 mb-2"> <div class="container-fluid mt-3 mb-2">
<div class="card mr-3 ml-3"> <div class="card">
<div class="card-body"> <div class="card-body">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
@ -61,13 +61,13 @@
<div class="col-md-6"> <div class="col-md-6">
<div class="row"> <div class="row">
<div class="col-3"> <div class="col-3">
<button class="btn btn-ligth btn-md active" role="button" aria-pressed="true"> <button class="btn btn-ligth btn-md active" id="bufferTogle" role="button" aria-pressed="true" data-toggle="collapse" data-target="#collapseBuffer" data-dismiss="collapsePrint" aria-expanded="false" aria-controls="collapseBuffer">
<span class="h5">Buffer</span> <span class="h5">Buffer</span>
</button> </button>
</div> </div>
<div class="col-2"> <div class="col-2">
<button class="btn btn-ligth btn-md"> <button class="btn btn-ligth btn-md" id="printTogle" role="button" aria-pressed="true" data-toggle="collapse" data-target="#collapsePrint" data-dismiss="collapseSidebar" aria-expanded="false" aria-controls="collapsePrint">
<span class="h5">Printing</span> <span class="h5">Print</span>
</button> </button>
</div> </div>
<div class="col-7"> <div class="col-7">
@ -81,8 +81,8 @@
</div> </div>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-2 navigatorMenu"> <div class="col-md-2 sidebarMenu collapse collapseBuffer" id="collapseBuffer">
<div class="card ml-3"> <div class="card">
<div class="card-body"> <div class="card-body">
<form> <form>
<legend>Buffer Proccess</legend> <legend>Buffer Proccess</legend>
@ -115,8 +115,42 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-10"> <div class="col-md-2 sidebarMenu collapse collapsePrint" id="collapsePrint">
<div class="card mr-3"> <div class="card">
<div class="card-body">
<form>
<legend>Print Proccess</legend>
<div class="form-group">
<label for="exampleFormControlSelect">Select Feature Layer</label>
<select class="form-control" id="Layer" required>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">Radius Distance</label>
<input type="number" class="form-control" id="radiusDistance" value="100">
</div>
<div class="form-group">
<label for="exampleFormControlSelect2">Linear Unit</label>
<select multiple class="form-control" id="Unit" required>
<option value="meters" selected>Meter</option>
<option value="kilometers">Kilometer</option>
<option value="miles">Miles</option>
</select>
</div>
<div class="row">
<div class="col">
<button id="procces" type="button" class="btn btn-ligth">Submit</button>
</div>
<div class="col">
<button id="reset" type="button" class="btn btn-ligth">Reset</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-12" id="map">
<div class="card">
<div class="card-body" id="content"> <div class="card-body" id="content">
<div id="HomeButton"></div> <div id="HomeButton"></div>
</div> </div>

49
main.js
Unescape View File

@ -11,8 +11,9 @@ $(document).ready(function () {
"esri/Graphic", "esri/Graphic",
"esri/rest/support/LinearUnit", "esri/rest/support/LinearUnit",
"esri/rest/geoprocessor", "esri/rest/geoprocessor",
"esri/layers/FeatureLayer" "esri/layers/FeatureLayer",
], (esriConfig, WebMap, MapView, Home, LayerList, GraphicsLayer, Graphic, LinearUnit, geoprocessor, FeatureLayer) => { "esri/widgets/Print"
], (esriConfig, WebMap, MapView, Home, LayerList, GraphicsLayer, Graphic, LinearUnit, geoprocessor, FeatureLayer, Print) => {
esriConfig.portalUrl = "https://dev.gisportal.id/portal"; esriConfig.portalUrl = "https://dev.gisportal.id/portal";
const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Buffer"; const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Buffer";
@ -131,6 +132,14 @@ $(document).ready(function () {
$('#Layer').append('<option value="'+layerSource+'">'+layer.title+'</option>') $('#Layer').append('<option value="'+layerSource+'">'+layer.title+'</option>')
}) })
}) })
const print = new Print({
view: view,
// specify your own print service
printServiceUrl:
"https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task"
});
view.ui.add(print, "bottom-right");
}) })
@ -144,9 +153,43 @@ $(document).ready(function () {
const foundLayer = webmap.allLayers.find(function(layer) { const foundLayer = webmap.allLayers.find(function(layer) {
return layer.title === "PIPELINE INSPECTION"; return layer.title === "PIPELINE INSPECTION";
}); });
// console.log("Layer",foundLayer)
} }
document.getElementById('bufferTogle').addEventListener('click', e => {
$("#collapsePrint").collapse('hide');
$("#map").removeClass("col-md-12");
$("#map").addClass("col-md-10");
})
$('#collapseBuffer').on('hidden.bs.collapse', function () {
$("#map").removeClass("col-md-10");
$("#map").addClass("col-md-12");
if($('#collapsePrint').hasClass('collapse')){
}
else{
$("#map").removeClass("col-md-12");
$("#map").addClass("col-md-10");
}
});
document.getElementById('printTogle').addEventListener('click', e => {
$("#collapseBuffer").collapse('hide');
$("#map").removeClass("col-md-12");
$("#map").addClass("col-md-10");
})
$('#collapsePrint').on('hidden.bs.collapse', function () {
$("#map").removeClass("col-md-10");
$("#map").addClass("col-md-12");
if($('#collapseBuffer').hasClass('collapse')){
}
else{
$("#map").removeClass("col-md-12");
$("#map").addClass("col-md-10");
}
});

Write Preview
Loading…
Cancel
Save