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

header fix & buffer proccess

master
Choirul Fajri 2 years ago
parent
8f001103fd
commit
f54ab8452b
4 changed files with 425 additions and 30 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. 18
      assets/css/index.css
  2. BIN
      assets/icon_png/profile.png
  3. 37
      index.html
  4. 400
      main.js

18
assets/css/index.css
Unescape View File

@ -2,6 +2,22 @@
text-align: center; text-align: center;
margin: auto; margin: auto;
} }
.infoUsr {
text-align: right;
padding-left: 0 !important;
padding-right: 0 !important;
}
.arrow-icon {
width: 50%;
position: relative;
top: calc(50% - 30px);
}
.ava {
position: relative;
top: calc(50% - 30px);
}
#content2 { #content2 {
padding: 0; padding: 0;
margin: 0; margin: 0;
@ -15,7 +31,7 @@
margin: 0; margin: 0;
height: 100%; height: 100%;
width: 100%; width: 100%;
min-height: 700px; min-height: 650px;
} }
.navigatorMenu { .navigatorMenu {

BIN
assets/icon_png/profile.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

37
index.html
Unescape View File

@ -41,8 +41,19 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col md-6 border"> <div class="col md-6">
<div class="row">
<div class="col-9 infoUsr">
<img class="ava" src="/assets/icon_png/profile.png" alt="">
</div>
<div class="col-2 infoUsr">
<p><h5 style="font-size: 15px;">Muhammad Choirul F</h5></p>
<p>mfajri@geonet.co.id</p>
</div>
<div class="col-1">
<img class="arrow-icon" src="/assets/icon_svg/arrow-ios-downward-svgrepo-com.svg" alt="">
</div>
</div>
</div> </div>
</div> </div>
<div class="border border-ligth mt-4 mb-4"></div> <div class="border border-ligth mt-4 mb-4"></div>
@ -75,29 +86,19 @@
<div class="card-body"> <div class="card-body">
<form> <form>
<legend>Clip & Buffer Proccess</legend> <legend>Clip & Buffer Proccess</legend>
<div class="form-group">
<label for="exampleFormControlInput1">Coordinate</label>
<input type="number" class="form-control" id="exampleFormControlInput1" placeholder="Easting">
<input type="number" class="form-control" id="exampleFormControlInput1" placeholder="Northing">
</div>
<div class="form-group"> <div class="form-group">
<label for="exampleFormControlSelect1">Radius Distance</label> <label for="exampleFormControlSelect1">Radius Distance</label>
<select class="form-control" id="exampleFormControlSelect1"> <input type="number" class="form-control" id="radiusDistance" value="100">
<option>100</option>
<option>200</option>
<option>300</option>
<option>400</option>
<option>500</option>
</select>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="exampleFormControlSelect2">Linear Unit</label> <label for="exampleFormControlSelect2">Linear Unit</label>
<select multiple class="form-control" id="exampleFormControlSelect2"> <select multiple class="form-control" id="Unit" required>
<option>Meter</option> <option value="meters">Meter</option>
<option>Kilometer</option> <option value="kilometers">Kilometer</option>
<option value="miles">Miles</option>
</select> </select>
</div> </div>
<button id="procces" type="submit" class="btn btn-ligth">Submit</button> <button id="procces" type="button" class="btn btn-ligth">Submit</button>
</form> </form>
</div> </div>
</div> </div>

400
main.js
Unescape View File

@ -6,14 +6,16 @@ $(document).ready(function () {
"esri/WebMap", "esri/WebMap",
"esri/views/MapView", "esri/views/MapView",
"esri/widgets/Home", "esri/widgets/Home",
"esri/widgets/LayerList" "esri/widgets/LayerList",
], (esriConfig, WebMap, MapView, Home, LayerList) => { "esri/layers/GraphicsLayer",
"esri/Graphic",
"esri/rest/support/LinearUnit",
"esri/rest/geoprocessor",
], (esriConfig, WebMap, MapView, Home, LayerList, GraphicsLayer, Graphic, LinearUnit, geoprocessor) => {
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/Model"; const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Buffer";
document.getElementById('procces').addEventListener('click', e => {
CLipnBuffer()
})
const webmap = new WebMap({ const webmap = new WebMap({
portalItem: { portalItem: {
id: "60994025213a4874bdb2e39503c72407" id: "60994025213a4874bdb2e39503c72407"
@ -27,6 +29,15 @@ $(document).ready(function () {
center: [106.840837, -6.294844], center: [106.840837, -6.294844],
}); });
let polylineAtt = {
Name: "Buffer Area",
Owner: "MCF"
};
const graphicsLayer = new GraphicsLayer();
let homeButton = new Home({ let homeButton = new Home({
view: view, view: view,
container: "HomeButton" container: "HomeButton"
@ -35,7 +46,7 @@ $(document).ready(function () {
let layerList = new LayerList({ let layerList = new LayerList({
view: view, view: view,
listItemCreatedFunction: (event) => { listItemCreatedFunction: (event) => {
console.log(event); // console.log(event);
const item = event.item; const item = event.item;
if (item.layer.type != "group") { if (item.layer.type != "group") {
@ -48,16 +59,383 @@ $(document).ready(function () {
} }
}); });
console.log(webmap.allLayers)
view.ui.add(layerList, { view.ui.add(layerList, {
position: "top-right" position: "top-right"
}); });
const fillSymbol = {
type: "simple-fill",
color: [168, 0, 0, 0.17],
outline: null
};
document.getElementById('procces').addEventListener('click', e => {
CLipnBuffer()
})
const CLipnBuffer = function() { const CLipnBuffer = function() {
// const params = { graphicsLayer.removeAll();
// Pipeline_Inspection: let radius = document.getElementById("radiusDistance").value;
// } let unit = document.getElementById("Unit").value;
const params = {
Pipeline_Inspection: {
"displayFieldName": "",
"geometryType": "esriGeometryPoint",
"spatialReference": {
"wkid": 4326,
"latestWkid": 4326
},
"fields": [
{
"name": "OBJECTID",
"type": "esriFieldTypeOID",
"alias": "OBJECTID"
},
{
"name": "globalid",
"type": "esriFieldTypeGlobalID",
"alias": "GlobalID",
"length": 38
},
{
"name": "easting",
"type": "esriFieldTypeDouble",
"alias": "EASTING"
},
{
"name": "northing",
"type": "esriFieldTypeDouble",
"alias": "NORTHING"
},
{
"name": "anomaly_category",
"type": "esriFieldTypeString",
"alias": "ANOMALY_CATEGORY",
"length": 255
},
{
"name": "functional_location",
"type": "esriFieldTypeString",
"alias": "FUNCTIONAL_LOCATION",
"length": 500
},
{
"name": "anomaly_name",
"type": "esriFieldTypeString",
"alias": "ANOMALY_NAME",
"length": 255
},
{
"name": "anomaly_code",
"type": "esriFieldTypeString",
"alias": "ANOMALY_CODE",
"length": 100
},
{
"name": "sap_notification",
"type": "esriFieldTypeString",
"alias": "SAP_NOTIFICATION",
"length": 255
},
{
"name": "anomaly_reff_number",
"type": "esriFieldTypeString",
"alias": "ANOMALY_REFF_NUMBER",
"length": 100
},
{
"name": "anomaly_close",
"type": "esriFieldTypeString",
"alias": "ANOMALY_CLOSE",
"length": 10
},
{
"name": "anomaly_date_created",
"type": "esriFieldTypeDate",
"alias": "ANOMALY_DATE_CREATED",
"length": 8
},
{
"name": "anomaly_created_by",
"type": "esriFieldTypeString",
"alias": "ANOMALY_CREATED_BY",
"length": 100
},
{
"name": "anomaly_desc",
"type": "esriFieldTypeString",
"alias": "ANOMALY_DESC",
"length": 255
},
{
"name": "anomaly_risk",
"type": "esriFieldTypeString",
"alias": "ANOMALY_RISK",
"length": 100
},
{
"name": "anomaly_status",
"type": "esriFieldTypeString",
"alias": "ANOMALY_STATUS",
"length": 50
},
{
"name": "anomaly_comment",
"type": "esriFieldTypeString",
"alias": "ANOMALY_COMMENT",
"length": 500
},
{
"name": "action_assign_to",
"type": "esriFieldTypeString",
"alias": "ACTION_ASSIGN_TO",
"length": 100
},
{
"name": "action_comment",
"type": "esriFieldTypeString",
"alias": "ACTION_COMMENT",
"length": 500
},
{
"name": "kp",
"type": "esriFieldTypeString",
"alias": "KP",
"length": 255
},
{
"name": "survey_date",
"type": "esriFieldTypeDate",
"alias": "SURVEY_DATE",
"length": 8
},
{
"name": "status_validated",
"type": "esriFieldTypeString",
"alias": "Status Validated",
"length": 255
},
{
"name": "created_date",
"type": "esriFieldTypeDate",
"alias": "created_date",
"length": 8
},
{
"name": "created_user",
"type": "esriFieldTypeString",
"alias": "created_user",
"length": 255
},
{
"name": "last_edited_date",
"type": "esriFieldTypeDate",
"alias": "last_edited_date",
"length": 8
},
{
"name": "last_edited_user",
"type": "esriFieldTypeString",
"alias": "last_edited_user",
"length": 255
}
],
"features": [
{
"attributes": {
"OBJECTID": 809,
"EASTING": 479156.0,
"NORTHING": 9864462.0,
"ANOMALY_CATEGORY": "Row Walking Survey",
"FUNCTIONAL_LOCATION": "HDL/CPA /OIL/TRANS/8_CPA_TO_SNP",
"ANOMALY_NAME": "Corrosion Eviden",
"ANOMALY_CODE": "RWW-CE",
"SAP_NOTIFICATION": null,
"ANOMALY_REFF_NUMBER": "RWW-CE-8",
"ANOMALY_CLOSE": "No",
"ANOMALY_DATE_CREATED": 1678161600000,
"ANOMALY_CREATED_BY": "Rascal",
"ANOMALY_DESC": "Test drive",
"ANOMALY_RISK": "1 (High) - Immediate Action",
"ANOMALY_STATUS": "Open",
"ANOMALY_COMMENT": "No comment aku",
"ACTION_ASSIGN_TO": "PO/OSF/INS/PIM",
"ACTION_COMMENT": null,
"KP": null,
"SURVEY_DATE": 1678161600000,
"STATUS_VALIDATED": "Validated",
"STATUS_REVIEW": null,
"REVIEWED_BY": null,
"GlobalID": "{0AC28FE4-B997-4B36-A96F-F72AAA38E013}"
},
"geometry": {
"x": 116.81264485400004,
"y": -1.2262399559999722
}
},
{
"attributes": {
"OBJECTID": 1609,
"EASTING": 479156.0,
"NORTHING": 9864462.0,
"ANOMALY_CATEGORY": "Row Walking Survey",
"FUNCTIONAL_LOCATION": "HDL/CPA /OIL/TRANS/8_CPA_TO_SNP",
"ANOMALY_NAME": "3rd Party Activity",
"ANOMALY_CODE": "RWW-3PA",
"SAP_NOTIFICATION": null,
"ANOMALY_REFF_NUMBER": "RWW-3PA-7",
"ANOMALY_CLOSE": "No",
"ANOMALY_DATE_CREATED": 1678161600000,
"ANOMALY_CREATED_BY": "Rascal",
"ANOMALY_DESC": "Test drive",
"ANOMALY_RISK": "2 (Medium) - Non-Standard Condition",
"ANOMALY_STATUS": "Open",
"ANOMALY_COMMENT": "No comment aku",
"ACTION_ASSIGN_TO": "PO/OSF/INS/PIM",
"ACTION_COMMENT": null,
"KP": null,
"SURVEY_DATE": 1678161600000,
"STATUS_VALIDATED": "Validated",
"STATUS_REVIEW": null,
"REVIEWED_BY": null,
"GlobalID": "{AC962425-CF81-4A62-AC94-2A322E4C0579}"
},
"geometry": {
"x": 116.81264485400004,
"y": -1.2262399559999722
}
},
{
"attributes": {
"OBJECTID": 1610,
"EASTING": 479156.0,
"NORTHING": 9864462.0,
"ANOMALY_CATEGORY": "Row Walking Survey",
"FUNCTIONAL_LOCATION": "HDL/CPA /OIL/TRANS/8_CPA_TO_SNP",
"ANOMALY_NAME": "3rd Party Activity",
"ANOMALY_CODE": "RWW-3PA",
"SAP_NOTIFICATION": null,
"ANOMALY_REFF_NUMBER": "RWW-3PA-7",
"ANOMALY_CLOSE": "No",
"ANOMALY_DATE_CREATED": 1678161600000,
"ANOMALY_CREATED_BY": "Rascal",
"ANOMALY_DESC": "Test drive",
"ANOMALY_RISK": "2 (Medium) - Non-Standard Condition",
"ANOMALY_STATUS": "Open",
"ANOMALY_COMMENT": "No comment aku",
"ACTION_ASSIGN_TO": "PO/OSF/INS/PIM",
"ACTION_COMMENT": null,
"KP": null,
"SURVEY_DATE": 1678161600000,
"STATUS_VALIDATED": "Validated",
"STATUS_REVIEW": null,
"REVIEWED_BY": null,
"GlobalID": "{016D9D44-CA20-4EA5-8DEA-B526A4A3F538}"
},
"geometry": {
"x": 116.81264485400004,
"y": -1.2262399559999722
}
},
{
"attributes": {
"OBJECTID": 3208,
"EASTING": 479156.0,
"NORTHING": 9864462.0,
"ANOMALY_CATEGORY": "Row Walking Survey",
"FUNCTIONAL_LOCATION": "HDL/CPA /OIL/TRANS/8_CPA_TO_SNP",
"ANOMALY_NAME": "Corrosion Eviden",
"ANOMALY_CODE": "RWW-CE",
"SAP_NOTIFICATION": null,
"ANOMALY_REFF_NUMBER": "RWW-CE-8",
"ANOMALY_CLOSE": "No",
"ANOMALY_DATE_CREATED": 1678161600000,
"ANOMALY_CREATED_BY": "Rascal",
"ANOMALY_DESC": "Test drive",
"ANOMALY_RISK": "1 (High) - Immediate Action",
"ANOMALY_STATUS": "Open",
"ANOMALY_COMMENT": "No comment aku",
"ACTION_ASSIGN_TO": "PO/OSF/INS/PIM",
"ACTION_COMMENT": null,
"KP": null,
"SURVEY_DATE": 1678161600000,
"STATUS_VALIDATED": "Validated",
"STATUS_REVIEW": null,
"REVIEWED_BY": null,
"GlobalID": "{49D3D5C9-B644-4868-B522-F687E6968167}"
},
"geometry": {
"x": 116.81264485400004,
"y": -1.2262399559999722
}
},
{
"attributes": {
"OBJECTID": 3608,
"EASTING": 479156.0,
"NORTHING": 9864462.0,
"ANOMALY_CATEGORY": "Row Walking Survey",
"FUNCTIONAL_LOCATION": "HDL/CPA /OIL/TRANS/8_CPA_TO_SNP",
"ANOMALY_NAME": "Marker/Sign",
"ANOMALY_CODE": "RWW-SMS",
"SAP_NOTIFICATION": null,
"ANOMALY_REFF_NUMBER": "RWW-SMS-6",
"ANOMALY_CLOSE": "No",
"ANOMALY_DATE_CREATED": 1678161600000,
"ANOMALY_CREATED_BY": "Rascal",
"ANOMALY_DESC": "Test drive",
"ANOMALY_RISK": "3 (Low) - Monitoring/Observation",
"ANOMALY_STATUS": "Open",
"ANOMALY_COMMENT": "No comment aku",
"ACTION_ASSIGN_TO": "PO/OSF/INS/PIM",
"ACTION_COMMENT": null,
"KP": "kp 123",
"SURVEY_DATE": 1659326400000,
"STATUS_VALIDATED": "Validated",
"STATUS_REVIEW": null,
"REVIEWED_BY": null,
"GlobalID": "{E12BD9BE-FFDF-4D94-A39F-A4FECD8E7717}"
},
"geometry": {
"x": 116.81264485400004,
"y": -1.2262399559999722
}
}
],
"exceededTransferLimit": false
},
Distance__value_or_field_: {
"distance": radius,
"units": unit
},
f: "pjson"
};
geoprocessor.execute(gpUrl, params).then(drawResultData);
} }
const drawResultData = function (result) {
const resultFeatures = result.results[0].value.features;
const viewshedGraphics = resultFeatures.map((feature) => {
feature.symbol = fillSymbol;
console.log(feature);
return feature;
});
graphicsLayer.addMany(viewshedGraphics);
webmap.add(graphicsLayer);
view.goTo({
target: viewshedGraphics,
tilt: 0
})
.catch((error) => {
if (error.name != "AbortError") {
console.error(error);
}
});
}
}); });

Write Preview
Loading…
Cancel
Save