LeafletJS হল একটি শক্তিশালী এবং জনপ্রিয় জাভাস্ক্রিপ্ট লাইব্রেরি যা ম্যাপিং অ্যাপ্লিকেশন তৈরির জন্য ব্যবহৃত হয়। সাধারণত, LeafletJS তে ওয়েব ম্যাপের জন্য tile layers ব্যবহার করা হয়, যেমন OpenStreetMap অথবা Mapbox। তবে, অনেক সময় ইন্টারনেট সংযোগ না থাকার কারণে Offline Tiles ব্যবহারের প্রয়োজন হতে পারে।
Offline Tiles ব্যবহার করে আপনি ইন্টারনেট ছাড়াই ম্যাপ ব্যবহার করতে পারবেন। এটি মোবাইল অ্যাপ্লিকেশন বা কোনো নির্দিষ্ট স্থান বা অঞ্চলের ম্যাপ ব্যবহার করতে খুবই উপকারী।
এই টিউটোরিয়ালে, আমরা দেখবো কিভাবে Offline Tiles ব্যবহার করে একটি ম্যাপ তৈরি করা যায়।
১. Offline Tile প্রস্তুতি
Offline Tiles এর জন্য প্রথমে আপনাকে ম্যাপের টাইল ডাউনলোড করতে হবে। TMS (Tile Map Service) অথবা XYZ (Tileset) ফরম্যাটে টাইল ফাইলগুলো ডাউনলোড করতে হবে। আপনি Mobile Atlas Creator (MOBAC), TileMill, বা QGIS এর মতো টুল ব্যবহার করে আপনার পছন্দের অঞ্চলের টাইল ডাউনলোড করতে পারেন।
সাধারণত ব্যবহার হওয়া টাইল ফরম্যাট:
- XYZ Tile:
- URL ফরম্যাট:
https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png - যেখানে
{z}হলো জুম লেভেল,{x}হলো টাইলের X কোঅর্ডিনেট, এবং{y}হলো Y কোঅর্ডিনেট।
- URL ফরম্যাট:
- TMS Tile:
- URL ফরম্যাট:
file:///path/to/your/tiles/{z}/{x}/{y}.png - এখানে
{z},{x},{y}টাইলের অবস্থান নির্দেশ করে।
- URL ফরম্যাট:
২. Offline Tile ব্যবহার করে Leaflet ম্যাপ তৈরি করা
একবার টাইল ডাউনলোড হলে, আপনি সহজেই এই টাইলগুলো LeafletJS ম্যাপে লোড করতে পারেন। প্রথমে, ম্যাপের জন্য tileLayer সেটআপ করতে হবে এবং local tile server ব্যবহার করতে হবে।
২.১ Offline Tiles লোড করার উদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Offline Tiles with LeafletJS</title>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="height: 600px;"></div>
<script>
// ম্যাপ তৈরি করা
var map = L.map('map', {
center: [51.505, -0.09], // ম্যাপের কেন্দ্র
zoom: 13 // জুম লেভেল
});
// Offline টাইল লেয়ার যোগ করা (Local Tile server)
L.tileLayer('file:///path/to/your/offline-tiles/{z}/{x}/{y}.png', {
maxZoom: 18, // সর্বোচ্চ জুম লেভেল
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
</script>
</body>
</html>
ব্যাখ্যা:
- L.tileLayer(): এখানে আমরা file:///path/to/your/offline-tiles/{z}/{x}/{y}.png ব্যবহার করছি। এখানে
{z},{x}, এবং{y}টাইলের অবস্থান নির্ধারণ করবে। - আপনি যদি local server ব্যবহার করেন, তবে আপনাকে অবশ্যই local server (যেমন http-server বা XAMPP) চালু করতে হবে।
৩. Local Tile Server ব্যবহার করে Offline Tiles
ইন্টারনেটে কনেকশন না থাকার সময়ে ম্যাপ ব্যবহারের জন্য, local tile server ব্যবহার করা হয়। Local tile server ম্যাপের টাইল ফাইলগুলোকে একটি ওয়েব সার্ভিসের মতো কাজ করতে সক্ষম করে, যাতে আপনি আপনার ডিভাইসে টাইল ডাউনলোড করে সেগুলোকে ম্যাপে ব্যবহার করতে পারেন।
৩.১ Local Tile Server সেটআপ
আপনি http-server বা XAMPP ব্যবহার করে একটি local server চালু করতে পারেন।
http-server ব্যবহার করে Local Server চালানো:
- Node.js ইনস্টল করুন।
http-server ইনস্টল করতে টাইপ করুন:
npm install -g http-serverআপনার টাইল ফাইলগুলো যে ডিরেক্টরিতে আছে সেখানে যান এবং http-server চালু করুন:
http-server ./path/to/your/tiles- সার্ভার চালু হলে, আপনি
http://localhost:8080এ আপনার টাইলগুলো অ্যাক্সেস করতে পারবেন।
XAMPP ব্যবহার করে Local Server চালানো:
- XAMPP ইনস্টল করুন।
- htdocs ফোল্ডারে আপনার টাইল ফাইলগুলো রাখুন।
- XAMPP চালু করে Apache Server চালু করুন।
- আপনার ব্রাউজারে
http://localhost/your-tiles-folderথেকে টাইল লোড করুন।
৪. Tilemill এবং QGIS ব্যবহার করে Offline Tiles তৈরি করা
৪.১ TileMill ব্যবহার করে Tile তৈরি করা
TileMill একটি ওপেন সোর্স সফটওয়্যার যা আপনাকে কাস্টম tiles তৈরি করতে সহায়তা করে। আপনি একটি ম্যাপ ডিজাইন করতে পারেন এবং তারপর টাইল ফাইল হিসেবে PNG বা MBTiles আউটপুট পেতে পারেন।
- TileMill সফটওয়্যার ডাউনলোড করুন।
- আপনার কাস্টম ম্যাপ ডিজাইন করুন এবং টাইল লেয়ার আউটপুট করুন।
৪.২ QGIS ব্যবহার করে Tile তৈরি করা
QGIS হলো একটি ওপেন সোর্স জিওস্পেশাল ডেটা সফটওয়্যার, যা ম্যাপ টাইল তৈরি করতে সহায়তা করে।
- QGIS ইন্সটল করুন।
- ম্যাপের জন্য টাইল তৈরি করুন এবং MBTiles ফরম্যাটে সংরক্ষণ করুন।
সারাংশ
LeafletJS এর মাধ্যমে আপনি Offline Tiles ব্যবহার করে ম্যাপ তৈরি করতে পারেন এবং সেগুলো ইন্টারনেট ছাড়াই ব্যবহার করতে পারেন। আপনি Local Tile Servers ব্যবহার করে টাইল ফাইলগুলি লোড করতে পারেন এবং TileMill অথবা QGIS ব্যবহার করে টাইল তৈরি করতে পারেন। Offline Tiles ব্যবহারের মাধ্যমে আপনি নির্দিষ্ট অঞ্চলের ম্যাপের কন্টেন্ট ব্যবহার করতে পারবেন যা ইন্টারনেট সংযোগের প্রয়োজন হয় না।
Read more
