দ্রুত রেন্ডারিং ও প্রক্রিয়াকরণের জন্য বিনামূল্যে জাভাস্ক্রিপ্ট স্প্রেডশীট উপাদান
ওপেন সোর্স ফ্রি জাভাস্ক্রিপ্ট স্প্রেডশীট কম্পোনেন্ট দ্রুত রেন্ডারিং, সারি পরিচালনা, কলাম অটোসাইজিং, সেল হ্যান্ডলিং এবং আরও অনেক কিছুর অনুমতি দেয়।
একটি খুব দ্রুত সম্পূর্ণ ওপেন সোর্স জাভাস্ক্রিপ্ট গ্রিড/স্প্রেডশীট উপাদান সফ্টওয়্যার বিকাশকারীদের কাস্টম নিয়ন্ত্রণ এবং প্রদর্শন সহ সমৃদ্ধ গ্রিড তৈরি করতে সক্ষম করে। কম্পোনেন্টটি ভার্চুয়াল রেন্ডারিং সমর্থন করে যা ব্যবহারকারীদের পারফরম্যান্সে কোনো হ্রাস ছাড়াই কয়েক হাজার আইটেমের সাথে কাজ করার ক্ষমতা দেয়। যার অর্থ SlickGrid পারফরম্যান্সের সাথে আপোস না করে 100 সারি বা 100 হাজার সারি সহ একটি গ্রিড পরিচালনা করতে সক্ষম। পূর্বে এটি jQuery UI থিম সমর্থন করত কিন্তু SlickGrid 3.0.0 থেকে, দলটি সমস্ত সম্পর্কিত কোড সরিয়ে দিয়েছে এবং এটিকে আরও আধুনিক SortableJS দিয়ে প্রতিস্থাপন করেছে।
SlickGrid উপাদান সম্পূর্ণরূপে কাস্টমাইজযোগ্য এবং অত্যন্ত দ্রুত রেন্ডারিং গতি প্রদান করে। কম্পোনেন্টটিতে স্প্রেডশীট পরিচালনার জন্য বেশ কিছু গুরুত্বপূর্ণ বৈশিষ্ট্য অন্তর্ভুক্ত করা হয়েছে, যেমন রেন্ডারিং স্প্রেডশীট, সমৃদ্ধ কক্ষের জন্য ব্যাকগ্রাউন্ড পোস্ট-রেন্ডারিং, কীবোর্ড নেভিগেশন, কলামের আকার পরিবর্তন করা, কলাম পুনরায় সাজানো, কলাম বা সারি দেখানো/লুকানো, নতুন সারি সন্নিবেশ করা, নতুন সারি সম্পাদনা, বহু- পূর্বাবস্থায় ফেরানো/পুনরায় করা সমর্থন সহ ক্ষেত্র সম্পাদক, বিন্যাস এবং শৈলী যোগ করা ইত্যাদি। এটি ডেটা-কেন্দ্রিক ফ্রেমওয়ার্ক এবং বুটস্ট্র্যাপের সাথে সামঞ্জস্যপূর্ণ
SlickGrid দিয়ে শুরু করা
SlickGrid ইনস্টল করার প্রস্তাবিত উপায়, npm ব্যবহার করা হচ্ছে, SlickGrid ইনস্টল করতে, ব্রাউজারে শুধুমাত্র নিম্নলিখিত স্ক্রিপ্ট ট্যাগ যোগ করুন।
npm-এর মাধ্যমে SlickGrid ইনস্টল করুন
npm install slickgrid আপনি GitHub রিপোজিটরি থেকে কম্পাইল করা শেয়ার্ড লাইব্রেরি ডাউনলোড করতে পারেন এবং এটি ইনস্টল করতে পারেন৷
কিভাবে জাভাস্ক্রিপ্ট API ব্যবহার করে সেল একত্রিত করবেন?
একটি স্প্রেডশীটের ভিতরে কোষগুলিকে একত্রিত করা একটি খুব দরকারী বৈশিষ্ট্য যা প্রায়শই বিভিন্ন সারি বা কলাম জুড়ে পাঠ্য কেন্দ্রে ব্যবহৃত হয় এবং দুই বা ততোধিক কক্ষের ডেটা স্ট্রিংগুলিকে একত্রিত করতে সহায়ক হতে পারে। এর মূল উদ্দেশ্য হল ডেটা উপস্থাপনযোগ্য এবং শেষ ব্যবহারকারীর জন্য পাঠযোগ্য করে তোলা। ওপেন সোর্স স্লিকগ্রিড জাভাস্ক্রিপ্ট কম্পোনেন্ট সফটওয়্যার ডেভেলপারদের তাদের নিজস্ব জাভাস্ক্রিপ্ট অ্যাপ্লিকেশনের মধ্যে একাধিক সেল, সারি বা কলাম একত্রিত করতে দেয়।
জাভাস্ক্রিপ্ট API এর মাধ্যমে স্প্রেডশীট সেল একত্রিত হচ্ছে
function VerCellMergedFormatter(row, cell, value, columnDef, dataContext) {
var options = window._renderOptions;
if (options.lastRendering != 1) {
return;
}
var items = window.getRenderDataItmes();
var fieldName = columnDef.field;
var rowsLength = items.length;
var currentItem = items[row];
var nextRowIndex = row + 1;
if (nextRowIndex < rowsLength){
var nextValue = items[nextRowIndex][fieldName];
if (value == nextValue) {
if (!options.changedCells[row]) {
options.changedCells[row] = {};
}
options.changedCells[row][fieldName] = "noneline-bottom";
options.isNextMerged = 1;
return value;
}
else {
if (options.isNextMerged == 1) {
options.isNextMerged = 0;
return;
}
}
}
return value;
}
JS এর মাধ্যমে স্প্রেডশীট কলাম, সারি এবং কক্ষ সম্পাদনা করুন
SlickGrid উপাদানটি সফ্টওয়্যার বিকাশকারীদের তাদের জাভাস্ক্রিপ্ট অ্যাপ্লিকেশনগুলির মধ্যে বিভিন্ন উপায়ে স্প্রেডশীট কোষগুলি পরিচালনা করতে সক্ষম করে। লাইব্রেরি স্প্রেডশীট সেল, কলাম এবং সারিগুলি পরিচালনা করার জন্য বেশ কয়েকটি গুরুত্বপূর্ণ বৈশিষ্ট্য সরবরাহ করেছে যেমন, নতুন কোষ সন্নিবেশ করানো, বিদ্যমান কোষগুলি সম্পাদনা করা, অবাঞ্ছিত কোষগুলি মুছে ফেলা। এটি জাভাস্ক্রিপ্ট কমান্ড ব্যবহার করে কলাম এবং সারিগুলিকে স্বয়ংক্রিয় আকার দেওয়ার জন্য, আকার পরিবর্তন করা, পুনরায় সাজানো, প্রদর্শন এবং লুকানোর জন্য সমর্থন প্রদান করেছে।
JavaScript API-এর মাধ্যমে নতুন সারি যোগ করুন এবং সেল সম্পাদনা করতে ক্লিক করুন
var d = $scope.$grid.grid.getData();
$scope.$grid.grid.invalidateRow(d.length);
//Adds the new row as the first row.
d.unshift(item);
$scope.$grid.grid.updateRowCount();
$scope.$grid.grid.setData(d);
$scope.selectedRows = [];
$scope.selectedRows = [0];
//Sets the first row and first column as editable by clicking on it
$scope.$grid.grid.setActiveCell($scope.selectedRows,0);
//$scope.$grid.grid.gotoCell(0,0,true);
var grid = $scope.$grid.grid;
var row = $scope.selectedRows[0];
var col = 0;
grid.setActiveCell(row, col);
grid.editActiveCell(Slick.Acsiom.Editors.Text);
জাভাস্ক্রিপ্ট API এর মাধ্যমে স্বয়ংক্রিয় কলামের সাইজিং
ওপেন সোর্স স্লিকগ্রিড কম্পোনেন্ট জাভাস্ক্রিপ্ট অ্যাপ্লিকেশনের মধ্যে অটো-কলাম সাইজিং প্রয়োগ করার জন্য একটি খুব দরকারী বৈশিষ্ট্য প্রদান করেছে। এটি একটি কলাম স্বয়ংক্রিয়করণ API প্রদান করে যা গ্রিডকে শিরোনাম এবং সারির ঘরের বিষয়বস্তুর উপর ভিত্তি করে তার কলামের প্রস্থ সম্পর্কে বুদ্ধিমান নির্বাচন করতে সক্ষম করে। অনুগ্রহ করে মনে রাখবেন যে অটোসাইজ করার জন্য ডেটা অবশ্যই সরবরাহ করতে হবে এবং আকার পরীক্ষা করার জন্য অবশ্যই ডেটা উপস্থিত থাকতে হবে কারণ কোনও ডেটা ছাড়াই একটি স্বয়ংক্রিয় সাইজিং অ্যালগরিদমের পক্ষে কাজ করা খুব কঠিন।
