Google 带标记的地图未在 android 浏览器中显示

Question

我创建了一个脚本（应用程序），用户可以在其中标记 google 地图中的位置，然后保存到我的数据库中。该应用程序可以运行并在浏览器 pc / 笔记本电脑中打开，但该应用程序无法在 android 浏览器中打开，无论是使用标准浏览器还是 chrome.

如果浏览器不支持地理定位，它应该显示警报，但警报也不会显示。

按照我创建的脚本

<!DOCTYPE html>
<html lang="en">
<head>
<?php
    include"head.php";
?>
<title>Find Latitude and Longitude of Draggable Marker Google Maps API</title>
</head>
<body>
<div id="infomap" style="width:300px; height:auto;overflow:auto;float:left;margin:10px;">
    <label for="latitude">
        Lat:
    </label>
    <input id="txtLat" class="form-control" type="text" style="color:red" value="" />
    <label for="longitude">
        Long:
    </label>
    <input id="txtLng" class="form-control" type="text" style="color:red" value="" />
    <label for="Place">
        Place Name:
    </label>
    <input id="txtPlc" class="form-control" type="text" value="" />
    <label for="info">
        Info:
    </label>
    <textarea id="txtInf" class="form-control" type="text" ></textarea><br />
    <button id="save" class="form-control">Save</button>
    <br />
    <br />
</div>
<div id="dvMap" style="width: auto; height: 500px; margin:10px;"></div>

<script src="../vendor/jquery/jquery.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY"></script>
<script type="text/javascript">
$(document).ready(function(){
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (p) {
            var LatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
            var lattt=LatLng.lat().toFixed(8);
            var langgg=LatLng.lng().toFixed(8)
            var mapOptions = {
                center: LatLng,
                zoom: 13,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            $("#txtLat").val(lattt);
            $("#txtLng").val(langgg);
            var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
            var marker = new google.maps.Marker({
                position: LatLng,
                map: map,
                draggable: true
            });

            google.maps.event.addListener(marker, 'dragend', function (evt) {
                var latt=evt.latLng.lat().toFixed(8);
                var langg=evt.latLng.lng().toFixed(8)
                $("#txtLat").val(latt);
                $("#txtLng").val(langg);

                map.panTo(evt.latLng);
            });

            google.maps.event.addListener(marker, "click", function (e) {
                var infoWindow = new google.maps.InfoWindow();
                infoWindow.setContent(marker.title);
                infoWindow.open(map, marker);
            });
            // centers the map on markers coords
            map.setCenter(marker.position);

            // adds the marker on the map
            marker.setMap(map);
        });
    } else {
        alert('Geo Location feature is not supported in this browser.');
    }
    $('#save').click(function(sp){
    //AJAX to save date to database
    });
});
</script>
</body>
</html>

Answer 1

我终于找到了解决问题的方法，首先，google 文件夹需要安全连接 (https)。之后，确保浏览器设置允许位置访问（GPS）然后最后一个确保手机上的 GPS 处于活动状态。

Google 带标记的地图未在 android 浏览器中显示

Google map with marker does not show in android browser

html

javascript

jquery

google-maps-markers