Monday, June 14, 2010

Google Maps Version 3

Google Mapsを作り手順

  1. scriptタグを使って、Map API JavaScriptを読み込みます。


  2. <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>

  3. 地図を表示するためのdiv要素を作成する


  4. <div id="map" style="height:100%;width:100%"></div>

  5. たくさんの地図プロパティの保持するためのJavascriptオブジェクト定数を作成する



  6. function initilize(){

    //location
    var myLocation = new google.maps.LatLng(34.32322,113.323232);

    //map option
    var myOptions ={
    zoom: 8,
    center: myLocation,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    //mapTypeId:google.maps.MapTypeId.SATELLITE
    //mapTypeId: google.maps.MapTypeId.HYBRID
    //mapTypeId: google.maps.MapTypeId.TERRAIN

    }

    }

  7. ”map”オブジェクトを作成するためのjavascript関数を書きます。


  8. var map = new google.maps.Map(document.getElementById("map"), myOptions);

  9. bodyタグのonloadイベントで、地図オブジェクトを初期化します。


  10. <body onload="initilize()">

    ......
    </body>


No comments:

Post a Comment