谷歌地图:无法在包含数据库标记的地图中添加自动搜索选项

Google Maps: Unable to add auto search options in map contains marks from database

本文关键字:添加 地图 选项 搜索 包含 数据库 谷歌地图      更新时间:2023-09-26

我试图在谷歌地图中添加数据库中的存储标记,并自动搜索缩放特定位置的选项。

我能够从数据库中添加标记,但我无法在地图中添加自动搜索选项包含来自数据库的标记。

 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Maplocator.aspx.cs" Inherits="Maplocator" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Show/Add multiple markers to Google Maps from database in asp.net website</title>
    <style type="text/css">
        html {
            height: 100%
        }
        body {
            height: 100%;
            margin: 0;
            padding: 0
        }
        #map_canvas {
            height: 100%
        }
    </style>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MyKey&sensor=false">
    </script>
    <script type="text/javascript">
        function initialize() {
            var markers = JSON.parse('<%=ConvertDataTabletoString() %>');
            var mapOptions = {
                center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
                zoom: 5,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var infoWindow = new google.maps.InfoWindow();
            var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
            var input = (document.getElementById('txtsearch'));
            map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);
            var searchBox = new google.maps.places.SearchBox((input));

            for (i = 0; i < markers.length; i++) {
                var data = markers[i]
                var myLatlng = new google.maps.LatLng(data.lat, data.lng);
                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    title: data.title
                });

                (function(marker, data) {
                    // Attaching a click event to the current marker
                    google.maps.event.addListener(marker, "click", function(e) {
                        infoWindow.setContent(data.Descriptions);
                        infoWindow.open(map, marker);
                    });
                })(marker, data);
                google.maps.event.addListener(map, 'bounds_changed', function() {
                    var bounds = map.getBounds();
                    searchBox.setBounds(bounds);
                });
            }
        }
    </script>
</head>
<body onload="initialize()">
    <form id="form1" runat="server">
        <div style="width: 500px; height: 200px"> </div>
        <input id="txtsearch" class="apply" type="text" placeholder="Enter Search Place e.g C# Corner Noida" />
        <div id="map_canvas" style="width: 600px; height: 500px"></div>
    </form>
</body>
</html>

背后的代码:

 public string ConvertDataTabletoString()
    {
        DataTable dt = new DataTable();
        using (SqlConnection con = new SqlConnection(constr))
        {
            using (SqlCommand cmd = new SqlCommand("select title=City,lat=latitude,lng=longitude,Descriptions from LocationDetails", con))
            {
                con.Open();
                SqlDataAdapter da = new SqlDataAdapter(cmd);
                da.Fill(dt);
                System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
                List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
                Dictionary<string, object> row;
                foreach (DataRow dr in dt.Rows)
                {
                    row = new Dictionary<string, object>();
                    foreach (DataColumn col in dt.Columns)
                    {
                        row.Add(col.ColumnName, dr[col]);
                    }
                    rows.Add(row);
                }
                return serializer.Serialize(rows);
            }
        }
    }

在Place Autocomplete Results

中提到

Place Autocomplete响应不包括您可能在搜索结果或位置详细信息中看到的scope或alt_ids字段。这是因为Autocomplete只返回google作用域的位置id。它不返回尚未被Google Places数据库接受的应用范围的位置id。

另外,当你添加一个位置时,

新的地方也进入一个审核队列,以考虑谷歌地图

这意味着,你只能在自动搜索选项中看到那些添加的标记或位置,如果他们通过审核过程并被接受进入谷歌位置数据库。

重要提示:

为了使该位置更有可能通过审核过程并被添加到Google Maps数据库中,添加请求应该包含尽可能多的信息。特别是,以下字段最有可能提高通过审核过程的机会:电话号码、地址和网站。