ساخت یک نقشه تصویری (image map)، با تگ های img و map و area ، در HTML
یک نقشه تصویری (image map)، عکسی می باشد که بخش های مختلف آن، به صورت لینک هستند و ما را به صفحات مختلفی از سایت هدایت می کنند.
برای یادگیری چگونگی ساخت یک نقشه تصویری (image map)، به مثال زیر توجه کنید :
ابتدا عکس را به طور معمولی، با تگ img ، تعریف می کنیم. تنها باید درون تگ img ، به map مورد نظرمان، ارجاع بدهیم. منظور از map ، تگ map ای هست که با یک نام، آن را مشخص کرده ایم. درون تگ map ، یک سری ناحیه تعریف می کنیم (با تگ area) و سپس برای هر ناحیه، یک صفحه مقصد مشخص شده است :
درون هر تگ area ، باید با مشخصه shape ، تعیین کنیم که شکل ناحیه، به چه صورت باشد. در کد بالا، دو ناحیه تعریف کرده ایم، یکی به شکل مستطیل (rect مخفف rectangle ، به معنی مستطیل) می باشد و ناحیه دیگر، به شکل دایره (circle) است. دقت کنید که برای کل تصویر (درون تگ img) و همچنین برای دو ناحیه، عنوان های (title) متفاوتی مشخص کرده ایم تا با بردن موس بر روی نواحی مختلف، به راحتی بتوانید مرز آنها را تشخیص بدهید.
وقتی ناحیه را به شکل مستطیل (rect) انتخاب کنیم، باید مختصات نقاط ابتدا و انتهای ناحیه را برای مشخصه coords ، به صورت 4 عدد، مشخص کنیم. همچنین برای ناحیه به شکل دایره (circle)، باید سه عدد را برای مشخصه coords تعیین کنیم. دو عدد اول، مختصات x و y مرکز دایره می باشد و عدد سوم، اندازه شعاع دایره است.
نتیجه :
رضا چه جوری مختصات را به دست بیاریم این مهمه
رضا ادمین بگو مختصات coords رو چه جوری بدست بیاریم
admin سلام.
ابتدا باید به اندازه عکس اصلی توجه داشته باشید که تعداد پیکسل آن در جهت های افقی و عمودی چقدر است (جهت های x و y). بنابراین بر اساس این اندازه ها، مختصات ناحیه ها را به گونه ای تعیین می کنیم که دقیقا درون عکس قرار بگیرند (بیرون زدگی نداشته باشند).
سپس برای ناحیه به شکل مستطیل، 4 عدد خواهیم داشت که 2 عدد اول برابر مختصات x و y نقطه شروع مستطیل و 2 عدد بعدی برابر مختصات x و y نقطه پایان مستطیل می باشند (زیرا ما با دانستن این 2 نقطه می توانیم محل مستطیل را به طور دقیق مشخص کنیم).
برای ناحیه به شکل دایره، باید 3 عدد را مشخص کنیم که 2 عدد اول، مختصات x و y نقطه مرکز دایره می باشد و عدد سوم، اندازه شعاع دایره است.
مختصات بر اساس اندازه عکس اصلی تعیین می شوند، یعنی اولین نقطه عکس اصلی، دارای مختصات 0 و 0 خواهد بود.
