ویجت TimeSlider

ویجت TimeSlider-موسسه چشم انداز هزاره سوم ملل-آموزش کاربردی GIS و RS

این ویجت، اطلاعات زمانی لایه را تصویرسازی می‌کند. در نمودار زمانی موجود در پایین تصویر زیر یک بازه با فلش قرمز مشخص شده است که دارای یک زمان ابتدا و یک زمان انتها است. به هر کدام از نقاط زمانی یک thumb گفته می‌شود. این ویجت با دو thumb پیکربندی می‌شود. این ویجت برای داده‌هایی که دو نقطه‌ی زمانی ابتدا و انتها دارند، استفاده می‌شود. متد setThumbIndexes() مکان اولیه‌ی هر thumb را تعیین می‌کند. در تصویر زیر، یک thumb در زمان شروع اولیه اضافه می‌شود و thumb بعدی در گام زمانی بالاتر قرار داده می‌شود.

var timeSlider = new TimeSlider({
style: “width: 100%;”
}, dom.byId(“timeSliderDiv”));
map.setTimeSlider(timeSlider);
var timeExtent = new TimeExtent();
timeExtent.startTime = new Date(“1/1/1921 UTC”);
timeExtent.endTime = new Date(“12/31/2009 UTC”);
timeSlider.setThumbCount(2);
timeSlider.createTimeStopsByTimeInterval(timeExtent, 2,”esriTimeUnitsYears”);
timeSlider.setThumbIndexes([0,1]);
timeSlider.setThumbMovingRate(2000);
timeSlider.startup

در قطعه کد بالا یک نمونه از ویجت TimeSlider ایجاد شده و ویژگی‌های مختلفی مانند زمان شروع و پایان تنظیم می‌شود.

ویجت LayerSwipe

این ویجت، قسمتی از یک یا چند لایه را در بالای نقشه نمایش می‌دهد و بدین ترتیب می‌توانید بین چند لایه مقایسه انجام دهید. این ویجت محتویات لایه یا لایه‌ها را نمایش می‌دهد و چند مد نمایشی دارد: 1- افقی 2- عمودی 3- Scope

در قطعه کد زیر یک نمونه از ویجت LayerSwipe ایجاد می‌شود و به نقشه اضافه می‌شود.

Var swipeWidget = new LayerSwipe({
type: “vertical”,
map: map,
layers: [swipeLayer]
}, “swipeDiv”);
swipeWidget.startup();

ویجت Analysis

تعدادی ویجت Analysis جدید در نسخه‌ی 7.3 API قرار داده شده است. در جعبه ابزار ماژول arcmap یک مجموعه ابزار spatial Analysis قرار دارد. این ویجت برای دسترسی به سرویس Arc GIS spatial Analysis می‌باشد. با این ویجت می‌توانید تحلیل‌های مکانی رایج را بر روی داده‌ها با استفاده از API انجام دهید.

ویجت LayerSwipe قسمتی از ویجت SummarizeNearby است که یکی از 13 ویجت Analysis است.

ویجت analysis شامل 13 ویجت زیر است.

AnalysisBase
AggregatePoints
CreateBuffers
CreateDriveTimeAreas
DissolveBoundaries

EnrichLayer
ExtractData

FindHotSpots
FindNearest
MergeLayers
OverlayLayers
SummarizeNearby
SummarizeWithin

ویرایش عارضه

داده‌ی ذخیره شده در ژئودیتابیس Enterprise به سادگی قابل ویرایش است. داده‌ها باید در یک ژئودیتابیس Enterprise با مدیریت Arc SDE ذخیره شوند تا بتوان پس از ویرایش و تغییرات، آن‌ها را ذخیره کرد. ویرایش روی مفهوم ” آخری، برنده است ” استوار است. مثلاً اگر دو نفر یک عارضه را ویرایش کنند. سپس تغییرات را ثبت کنند، آخرین ویرایشگری که تغییرات را ثبت کرده است، برنده خواهد بود و تغییرات وی بر روی تغییراتی که قبلاً بر روی عارضه انجام شده است، بازنویسی می‌شود و در نهایت عارضه با تغییرات ویرایشگر برنده ثبت می‌شود. بدیهی است که این مسأله مشکل ساز خواهد بود؛ بنابراین قبل از اجرای تغییرات روی داده‌ها، باید اثر و نتیجه‌ی تغییرات خود را بررسی کنید.

پشتیبانی از دامنه­ ها، ویرایش طرح بندی، ویرایش جداول و ضمائم از دیگر قابلیت‌های ویرایش در ژئودیتابیس enterprise می‌باشند. برای استفاده از این قابلیت‌های ویرایشی باید از FeatureService و FeatureLayer استفاده کرد. وقتی می‌خواهیم عوارض را ویرایش کنیم، تقاضای ویرایش توسط درخواست HTTP به سرور فرستاده می‌شوند و در سرور ثبت می‌شوند که در اکثر موارد، استفاده از پروکسی لازم است. تغییراتی مانند ویرایش عارضه، ایجاد و حذف عارضه، انتقال عارضه، move، Union و تغییر شکل عارضه قابل انجام هستند. ویرایش اطلاعات توصیفی (فیلدها) عارضه، ویرایش اسناد و ضمائم عارضه و اضافه کردن توضیحات به عوارض نیز قابل انجام است.

Feature service

برای ویرایش عارضه تحت وب، باید از این سرویس استفاده کرد. سرویس feature، نمادگذاری و geometery داده‌ها را فراهم می‌کند. برای فعال سازی این سرویس از پنجره‌ی Arc Gis Server Manager تیک گزینه‌ی feature access را بزنید. این سرویس یک سرویس map است که قابلیت ویرایش عوارض را نیز دارد. با این سرویس، هندسه‌ی عوارض (geometery) و نماد گذاری عوارض به راحتی قابل انجام است. قبل از ایجاد یک وب اپلیکیشن ویرایشی، مواردی از قبیل تنظیم و برپایی سند نقشه‌ای با پسوند (.mxd) و هم چنین تعیین الگوهای ویرایشی را باید انجام دهید. با استفاده از الگو، نمادگذاری و فیلدهای عوارض پر استفاده را پیکربندی می‌کنید. مثلاً در فرآیند آماده سازی ویرایش، ممکن است برای رودخانه‌های اصلی، فرعی، انشعابات و مسیل‌ها الگوی خاصی را تعیین کرده باشید. این الگو می‌تواند شامل رنگ، اسم، نماد و… باشد که اعمال الگو کاملاً اختیاری است. ولی با استفاده از الگو، کاربر اپلیکیشن براحتی می‌تواند تغییرات را بر روی عارضه‌های مورد نظرش انجام دهد و حکم راهنما برای کاربر هستند.

در ابتدا لایه‌های ویرایشی مورد نظرتان را درون یک ژئودیتابیس enterprise به نقشه اضافه کنید و فایل نقشه‌ی خود را ذخیره کنید. در اینجا ما از ماژول arc map برای آماده سازی و ذخیره‌ی فایل نقشه‌ای خود استفاده کردیم و در نهایت فایل نقشه‌ای را با پسوند.mxd ذخیره کردیم. سپس فایل را به صورت سرویس نقشه‌ای با قابلیت Feature Access منتشر کنید. وقتی قابلیت Feature Access را اعمال می‌کنیم، یک REST URL برای سرویس نقشه­ای و یک REST URL برای feature service ایجاد می‌شود؛ و در اپلیکیشن از این URL‌ها برای ارجاع به این سرویس‌ها استفاده می‌کنیم.

Feature service در Arc Gis javascript API با استفاده از شی FeatureLayer در دسترس و قابل استفاده است. در بخش قبل از این شی استفاده کرده‌ایم.

لایه‌ی Feature را می‌توان به سرویس map و سرویس feature ارجاع داد؛ بنابراین وقتی از این لایه برای تغییرات خود استفاده می‌کنیم، باید به سرویس feature ارجاع دهیم.

اپلیکیشن مجهز به توابع ویرایشی، به لایه‌ی feature می‌گوید که فیلدها تغییر خواهند کرد و ممکن است شکل عوارض نیز تغییر کند (geometery). شی لایه‌‌ی feature عوارض را پس از اعمال تغییرات و به روزرسانی، نمایش می‌دهد. برای اعمال تغییرات، از متد applyEdits() روی شی لایه‌‌ی feature استفاده می‌کنیم. سپس این تغییرات به ژئودیتابیس وارد می‌شوند.

ویجت‌های ویرایشی

با استفاده از این ویجت‌ها، می‌توانید ابزارهای ویرایشی را به اپلیکیشن اضافه کنید. این ویجت‌ها شامل Editor، TemplatePicker، AttributeInspector و AttachmentEditor هستند. ویجت editor ویجت پیش فرض ویرایشی است و شامل ابزارهایی برای ویرایش لایه است و می‌توانید تعداد و نوع ابزار مورد نیازتان را تعیین کنید. TemplatePicker الگویی برای نمادگذاری لایه‌های موجود در فایل نقشه‌ای شما (.mxd) است.

ویجت AttributeInspector رابطی را برای ویرایش فیلدها فراهم می‌کند و درستی و صحت داده‌های ورودی را با توجه به نوع فیلد تضمین می‌کند. ویجت AttachmentEditor یک فایل قابل دانلود را به عارضه پیوست می‌کند. هر کدام از این ویجت‌ها را با توضیحات بیشتری در ادامه آورده ایم.

ویجت editor

همانطور که در تصویر زیر می‌بینید این ویجت یک رابط ویرایشی پیش فرض را فراهم می‌کند که تعداد و نوع ابزارهای این رابط قابل تنظیم است. این ویجت بلافاصله تغییرات شما را ذخیره می‌کند. مثلاً وقتی یک نقطه رسم می‌کنید، بلافاصله این ترسیم ذخیره خواهد شد. اگر قصد استفاده از این ویجت را ندارید، باید زمان و نحوه‌‌ی اعمال و ذخیره‌ی تغییرات را مشخص کنید.

در کد زیر یک شی editor با فرستادن شی params به سازنده ایجاد می‌شود. در کد زیر فقط ابزارهای مورد نیاز عبارتند از نقشه، لایه‌های مورد نظر جهت ویرایش و URL ای که برای ارجاع به سرویس geometry است، تعیین شده­اند.

var settings = {
map: map,
geometryService: new GeometryService(“http://servicesbeta.esri.com/
arcgis/rest/services/Geometry/GeometryServer”),
layerInfos:featureLayerInfos
};
var params = {settings: settings};
var editorWidget = new Editor(params);
editorWidget.startup();

بهتر است برای اپلیکیشن‌های ویرایشی از ویجت Editor استفاده کنید. با این ویجت اجازه‌ی انجام عملیات زیر را دارید.

جهت استفاده از این ویجت درون کد، باید آن را با dojo.require بارگذاری کنید. پارامترهای مورد نیاز برای ایجاد شی Edito، ارجاع به شی map و سرویس geometry می‌باشد.

ویجت TemplatePicker

این ویجت مجموعه عوارض از قبل پیکربندی شده را برای کاربر نمایش می‌دهد و هر عارضه‌ی لایه را نمادگذاری می‌کند. با کلیک بر روی نماد و سپس کلیک بر روی نقشه، عارضه‌ی مورد نظر با آن نماد بر روی نقشه ایجاد می‌شود. نمادهای نشان داده شده در این ویجت همان نمادهایی هستند که قبلاً در سرویس feature نقشه‌ی اصلی تعیین کردید. هم چنین می‌توانند از نمادهایی که در اپلیکیشن تعیین کرده­ اید، تغذیه شوند. ویجت TemplatePicker می‌تواند از یک legend ساده استفاده کند.

به قطعه کد زیر دقت کنید.

function initEditing(results) {
var templateLayers = dojo.map(results,function(result){
return result.layer;
});
var templatePicker = new TemplatePicker({
featureLayers: templateLayers,
grouping: false,
rows: ‘auto’,
columns: 3
},’editorDiv’);
templatePicker.startup();
var layerInfos = dojo.map(results, function(result) {
return {‘featureLayer’:result.layer};
});
var settings = {
map: map,
templatePicker: templatePicker,
layerInfos:layerInfos
};
var params = {settings: settings};
var editorWidget = new Editor(params);
editorWidget.startup();
}

در کد بالا ابتدا یک شی TemplatePicker ایجاد و به ویجت Editor ضمیمه می‌شود.

ویجت AttributeInspector

این ویجت برای ویرایش اطلاعات توصیفی یک لایه تحت وب، رابطی را فراهم می‌کند. این ویجت صحت داده‌های ورودی را بر اساس نوع داده تضمین می‌کند. اگر دامنه‌ای از مقادیر به یک فیلد اعمال می‌شود، مقادیر مجاز در قالب یک لیست کشویی نمایش داده می‌شود و ورود مقادیر دیگر غیر از مقادیر موجود در لیست، محدود و غیر ممکن می‌شود. اگر یک فیلد شامل داده‌ای از نوع تاریخ/ زمان است، یک تقویم ظاهر می‌شود تا کاربر داده‌های صیحی وارد فیلد کند.

ویجت AttributeInspector فیلدهای قابل ویرایش را در یک لایه نمایش می‌دهد. اگر بخواهید فیلدها را محدود کنید، باید رابط کاربری را برای ورود و صحت ورود داده، کدنویسی کنید.

var layerInfos = [{
‘featureLayer’: petroFieldsFL,
‘showAttachments’: false,
‘isEditable’: true,
‘fieldInfos’: [
{‘fieldName’: ‘activeprod’, ‘isEditable’:true, ‘tooltip’: ‘Current
Status’, ‘label’:’Status:’},
{‘fieldName’: ‘field_name’, ‘isEditable’:true, ‘tooltip’: ‘The name
of this oil field’, ‘label’:’Field Name:’},
{‘fieldName’: ‘approxacre’, ‘isEditable’:false,’label’:’Acreage:’},
{‘fieldName’: ‘avgdepth’, ‘isEditable’:false,
‘label’:’Average Depth:’},
{‘fieldName’: ‘cumm_oil’, ‘isEditable’:false,
‘label’:’Cummulative Oil:’},
{‘fieldName’: ‘cumm_gas’, ‘isEditable’:false,
‘label’:’Cummulative Gas:’}
]

}];
var attInspector = new AttributeInspector({
layerInfos:layerInfos
}, domConstruct.create(“div”));
//add a save button next to the delete button
var saveButton = new Button({ label: “Save”, “class”:
“saveButton”});
domConstruct.place(saveButton.domNode,
attInspector.deleteBtn.domNode, “after”);
saveButton.on(“click”, function(){
updateFeature.getLayer().applyEdits(null, [updateFeature], null);
});
attInspector.on(“attribute-change”, function(evt) {
//store the updates to apply when the save button is clicked
updateFeature.attributes[evt.fieldName] = evt.fieldValue;
});
attInspector.on(“next”, function(evt) {
updateFeature = evt.feature;
console.log(“Next ” + updateFeature.attributes.objectid);
});
attInspector.on(“delete”, function(evt){
evt.feature.getLayer().applyEdits(null,null,[feature]);
map.infoWindow.hide();
});

map.infoWindow.setContent(attInspector.domNode);
map.infoWindow.resize(350, 240);

در قطعه کد بالا یک نمونه از ویجت AttributeInspector ایجاد شده و رویداد‌های change ، next و delete برای اعمال تغییر در فیلدها صدا زده می‌شوند.

ویجت AttachmentEditor

در بعضی موارد نیاز است که یک فایل قابل دانلود را به یک عارضه ضمیمه کنید. مثلاً کاربر با کلیک بر روی یک عارضه، یک لینک را ببیند و اگر مایل بود با کلیک بر روی لینک، تصویری را دانلود و آن را ببیند. ویجت AttachmentEditor برای آپلود و نمایش ضمائم عوارض به کار می‌رود. این ویجت شامل لیستی از ضمائم همراه با یک دکمه‌ی Remove است. هم چنین یک دکمه‌ی Browse برای آپلود ضمائم بیشتر تعبیه شده است. این ویجت در یک پنجره‌ی پاپ‌اپ نیز قرار گرفته و نمایش داده می‌شود. البته می‌تواند در هر جایی از صفحه قرار گیرد.

جهت استفاده از ضمائم عارضه، ضمائم باید بر روی کلاس عارضه فعال شده باشند. می‌توانید در ماژول Arc Catalog و یا درخت catalog موجود در ماژول arc map ضمائم را فعال کنید. بدین صورت که ضمائم را در پوشه‌ی داده‌هایتان قرار دهید. همان پوشه‌ای که حاوی لایه‌ها، فایل.mxd و دیگر داده‌های فایل نقشه‌ای تان است.

var map;
require([
“esri/map”,
“esri/layers/FeatureLayer”,
“esri/dijit/editing/AttachmentEditor”,
“esri/config”,
“dojo/parser”, “dojo/dom”,
“dijit/layout/BorderContainer”, “dijit/layout/ContentPane”,
“dojo/domReady!”
], function(
Map, FeatureLayer, AttachmentEditor, esriConfig,
parser, dom
) {
parser.parse();
// a proxy page is required to upload attachments
// refer to “Using the Proxy Page” for more information:
https://developers.arcgis.com/en/javascript/jshelp/ags_proxy.html
esriConfig.defaults.io.proxyUrl = “/proxy”;

map = new Map(“map”, {
basemap: “streets”,
center: [-122.427, 37.769],
zoom: 17
});
map.on(“load”, mapLoaded);
function mapLoaded() {
var featureLayer = new FeatureLayer(“http://sampleserver3.
arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/
FeatureServer/0”,{
mode: FeatureLayer.MODE_ONDEMAND
});
map.infoWindow.setContent(“<div id=’content’
style=’width:100%’></div>”);
map.infoWindow.resize(350,200);
var attachmentEditor = new AttachmentEditor({}, dom.byId(“content”));
attachmentEditor.startup();
featureLayer.on(“click”, function(evt) {
var objectId = evt.graphic.attributes[featureLayer.
objectIdField];
map.infoWindow.setTitle(objectId);
attachmentEditor.showAttachments(evt.graphic,featureLayer);
map.infoWindow.show(evt.screenPoint, map.
getInfoWindowAnchor(evt.screenPoint));
});
map.addLayer(featureLayer);
}
});

قطعه کد بالا یک نمونه از ویجت AttachmentEditor ایجاد و به اپلیکیشن اضافه می‌کند.

 نوارابزار Edit

نوار ابزار Edit یک کلاس جاوااسکریپتی کمکی است که قسمتی از API است. این نوار ابزار شبیه نوارابزار‌های Draw و Navigation است.

برگرفته از کتاب تولید و طراحی اپلیکیشن‌ های Web GIS و Mobile GIS با استفاده از ArcGIS API for JavaScript

نویسنده: دکتر محمد بافقی زاده

نشر: انتشارات اکادمیک