在iPhone模拟器上显示谷歌地图 - Phonegap

时间:2011-09-28 03:39:25

标签: javascript xcode4 google-maps-api-3 cordova ios4

我正在运行Mac OSX Lion和Xcode 4.1.1。我创建了一个新的Phonegap项目,在index.html中,我添加了以下代码。

<!DOCTYPE html>
<html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

    <script type="text/javascript" charset="utf-8" src="phonegap-1.0.0.js">
    </script>

    <!-- Tried setting sensor=true, didn't work too -->
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
    </script>

    <script type="text/javascript" charset="utf-8" >

    function display(position){
        var initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
        var myOptions = {
                zoom: 12,
                center: initialLocation,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        }

        function error()
        {
            alert('Not working');
        }

        function init()
        {
            navigator.geolocation.getCurrentPosition(display,error);
        }
        </script>
    </head>
    <body onload="init()">
        <div id="map_canvas"></div>
    </body>
</html>

然而,代码拒绝工作。我甚至在Phonegap.plist中启用了“EnableLocation”键。我没有得到任何警告说“Testapp想知道你的位置,允许吗?”。我得到的只是控制台上的这个错误

navigator.geolocation.setError({ 'code': 1, 'message': 'Location Services Not Enabled' });

有人可以帮帮我吗?

1 个答案:

答案 0 :(得分:6)

我希望我知道该告诉你什么,但我希望这会有所帮助。我认为你的代码很好。我刚从Snow Leopard上的Dreamweaver在iOS 4.3模拟器上运行它,它运行良好。但是,由于DIV完全崩溃,我不得不进行一些调整。地图在那里,但没有显示。

为了向自己证明,请尝试将其添加到map_canvas div

style="height: 400px"

当我这样做时,我可以看到地图很好。

我不是CSS专家,所以我不知道如何让愚蠢的div扩展到地图的大小。也许你必须用CSS来做。高度100%不起作用。有时候CSS真的很糟糕。