jQueryモバイルページにGoogleマップを埋め込む

私がしようとしていることは、jQueryモバイルページのコンテンツタグにゴーグルマップを埋め込むことで、ページに表示されないようにすることです。私はそれが少し間違いだと思っていますが、私はこれとしばらくの間相反しています。jQueryモバイルページにGoogleマップを埋め込む

<head> 
    <style type="text/css"> 
     #map_canvas { 
      height: 256px; 
      width: 384px; 
      margin-top: 0.6em; 
     } 
    </style> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script type="text/javascript" src="fbObj1.js"></script> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" 
    /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.js"></script> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" 
    /> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" 
    /> 
</head> 

<body> 
    <script type="text/javascript"> 
     geocoder = new google.maps.Geocoder(); 
     var map = new google.maps.Map($("div#map_canvas"), { 
      center: new google.maps.LatLng(37.371940, -122.116470), 
      zoom: 11, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
     map.index = 2; 
    </script> 
    <div data-role="page"> 
     <div data-role="header"></div> 
     <div data-role="content"> 
      <div id="map_canvas"></div> 
     </div> 
     <div data-role="footer" data-position="inline"></div> 
    </div> 
</body>

出典

2012-04-12 Ben Pearce

$のために働いている。$（ "＃のmap_canvas"）された応答のための十分な –

おかげでしかし私はあなたに提案をして、地図はまだ現れていません。 –

次のコードは、のdiv＃は必要ありません（私

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=SET_TO_TRUE_OR_FALSE"></script> 
<script type="text/javascript">  
    function initialize() { 
     var myOptions = { 
      center: new google.maps.LatLng(37.371940, -122.116470),   
      zoom: 11,   
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     };   
     var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); 
    }  
</script> 

<body onload="initialize()">

出典

2012-04-12 07:38:48

jQueryモバイルページにGoogleマップを埋め込む

答えて

関連する問題