سون لرن • آموزش

درباره سایت

آخرین مطالب

امکانات وب

آموزش نقشه گوگل - Google Maps (جلسه 3) - انواع نقشه های گوگل مپ

0 3 ۱۲ تیر ۹۵

در این مطلب با ادامه آموزش Google Maps در خدمتتون هستیم.

google-maps

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

انواع نقشه برای Google Maps

گوگل از انواع زیر پشتیبانی میکنه:

ROADMAP : این مورد نوع پیش فرض هست. اگر هیچ نوعی برای نقشه مشخص نکنید، این مورد بصورت اتوماتیک فعال میشه. این مورد نمای خیابانها رو در مکانی که مشخص کردید، نمایش میده.
SATELLITE : اگه این نوع نقشه رو انتخاب کنید، نقشه خروجی شما بصورت تصاویر ماهواره ای نمایش داده میشه.
HYBRID : این نوع نقشه خیابانهای اصلی رو بر روی تصاویر ماهواره ای نمایش میده.
TERRAIN : با انتخاب این نوع نقشه، عوارض زمین و پوشش گیاهی در نقشه نمایش داده میشه.

برای انتخاب یکی از موارد بالا برای نوع نقشه، باید بصورت زیر عمل کنید:

var mapOptions = {

mapTypeId:google.maps.MapTypeId.Id of the required map type

};

باید بجای Id of the required map type یکی از اون 4 مورد رو قرار بدیم تا نوع نمودار مشخص بشه.

حالا برای هر کدوم از موارد بالا یک مثال میزنیم تا بهتر موضوع رو بفهمید.

نوع اول : ROADMAP

<!DOCTYPE html>

<html>

<head>

function loadMap() {

var mapOptions = {

center:new google.maps.LatLng(17.609993, 83.221436),

zoom:9,

mapTypeId:google.maps.MapTypeId.ROADMAP

};

var map = new google.maps.Map(document.getElementById("sample"),mapOptions);

}

google.maps.event.addDomListener(window, 'load', loadMap);

</script>

</head>

<body>

</body>

</html>

خروجی این نمونه بصورت زیر هست: roadmap type google maps

نوع دوم : Satellite

<!DOCTYPE html>

<html>

<head>

function loadMap() {

var mapOptions = {

center:new google.maps.LatLng(17.609993, 83.221436),

zoom:9,

mapTypeId:google.maps.MapTypeId.SATELLITE

};

var map = new google.maps.Map(document.getElementById("sample"),mapOptions);

}

google.maps.event.addDomListener(window, 'load', loadMap);

</script>

</head>

<body>

</body>

</html>

خروجی این نمونه بصورت زیر هست: satellite type google maps

نوع سوم : Hybrid

<!DOCTYPE html>

<html>

<head>

function loadMap() {

var mapOptions = {

center: new google.maps.LatLng(17.609993, 83.221436),

zoom: 9,

mapTypeId: google.maps.MapTypeId.HYBRID

};

var map = new google.maps.Map(document.getElementById("sample"), mapOptions);

}

</script>

</head>

</body>

</html>

خروجی این نمونه بصورت زیر هست: hybrid type google maps

نوع چهارم : Terrain

<!DOCTYPE html>

<html>

<head>

function loadMap() {

var mapOptions = {

center:new google.maps.LatLng(17.609993, 83.221436),

zoom:9,

mapTypeId:google.maps.MapTypeId.TERRAIN

};

var map = new google.maps.Map(document.getElementById("sample"),mapOptions);

}

google.maps.event.addDomListener(window, 'load', loadMap);

</script>

</head>

<body>

</body>

</html>

خروجی این نمونه بصورت زیر هست: terrain type google maps

در جلسات بعدی بیشتر در مورد این ابزار قدرتمند گوگل صحبت میکنیم.

امیدوارم از این جلسه خوشتون اومده باشه.

موفق باشید

یا علی

Source

برچسب: نویسنده: استخدام کار تاريخ: يکشنبه 13 تير 1395 ساعت: 4:57

درباره سایت

آخرین مطالب

امکانات وب

آموزش نقشه گوگل - Google Maps (جلسه 3) - انواع نقشه های گوگل مپ

انواع نقشه برای Google Maps

نوع اول : ROADMAP

نوع دوم : Satellite

نوع سوم : Hybrid

نوع چهارم : Terrain

صفحه بندی

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه