ساختن نقشه کشورها با جاوا اسکریپت!

یادم میاد یه سایتی داشتیم برای یه شرکتی میساختیم و توش نیاز بود که از نقشه کشور ها استفاده کنیم. خب حالا چجوری میتونیم در صفحات وب نقشه ی یک کشور رو ایجاد کنیم؟ روش های مختلفی وجود داره مثلا با SVG نقشه ایجاد کنیم یا اینکه از جاوا اسکریپت استفاده کنیم. میتونید از نرم افزارهایی مثل ایلاستریتور و کورل درا corel draw استفاده کنید و باهاش نقشه های تحت وب با پسوند svg ایجاد کنید.

در اینجا برای راحتی کار من طریقه ایجاد نقشه های تحت وب رو با یه کتابخونه جاوا اسکریپت بهتون آموزش میدم. 🙂

ابتدا باید کتابخونه جی کوئری jquery و رافائل Raphaël و مپ ال jQuery Mapael رو به صفحه خودتون اظافه کنید. بعدش میتونید کار رو شروع کنید.

برای ایجاد نقشه های تحت وب با استفاده از jQuery Mapael به صورت زیر عمل میکنیم:

ابتدا یک ساختار html ایجاد میکنیم که این ساختار در انتهای کار حاوی نقشه ی کشور مورد نظر ما خواهد بود:

در مرحله ی بعد با استفاده از دستورات زیر نقشه ی مورد نظر خودمون رو درون ساختاری که در مرحله ی قبل ایجاد کردیم قرار میدیم:

در نهایت نقشه ایجاد شده به صورت تصویر زیر خواهد بود:

 

create_web_maps

میتونید کارهای جالب تری انجام بدید و نقشه های کشور های دیگه رو هم میتونید در اختیار داشته باشید. همچنین میتونید نقشه ها رو به SVG تبدیل کنید از طریق سایت خود مپ ال من براتون یک سری از نقشه های کشور های مختلف + نقشه کشور خودمون ایران عزیز + مثال های سایت مپ ال رو انتهای این پست برای دانلود گذاشتم میتونید دانلود کنید و استفاده کنید.

لیست یک سری از نقشه های  تحت وب ایجاد شده همراه فایل به صورت زیر می باشد:(فایل حاوی نقشه ها رو میتونید در انتهای پست دانلود کنید)

نقشه ایران svg

نقشه ایران جاوا اسکریپتی + قابلیت های اظافی مثلا با هاور کردن اتفاق خاصی بیوفته

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

نقشه بلقارستان جاوا اسکریپتی

نقشه اتحادیه اروپا جاوا اسکریپتی + نقشه کشور های جزو اتحادیه به تفکیک

نقشه فرانسه جاوا اسکریپتی + نقشه همه شهر ها و استان ها به تفکیک

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

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

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

نقشه انگلیس (بریتانیای کبیر) جاوا اسکریپتی

نقشه والز جاوا اسکریپتی

امیدوارم که این نقشه ها در کارهای آینده بدردتون بخوره و یه سایت خفن درست کنید. موفق باشید.

نقشه کشور های جهان برای صفحات وب
1.1 MiB
252 Downloads
اطلاعات بیشتر
به اشتراک بگذارید:Email this to someoneShare on FacebookTweet about this on TwitterShare on Google+Digg thisShare on LinkedInPin on PinterestShare on StumbleUponFlattr the authorShare on RedditBuffer this pageShare on TumblrPrint this pageShare on YummlyShare on VK
  1. meysamv2

    سلام خسته نباشی… خدایی دمت گرم… خداکنه هرجا هستی موفق باشی….
    یا علی

  2. سلام… دمتون گرم…
    فقط یه سوال… استفاده از این نقشه ی ایران تو سایت های دیگه مجازه؟ میتونیم ازش استفاده کنیم؟

می‌خواهید دیدگاهتان را بیان کنید؟