无法使用地理位置

时间:2017-07-30 17:46:56

标签: javascript asp.net google-maps google-maps-api-3

我按照谷歌本身关于Map API和其他来源的文档来试图弄清楚什么是错的但是经过几个小时的尝试它仍然无法工作..

有人可以指导我解决它吗?

<div class="generatedMap"></div>
                <div class="generatedMap"></div>
                <script src="//maps.googleapis.com/maps/api/js?v=3&client=gme-KEYFROMGOOGLEAPI" type="text/javascript"></script>
                <script type="text/javascript">
                    function initMap() {
                        /*var latlng = new google.maps.LatLng(latitude, longitude);
                        var mapOptions = {
                            zoom: 5,
                            center: new google.maps.LatLng(latitude, longitude)
                        }
                        map = new google.maps.Map(document.getElementById('generatedMap'), mapOptions);*/

                        var latitudeHF = document.getElementById("<%=HF_Latitude.ClientID %>");
                        var longitudeHF = document.getElementById("<%=HF_Longitude.ClientID %>");

                        var latitude = 0.0;
                        var longitude = 0.0;

                        if (latitudeHF)
                        {
                            latitude = latitudeHF.value;
                        }

                        if (longitudeHF) {
                            longitude = longitudeHF.value;
                        }

                        var map = new google.maps.Map(document.getElementById('generatedMap'), {
                            zoom: 8,
                            center: new google.maps.LatLng(latitude, longitude),
                            mapTypeId: google.maps.MapTypeId.SATELLITE
                        });

                        var marker = new google.maps.Marker({
                            position: new google.maps.LatLng(latitude, longitude),
                            map: map,
                            title: "<div style = 'height:60px;width:150px'><b>Consumer's location:</b><br />Latitude: " + latitude + "<br />Longitude: " + longitude
                        });
                    }

                    google.maps.event.addDomListener(window, 'load', initMap);
                </script>

我实际上是从我的数据库中检索保存的纬度和经度,然后将其存储到HiddenField中并从那里检索它。

foreach (DataRow r in ds.Tables[0].Rows)
        {
            accountDB = r["AccountStatus"].ToString();
            latitudeDB = Convert.ToDouble(r["Latitude"]);
            longitudeDB = Convert.ToDouble(r["Longitude"]);
            usernameDB = r["Username"].ToString();
            ipDB = r["IPAddressOfCreation"].ToString();
        }

HF_Latitude.Value = latitudeDB.ToString();
HF_Longitude.Value = longitudeDB.ToString();

我删除了Google Map API密钥以供说明..

我得到的纬度和经度都显示在图片中,但我似乎无法显示地图..

display

请欣赏任何帮助!

1 个答案:

答案 0 :(得分:2)

使用Div标记而不是class错误地将代码定义为id,需要将<script src="https://maps.googleapis.com/maps/api/js?key=Google-api-key&callback=initMap" /> 定义为属性。

你最好只使用这个脚本src for google map。

google.maps.event.addDomListener(window, 'load', initMap);

使用上面的脚本src后,从代码中删除此行。

<div class="generatedMap"></div>

代替:

<div id="generatedMap"></div>

应该是:

var map = new google.maps.Map(document.getElementById('generatedMap')

Javascript代码将保持不变。如果你想保持课程,那么在javascript中使用打击代码

代替:

var map = new google.maps.Map(document.getElementsByClassName('generatedMap')

应该是:

POST

希望这有帮助。