/
  • ساخت نقشه بدون فلش

  • ارسال پاسخ   امتیاز موضوع:
    • 0 رأی - میانگین امیتازات: 0
    • 1
    • 2
    • 3
    • 4
    • 5

    حالت موضوعی | حالت خطی ساخت نقشه بدون فلش
    نویسنده پیام
    hamid_80386 آفلاین
    حمید عباسی
    ***

    ارسال‌ها: 1,479
    تاریخ عضویت: ۱۳۹۰ بهمن ۱۶
    اعتبار: 62
    تشکرها : 1216
    ( 1253 تشکر در 748 ارسال )
    ارسال: #1
    Lightbulb ساخت نقشه بدون فلش
    سلام

    این نقشه رو ببینید

    حتماً افسوس میخورید که چرا با فلش ساخته شد و html نیست!!

    یکی دو بار دیدم دوستان پست هایی گذاشته بودن که همچین مشکلی داشت...

    شاید این مطلب رو ندونید که با html میشه همچین نقشه ای ساخت:

    اینجا رو نگاه کنید:

    Create Html Map

    تگ map در html برای همین کار ساخته شده،
    این تگ یک تگ فرزند داره بنام area که توی اون باید بیاید تو یه مختصاتی از نقشه یه shape بسازید، shape های قابل قبول دایره، مستطیل و چند ضلعی هست، در مورد دایره و مستطیل چون با یه مختصات و شعاع و یا ضلع ساده درست میشه حرفی نیست؛
    اما شاید بگید برای ایجاد یک استان توی یک نقشه باید یک چند ضلعی با ده ها ضلع ساخت، خب راستم میگید، همین کار رو باید کرد که اگه ریاضی دان نباشید، شاید اصلاً نتونید دستی همچین کاری کنید!!

    اما اینم راه حل داره Shy

    حتماً تا حالا نرم افزار های کوچیک شرکت معروق CofeeCup رو دید!
    این بار هم CofeeCup یه ابزار سودمند داره:
    CoffeeCupImageMapper ابزاری هست که به شما اجاره میده یه عکس رو بندازید تو زمینه (مثلاً نقشه ایران) و روی اون برای هر استان با ابزارهای خاص خودش چند ضلعی بکشید و بعبارتی استان ها رو در بیآرید Shy

    این نرم افزار دارای 15 روز TRIAL هست Cool

    همچنین میتونید از ابزار آنلاین: Image Map استفاده کنید.

    فقط میمونه یه مسأله که وقتی میرید روی یه استان رنگ استان عوض شه،
    که اونم که فتوشاپ و جاوااسکریپت یا جی کوئری Wink
    بیاید برای هر استان رو تو همون size کل نقشه ایران در بیارید، دقیقاً همونجایی که هست، یعنی بقیه شهر ها رو با فتوشاپ از دور اون استان حذف کنید، بعد رنگ اون استان رو تغییر بدید و ذخیره کنید...

    حالا نکته اینجاست که شما میتونید به هر نقشه (یعنی تگ map) چند عکس اختصاص بدید، یعنی تو تگهای img تون یه property میزارید به صورت زیر:
    کد:
    <img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"
    خاصیت usemap همه عکس ها باید برابر خاصیت name تگ map تون باشه،
    و بعد نکته اینه که شما میاید مثلاً z-index عکس اصلی رو 100 میزارید و z-index بقیه عکس ها رو 100- ، بعد میآید با جاوااسکریپت میگید که مثلاً وقتی موس رفت روی تگ area با id فلان، z-index تصویر 2 بشه 200
    تصویر 2 هم که مثلاً عکس استان اصفهان هست و سایزش هم که اندازه تصویر اصلی و دور استان هم که transparent هست، به این ترتیب تصویر 2 میوفته روی تصویر 1، منتهی اطراف استان اصفهان تصاویر تصویر 1 نشون داده میشه Shy
    وقتی هم که موس از رو area استان اصفهان با id فلان رفت کنار، دوباره z-index تصویر 2 میشه 100- Rolleyes

    شما همچنین میتونید بجای z-index از خاصیت display استفاده کنید و یا از رویداد های fadeIn و fadeOut در جی کوئری...

    موفق باشید Heart
    __________________________________________________________________________
    هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
    (آخرین ویرایش در این ارسال: ۱۳۹۱ شهريور ۱۳ ۱۱:۳۶ عصر، توسط hamid_80386.)
    ۱۳۹۱ شهريور ۱۳ ۱۰:۴۸ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط : pary_daryayi oia vejmad masoudmanson Bojbaj ali786 SAMAN_PHP
    farhadfery آفلاین
    fery
    ****

    ارسال‌ها: 285
    تاریخ عضویت: ۱۳۸۹ فروردين ۳۰
    اعتبار: 11
    تشکرها : 468
    ( 214 تشکر در 123 ارسال )
    ارسال: #2
    RE: ساخت نقشه بدون فلش
    شما نقشه ایران را به این صوزت که گفتید اماده کردید؟ می شه بگذارید اینجاBig Grin اماده خوری کنیم.
    __________________________________________________________________________
    خدایا، این دنیا را بیهوده نیافریدی.
    ۱۳۹۱ شهريور ۱۳ ۱۱:۵۶ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    hamid_80386 آفلاین
    حمید عباسی
    ***

    ارسال‌ها: 1,479
    تاریخ عضویت: ۱۳۹۰ بهمن ۱۶
    اعتبار: 62
    تشکرها : 1216
    ( 1253 تشکر در 748 ارسال )
    ارسال: #3
    RE: ساخت نقشه بدون فلش
    من آماده کردم، منتهی اونی که آماده کردم برای شرکت خاصی هست و حق امتیازش مربوط به اونا Wink

    اصولش رو گفتم که خیلی هم راحت هست، خیلی وقت نمیبره!
    __________________________________________________________________________
    هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
    ۱۳۹۱ شهريور ۱۴ ۱۲:۰۱ صبح
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط : farhadfery undefined
    vejmad آفلاین
    عضو ارشد
    *****

    ارسال‌ها: 1,460
    تاریخ عضویت: ۱۳۸۹ ارديبهشت ۲۱
    اعتبار: 23
    تشکرها : 484
    ( 1247 تشکر در 611 ارسال )
    ارسال: #4
    RE: ساخت نقشه بدون فلش
    بخاطر زحمت و جامع و متنوع بودن مطالب ازت تشکر کردم.
    ولی بله این از قدیم در HTML بوده. معلوم میشه تاحالا یه رفرنس HTML رو کامل نخوندیدا Big Grin
    من بعکس تقریبا همیشه اول اون زبان، کتابخانه، و پروتکل و خلاصه هرچیزی رو که باهاش سروکار دارم کامل میخونم که بدونم چی داره و چی نداره.
    ولی بیشتر افراد دیگه در حین کار عملی و نیاز و خورده خورده یاد میگیرن که ابزار کارشون چه قابلیت هایی داره.
    خب این دو روش متفاوت بید. نمیگم کدوم بهتره یا بدتر.

    البته از فلش هم درجاهاییکه نیاز به قابلیت های تعاملی و گرافیکی بیشتری هست استفاده میشه. ولی الان با پیشرفت امکانات و سازگاری و راحتی ابزارهای DHTML، استفاده از فلش دیگه خیلی کمتر شده و باید حتی الامکان ازش پرهیز کرد. این چند وقته هم که فلش رسما برای پیوستن به تاریخ معرفی شده! دیرتر یا زودتر تقریبا انتظار منقرض شدنش میره.
    __________________________________________________________________________
    God knows
    ۱۳۹۱ شهريور ۱۴ ۰۹:۵۸ صبح
    یافتن ارسال‌ها WWW پاسخ با نقل قول
     تشکر شده توسط : hamid_80386
    hamid_80386 آفلاین
    حمید عباسی
    ***

    ارسال‌ها: 1,479
    تاریخ عضویت: ۱۳۹۰ بهمن ۱۶
    اعتبار: 62
    تشکرها : 1216
    ( 1253 تشکر در 748 ارسال )
    ارسال: #5
    RE: ساخت نقشه بدون فلش
    نقل قول: معلوم میشه تاحالا یه رفرنس HTML رو کامل نخوندیدا

    دقیقاً همینطوره، من معمولاً مباحث ابتدایی رو خوب میخونم، ولی جلوتر که میره زیاد اهمیت نمیدم، چون به قول شما تو کار در میآد
    البته نه که نخوام بخونم، نمیرسم که بخونم Wink هر چی هم سن آدم میره بالاتر این نرسیدنه بیشتر میشه Undecided

    ولی خب این بحث رو صرفاً برای یکی دو تا از بچه ها که قبلاً پست گذاشته بودن و اون موقع نرسیدم جامع جواب بدم گذاشتم Rolleyes
    __________________________________________________________________________
    هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
    (آخرین ویرایش در این ارسال: ۱۳۹۲ دي ۳ ۰۲:۴۶ صبح، توسط hamid_80386.)
    ۱۳۹۱ شهريور ۱۴ ۰۲:۰۳ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    ali786 آفلاین
    I'm learning to coding
    ***

    ارسال‌ها: 212
    تاریخ عضویت: ۱۳۹۰ بهمن ۷
    اعتبار: 10
    تشکرها : 771
    ( 161 تشکر در 104 ارسال )
    ارسال: #6
    Wink RE: ساخت نقشه بدون فلش
    سلام
    دوستان قبلا همچین چیزی را دیده و بلافاصله ذخیره کرده بودم برای روز مبادا Cool
    خدمت دوستان خصوصا آقا فرهاد :

    http://ali786.persiangig.com/other/IranHtmlMap.zip


    .html  IranHtmlMap.html (اندازه: 7.23 KB / تعداد دفعات دریافت: 30)


    فایل‌(های) پیوست شده بندانگشتی (ها)
       
    (آخرین ویرایش در این ارسال: ۱۳۹۱ شهريور ۱۴ ۰۲:۴۶ عصر، توسط ali786.)
    ۱۳۹۱ شهريور ۱۴ ۰۲:۴۵ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط : farhadfery hamid_80386 shgninc
    hamid_80386 آفلاین
    حمید عباسی
    ***

    ارسال‌ها: 1,479
    تاریخ عضویت: ۱۳۹۰ بهمن ۱۶
    اعتبار: 62
    تشکرها : 1216
    ( 1253 تشکر در 748 ارسال )
    ارسال: #7
    RE: ساخت نقشه بدون فلش
    خوبه، فقط خیلی کوچیکه، ولی شد نمونه آموزشی واسه مطالب بالا

    ممنون Rolleyes
    __________________________________________________________________________
    هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
    (آخرین ویرایش در این ارسال: ۱۳۹۱ شهريور ۱۵ ۰۱:۲۸ صبح، توسط hamid_80386.)
    ۱۳۹۱ شهريور ۱۴ ۰۳:۲۲ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    eskafild آفلاین
    عضو جدید
    **

    ارسال‌ها: 3
    تاریخ عضویت: ۱۳۹۲ دي ۱
    اعتبار: 0
    تشکرها : 0
    ( 0 تشکر در 0 ارسال )
    ارسال: #8
    RE: ساخت نقشه بدون فلش
    آقای عباسی امکانش هست یه نمونه بزارید در مورد رنگ هاش؟ من تو قرار دادن رنگ مشکل پیدا کردم! بی زحمت یه فایل نمونه!
    تشکر
    __________________________________________________________________________
    https://farazahmadi.ir
    ۱۳۹۲ دي ۲ ۰۲:۱۳ صبح
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    hamid_80386 آفلاین
    حمید عباسی
    ***

    ارسال‌ها: 1,479
    تاریخ عضویت: ۱۳۹۰ بهمن ۱۶
    اعتبار: 62
    تشکرها : 1216
    ( 1253 تشکر در 748 ارسال )
    ارسال: #9
    RE: ساخت نقشه بدون فلش
    رنگ که دیگه به اچ تی ام ال ربط نداره، فایل png رو که برای شهر خاصی میبرید با یه رنگ دیگه بزارید...
    __________________________________________________________________________
    هر که با مرغ هوا دوست شود - خوابش آرامترین خواب جهان خواهد بود.
    ۱۳۹۲ دي ۳ ۰۲:۴۸ صبح
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    eskafild آفلاین
    عضو جدید
    **

    ارسال‌ها: 3
    تاریخ عضویت: ۱۳۹۲ دي ۱
    اعتبار: 0
    تشکرها : 0
    ( 0 تشکر در 0 ارسال )
    ارسال: #10
    RE: ساخت نقشه بدون فلش
    (۱۳۹۲ دي ۳ ۰۲:۴۸ صبح)hamid_80386 نوشته شده توسط:  رنگ که دیگه به اچ تی ام ال ربط نداره، فایل png رو که برای شهر خاصی میبرید با یه رنگ دیگه بزارید...

    یعنی به این صورت نیست که موس رو روی هر شهر بردیم اونجا رنگش عوض بشه؟
    __________________________________________________________________________
    https://farazahmadi.ir
    ۱۳۹۲ دي ۳ ۱۲:۰۱ عصر
    یافتن ارسال‌ها پاسخ با نقل قول
     تشکر شده توسط :
    « قدیمی تر | تازه‌ تر »

    ارسال پاسخ
    پرش به انجمن:


    کاربرانِ درحال بازدید از این موضوع: 1 مهمان
    IranPHP.org | تماس با ما | بازگشت به بالا | بازگشت به محتوا | بایگانی | پیوند سایتی RSS