GoogleMaps 无法在我的 Cordova 应用程序中运行答案

【问题标题】：GoogleMaps don't run in my cordova appGoogleMaps 无法在我的 Cordova 应用程序中运行
【发布时间】：2016-01-12 09:28:29
【问题描述】：

我正在开发 Visual Studio 2013 Apache Cordova 应用程序。我在谷歌地图上定位一个点时遇到问题。我在我的应用程序中添加了地理定位插件，但它不起作用。这是我的代码：

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <div><button id="showmap" >show map </button></div>
    <div id="googleMap">View Map ---</div>
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
    <script src="http://maps.googleapis.com/maps/api/js"></script>

    <script>

        $("#showmap").click(function () {
            var damas = new google.maps.LatLng(33.513, 36.2920000000003);
            var mapProp = {
                center: damas,
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

            var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
            var myCity = new google.maps.Circle({
                center: damas,
                radius: 20000,
                strokeColor: "#0F00FF",
                strokeOpacity: 0.8,
                strokeWeight: 2,
                fillColor: "#F0F0FF",
                fillOpacity: 0.8,
                editable: true
            });

            myCity.setMap(map);
        });
    </script>
</body>

</html>

请给我一些建议。谢谢！

【问题讨论】：

您是否尝试为您的googleMap div 设置维度？

标签： jquery cordova visual-studio-cordova

【解决方案1】：

你需要给你的 div 添加高度：

<div id="googleMap" style="height:300px;">View Map ---</div>

或者，如果您愿意，可以在单击显示地图按钮时进行设置：

$("#googleMap").height(300);

Here您可以看到我为您创建的示例。

【讨论】：

是的，它的工作我忘了给我的 div 添加样式。非常感谢。