آموزش گوگل مپ Google Map Api قدم به قدم(قسمت سوم)

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

چند ضلعی ها از خطوط راست و شکل “بسته” ساخته شده است، (تمام خطوط متصل به هم).
چند ضلعی خواص زیر پشتیبانی می کند:

مسیر paths – منظور همان نقاط مشخص شده (برای به هم پیوستن) lat ها و lng ها
strokeColor : رنگ خطوط نقاط به هم پیوسته
strokeOpacity : میزان شفافیت نمایش خطوط
strokeWeight : پهنا خط ها به هم پیوسته
fillColor : رنگ درون چند ضلعی
fillOpacity : میزان تاری درون چندضلعی

خب حالا یک مثال ساده از چندضلعی

در زیر نقشه مشهد مقدس و چند ضلعی حرم مطهر امام رضا (ع) و اطراف آن را نشان میدهد

کد جاوااسکریپت :

var metros;

function initialize()
{
var map = new google.maps.Map(document.getElementById(“map”),
{
zoom: 13,
center: new google.maps.LatLng(36.282473, 59.598636),
mapTypeId: google.maps.MapTypeId.HYBRID
});

var coords =
[
new google.maps.LatLng(36.300877,59.604699), //Mumbai
new google.maps.LatLng(36.289531761641,59.63679313659668), //Delhi
new google.maps.LatLng(36.27597078174602,59.62529182434082), //Kolkata
new google.maps.LatLng(36.28150616017376,59.59885597229004), //Bengaluru
];

metros = new google.maps.Polygon(
{
paths: coords,
strokeColor: “#۴۴۹c0e”,
strokeOpacity: 0.5,
strokeWeight: 2,
fillColor: “#۵۶a725”,
fillOpacity: 0.1
});

metros.setMap(map);
}

نقشه به صورت ماهواره ای نمایش داده میشود و نقشه با آیدی map فرا خوانی میشود

div id=”map”

طبق توضیحات بالا مسیر ها در متغیر coord  قرار دارد

 

—–

اجرای کد مربوطه

 

منبع: pars-seo http://pars-seo.ir/%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-%D8%B3%D8%A7%DB%8C%D8%AA/%D8%AC%D8%A7%D9%88%D8%A7-%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA/%D8%A2%D9%85%D9%88%D8%B2%D8%B4-%DA%AF%D9%88%DA%AF%D9%84-%D9%85%D9%BE-google-map-api-%D9%82%D8%AF%D9%85-%D8%A8%D9%87-%D9%82%D8%AF%D9%85%D9%82%D8%B3%D9%85%D8%AA-%D8%B3%D9%88%D9%85/

منبع: worldlanguage

پاسخ دهید

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

شما می‌توانید از این دستورات HTML استفاده کنید: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>