From f54ab8452bceb78b76e6b4b61a61becae633c506 Mon Sep 17 00:00:00 2001 From: mfajri Date: Thu, 8 Aug 2024 16:33:46 +0700 Subject: [PATCH] header fix & buffer proccess --- assets/css/index.css | 18 +- assets/icon_png/profile.png | Bin 0 -> 3692 bytes index.html | 37 ++-- main.js | 400 +++++++++++++++++++++++++++++++++++- 4 files changed, 425 insertions(+), 30 deletions(-) create mode 100644 assets/icon_png/profile.png diff --git a/assets/css/index.css b/assets/css/index.css index cde56a8d..bc285ab5 100644 --- a/assets/css/index.css +++ b/assets/css/index.css @@ -2,6 +2,22 @@ text-align: center; 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 { padding: 0; margin: 0; @@ -15,7 +31,7 @@ margin: 0; height: 100%; width: 100%; - min-height: 700px; + min-height: 650px; } .navigatorMenu { diff --git a/assets/icon_png/profile.png b/assets/icon_png/profile.png new file mode 100644 index 0000000000000000000000000000000000000000..e1794a5b6dacaa545ece3ef4d4e035a76c4e8ba4 GIT binary patch literal 3692 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 KMNUMnLSTXxf*jcZ literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 0f2acc56..9dabcec3 100644 --- a/index.html +++ b/index.html @@ -41,8 +41,19 @@ -
- +
+
+
+ +
+
+

Muhammad Choirul F

+

mfajri@geonet.co.id

+
+
+ +
+
@@ -75,29 +86,19 @@
Clip & Buffer Proccess -
- - - -
- +
- + + +
- +
diff --git a/main.js b/main.js index b834d240..f3da53c5 100644 --- a/main.js +++ b/main.js @@ -6,14 +6,16 @@ $(document).ready(function () { "esri/WebMap", "esri/views/MapView", "esri/widgets/Home", - "esri/widgets/LayerList" - ], (esriConfig, WebMap, MapView, Home, LayerList) => { + "esri/widgets/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"; - const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Model"; - document.getElementById('procces').addEventListener('click', e => { - CLipnBuffer() - }) + const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Buffer"; + const webmap = new WebMap({ portalItem: { id: "60994025213a4874bdb2e39503c72407" @@ -27,6 +29,15 @@ $(document).ready(function () { center: [106.840837, -6.294844], }); + let polylineAtt = { + Name: "Buffer Area", + Owner: "MCF" + }; + + + const graphicsLayer = new GraphicsLayer(); + + let homeButton = new Home({ view: view, container: "HomeButton" @@ -35,7 +46,7 @@ $(document).ready(function () { let layerList = new LayerList({ view: view, listItemCreatedFunction: (event) => { - console.log(event); + // console.log(event); const item = event.item; if (item.layer.type != "group") { @@ -48,16 +59,383 @@ $(document).ready(function () { } }); - console.log(webmap.allLayers) view.ui.add(layerList, { 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 params = { - // Pipeline_Inspection: - // } + graphicsLayer.removeAll(); + 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); + } + }); + } + });