ویدئو های پربازدید سایت

نمایش نقشه گوگل با جی کوئری و جاوا اسکریپت + پروژه

نمایش نقشه گوگل یک محل به کمک جی کوئری مانند تصویر زیر

نقشه گوگل,نمایش نقشه گوگل,نمایش نقشه گوگل در سایت,نقشه گوگل برای سایت,google map,گوگل,کد نمایش نقشه گوگل در سایت,سورس نقشه گوگل برای سایت,دانلود سورس نمایش نقشه گوگل در سایت

برای این کار باید مراجع مربوط به نقشه گوگل را در صفحه وب خود اضافه کنید که شامل موارد زیر می باشد

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
همچنین ما برای نمایش نقشه در یک باکس نمایشی از Jquery-Ui هم استفاده خواهیم کرد

سپس توسط توابعی که برای نمایش نقشه توسط موقعیت جغرافیایی در این کتابخانه (که در بالا به پروژه اضافه کرده ایم ) ، نقشه محل را نمایش می دهیم

نمای کلی :

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
       <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
       <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
       <link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css"
             rel="stylesheet" type="text/css" />
       <script type="text/javascript">
           $(function () {
               $("#ShowMap").click(function () {
                   $("#dialog").dialog({
                       modal: true,
                       title: "www.HyperSourCe.ir",
                       width: 600,
                       hright: 450,
                       buttons: {
                           Close: function () {
                               $(this).dialog('close');
                           }
                       },
                       open: function () {
                           var mapOptions = {
                               center: new google.maps.LatLng(38.08,46.2919444),
                               zoom: 15,
                               mapTypeId: google.maps.MapTypeId.ROADMAP
                           }
                           var map = new google.maps.Map($("#HsMapDiv")[0], mapOptions);
                       }
                   });
               });
           });
       </script>
       <div style="width:1024px;height:600px;">
       <input id="ShowMap" type="button" value="نمایش نقشه " />
       <div id="dialog" style="display: none">
           <div id="HsMapDiv" style="height: 380px; width: 580px;">
           </div>
       </div>
       </div>
 
برای مشاهده نمونه اینجا کلیک کنید

نکته :  برای بدست اوردن مختصات یک شهر میتوانید دز گوگل جستجو کنید برای مثال برای بدست  اوردن مختصات شهر تبریز من از ادرس زیر استفاده کردم
http://www.maplandia.com/iran/east-azarbayejan/tabriz/


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




risperdal avis warpedfish.co.uk risperdal avis
در صورتی که سوالی راجع به این آموزش دارید در بخش نظرات همین پست مطرح و از ارسال ان از بخش ارتباط با ما خود داری نمائید

ویدئو های مرتبط



;