نمایش مسیر راه نقشه در جاواسکریپت


نمایش مسیر راه نقشه در جاواسکریپت

در این آموزش قصد داریم به شما نحوه نمایش مسیر راه نقشه دو یا چند مکان دلخواه توسط API جاواسکریپت Google Maps نمایش دهیم. در این مثال از نشانگر (marker) برای مشخص کردن مکان ها و همچنین اتصال آن ها با کشیدن مسیر راه بین مکان ها استفاده می کنیم .

از این مسیر ها می توانید برای نقشه پرواز هواپیما ها , مسیر دسترسی به یک مکان , مسیر درست برای رسیدن به کارگاه یا شرکت استفاده کنید .

در این کد از کلاس Polyline گوگل مپ استفاده کردیم . این کلاس برای کشیدن نقشه راه بین دو مختصات جغرافیایی بر روی نقشه استفاده می شود. من لیست همه کشور ها را از دیتابیس خوانده و مختصات جغرفایی تک تک کشور ها را با استفاده از ابزار GeoCoding گوگل مپ محاسبه کردم . تمام این مکان ها در یک آرایه ذخیره شدند.

نمایش مسیر راه نقشه در جاواسکریپت

دسترسی به api گوگل مپ برای نمایش مسیر راه نقشه در جاواسکریپت

از کد جاواسکریپت زیر برای دریافت مختصات طول و عرض جغرافیایی کشور های خوانده شده از دیتابیس بهره بردیم.

یک تابع برای فراخوانی کلاس Polyline که برای کشیدن مسیر نقشه راه کشور ها استفاده میشود , تعریف کردیم .همینکه مختصات همه کشور ها در یک آرایه ذخیره شد , از این تابع برای کشیدن مسیر بر روی نقشه استفاده می کنیم.

 نمایش مسیر راه نقشه در جاواسکریپت با API گوگل مپ – خروجی

نمایش مسیر راه نقشه در جاواسکریپت

همانطور که دیدید به چه راحتی تمام این پروسه نمایش مسیر راه نقشه را در چند خط کد جاواسکریپت و php پیاده سازی کردیم . در مقالات بعدی استفاده از فقط کدphp برای نمایش مسیر نقشه راه نمایش خواهیم داد.

حتما بخوانید  قرار دادن تبلیغات بین نوشته های وردپرس بدون افزونه

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

موفق و پیروز باشید.

دانلــود بـاکـــس

لینک های دانلود به ایمیل شما ارسال می شود
با عضویت در سایت می توانید تمامی فایل ها را به صورت مستقیم دانلود کنید
حسن شفیعی
مدرس ، پنتستر ، توسعه دهنده اپلیکیشن های تحت وب ، عضو مرکز حامی نخبگان و از مدیران و اعضای رسمی تیم امنیتی آشیانه هستم . علاقه خاصی به زبان php و امنیت شبکه و لینوکس دارم و هر روز تلاش می کنم به این حوزه ها مسلط تر شوم و اطلاعاتم را در وب به اشتراک بگذارم

دیدگاه کاربران

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

جدیدترین آموزش های آنلاین



بخش کاربران

هنوز عضو نیستید ؟ کلیک کنید

نظر کاربران عزیز

آموزش های آنلاین در چه زمینه ای تهیه کنیم ؟

نظر شما برای ما بسیار مهم است

Loading ... Loading ...

مجوزهای ما

logo-enamd
logo-samandehi

دانلود کتاب

عضویت در خبرنامه