{GoogleMapsAPI: 'JavaScript API V3', Title: 'hello map_with_jquery', Level: 2.1}

google Maps jQuery Snippet

　{GoogleMapsAPI: 'JavaScript API V3', Title: 'hello map', Level: 2} - 会者定離で以降を、
jQueryを使って書きなおし。

top.html

<html>
    <head>
        <title>Hello world in Google Maps API version3</title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script src="http://www.google.com/jsapi"></script>
        <script>
            google.load("jquery", "1.5.0");
            google.load("jqueryui", "1.8.9");
        </script>
        <script type="text/javascript" src="hello_maps_with_jquery.js" charset=UTF-8></script>
    </head>
    <body>
        <div id="map_canvas" style="width: 500px; height: 500px"></div>
    </body>
</html>

hello_maps_with_jquery.js

$(function() {
    (function(canvas){
        var centerPos = new google.maps.LatLng(34.983919, 135.75825499999996);
        var mapOptions = {
            zoom : 15,
            center : centerPos,
            mapTypeId: google.maps.MapTypeId.ROADMAP//,streetViewControl: true
        };
        var map = new google.maps.Map(canvas, mapOptions);
    })($("#map_canvas").get(0));
});

　一日一歩（＾ｗ＾）ノ