ably ably برای هدایت شدن به سایت جدید اینجا کلیک کنید

آموزش برنامه نویسی

آموزش برنامه نویسی وب، اندروید، ویندوز , اسکیوال و...
Tell: 0912 097 5516
| Email: Hello@EduOnline.ir

آموزش GoogleMap

بسم الله الرحمن الرحیم

آموزش GoogleMap

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

مثل همیشه مثال را بدون توضیحات اضافه شروع می کنیم. (من خودم شخصا توضیحات طولانی را برای آموزش نمی پسندم و دوست دارم کد با مختصری توضیحات ارائه شود)



<!DOCTYPE html>
<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
</script>
//این خط ثابت است

<script>
var myCenter=new google.maps.LatLng(29.621184,52.499063);
//به جای این اعداد کافی است در گوگا مپ مکان خود را پیدا کنید
//و سپس بر روی مکان خود کلیک راست کنید و
//whats here?
//را انتخاب کنید

function initialize()
{
var mapProp = {
  center:myCenter,
  zoom:13,
  mapTypeId:google.maps.MapTypeId.ROADMAP
  };

//می توانستیم به جای قراردادن موقعیت خودمان در متغییر
//myCenter
// همین جا آدرس را بنویسیم ولی برای ساده تر شدن و تفکیک این کار را انجام دادیم
//پراپرتی Center
// درواقع مشخص می کند وسط نقشه شما چه جایی باید نمایش داده شود
//zoom
//برای نمایش میزان زوم اولیه در لود نقشه است
//mapTypeId
//می تواند یکی از نوع های زیر باشد لطفا تست کنید
//ROADMAP (normal, default 2D map)
//SATELLITE (photographic map)
//HYBRID (photographic map + roads and city names)
//TERRAIN (map with mountains, rivers, etc.)



var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

//محل قرار گیری پوینتر مربوط به مکان شما
var marker=new google.maps.Marker({
  position:myCenter,
  });
//اضافه کردن پوینتر به مپ
marker.setMap(map);
}
// فراخوانی سرویس پس از لود کامل صفحه
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>

<body>
//مشخصات دیو شما برای نمایش مپ ما در این جا فقط سایز را مشخص کردیم شما استایل و .. را می توانید اضافه کنید
<div id="googleMap" style="width:900px;height:380px;"></div>
</body>
</html>

نظرات (۱)

مشتی هسی
ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی
up
ما را در گوگل محبوب کنید