اعمال موقعیت آیکون

یکی از چالش برانگیزترین قسمت بکارگیری آیکون برای marker تعیین موقعیت صحیح برای آن است. که در بسیاری موارد این موقعیت نادرست و یا به نسبت مختصات دارای مقداری جابه جایی یا margin است. به طور خودکار در نقشه پارسی‌مپ این مشکل با محاسبه ارتفاع و مقدار حاشیه ورودی حل شده است و دیگر نگرانی از بابت صحت قرار گیری آیکون در مختصات وجود ندارد.

به طور پیشفرض بخش پایینی آیکون به عنوان جایگاه اولیه آن بروی مختصات در نظرگرفته می‌شود و با توجه بر اینکه marker اغلب دارای یک لبه به سمت پایین هستند بر این مبنا نیمی از بخش پایینی آیکون به عنوان جایگاه آن بروی مختصات در نظر گرفته می‌شود. با توجه به اینکه آیکون‌ها دارای نوع‌های مختلفی از جمله marker که دارای ضلعی به سمت پایین و shape‌های بدون گوشه پایینی، لازم است بهترین حالت را برای موقعیت آیکون در نظر گرفت.

نحوه صحیح بکارگیری margin

margin این امکان را فراهم می‌آورد که از طریق آن قادر به تنظیم موقعیت دقیق آیکون بر اساس فاصله از لبه‌های فوقانی و کناری، بروی نقشه باشیم. به طور پیشفرض نیمی از width آیکون به عنوان left یا مقدار فاصله از لبه چپ و مقدار height آیکون به عنوان top یا مقدار فاصله از لبه بالا در نظر گرفته می‌شود. تصور کلی بر این است که آیکون اگر به صورت marker باشد طبیعتاً دارای یک ضلع رو به پایین است که با توجه بر این موضوع و در نظر گرفتن شروع مختصات در صفحه نمایش می‌بایست برخی استثناها برای قرار دادن صحیح نشانگر یا آیکون در نظر گرفته شود.

نقاط 0 و 0 ابتدای مختصات را بر اساس x و y بروی صفحه نمایش مشخص می‌کنند و این مختصات از گوشه سمت چپ و گوشه سمت بالائی شروع می‌شود و بر این روال margin این نقاط را top برای گوشه سمت بالائی و left برای گوشه سمت چپ در نظر میگرد. در صورتیکه اگر اندازه آیکون برای نمایش بروی مختصات مدنظر دارای اندازه height برابر 6 و width برابر 3 باشد. برای نمایش یک marker که حاوی یک ضلع رو به پایین است بهترین راه این است که حاشیه از سمت چپ یا left با توجه به اندازه width برابر نصف آن یا 3 باشد و با توجه بر اینکه لازم است نقطه پایینی آیکون در نظر گرفته شود پس نیاز است که کل height برای حاشیه از سمت بالا یا top در نظر گرفته شود که در این صورت حاشیه از سمت بالا برابر مقدار 6 باید باشد. که این روش به صورت پیشفرض برای آیکون‌های marker شکل در نظر گرفته شده است ولی در برخی موارد لازم است که از shape متفاوت تر از marker استفاده شود که فاقد گوشه بوده و یا جهتی خاص برای اشاره به نقطه دارا نیست. برای نمونه برای قرار دادن یک شکل دایره‌ای یا مستطیل و ... بهتر است مرکز آیکون را به عنوان جایگاه قرارگیری روی نقشه در نظر گرفت. برای اینکار تنها نیمی از ارتفاع را تنظیم می‌کنیم تا آیکون در وسط مختصات قرار گیرد. که با توجه به نمونه قبل به طور پیش فرض نیمی از width به عنوان حاشیه از سمت چپ در نظر گرفته شده و اگر در اینجا یک شکل چند ضلعی به عنوان آیکون در نظر گرفته شده و اندازه آن height برابر 6 و width برابر 6 باشد. با توجه به مقدار پیش فرض تنها نیاز به قرار دادن top برابر نیمی از height چون left نیز برابر نیمی از width آیکون است.

style: {
    // Sets top to half of height for put star marker in center of latlng.
    margin:  { top: height / 2 }
}