无法解决MissingKeyMapError google API

时间:2016-08-02 21:19:44

标签: asp.net maps

继续获取Missing Key错误,基本上我在aspx页面上从隐藏列读取纬度和经度值,将它们发送到.JS文件。

function showMap(param1, param2) {
    var strURL = "ShowSegmentOnMap.aspx?string1=" + param1 + "&string2=" + param2 + "";
    var mywindow = window.open(strURL, "", "width=1200,height=800,scrollbars=1,resizable=1,top=10,left=200");
}

然后将lat long传递给第二个aspx页面,假设只是使用lat和long将Pin放在地图上。我现在已经硬编码了lat long值...只是试着把地图拿出来而没有运气



<script src="http://maps.googleapis.com/maps/api/js?key=MY_KEY"></script>
    
 <script>
     //var latValue = document.getElementById('lblsegment1');
     //var longValue = document.getElementById('lblsegment2');
        var latValue = 40.76;
        var longValue = 111.89;
        var map;
            function initMap() {
                var mapProp = {
                    center: new google.maps.LatLng(latValue, longValue),
                    zoom: 7,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
            }
            
     
            function loadScript() {
                var script = document.createElement("script");
                script.type = "text/javascript";
                script.src = "http://maps.googleapis.com/maps/api/js?callback=initMap";
                document.body.appendChild(script);
            }

            window.onload = loadScript;
    </script>
&#13;
    <div style="width:100%; height:100%">
    <div id="googleMap"></div></div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

<script>

        $(document).ready(function () {

            var latValue = document.getElementById('hflat').value;

            var longValue = document.getElementById('hflng').value;

            console.log(latValue);

            var map;

            initMap();

            function initMap() {

                position = { lat: 40.72072, lng: -111.901066 };

                map = new google.maps.Map(document.getElementById("map"), {
                    zoom: 15,
                    zoomEnd: function (e) { console.log(e.sender.zoom()); },
                    center: position,
                    mapTypeId: google.maps.MapTypeId.HYBRID

                });

                marker = new google.maps.Marker({
                    position: position,
                    map: map,
                    draggable: true,
                });

                map.setCenter(marker.position);

                marker.setMap(map);
            }
        });
              

    </script>
<body>
    <form id="form1" runat="server">
        <div style="width: 100%; height: 100%">
            <div id="map" class="col-sm-12" style="width: 95%; height: 95%;">Map</div>
        </div>

        <asp:HiddenField ID="hflat" runat="server" />
        <asp:HiddenField ID="hflng" runat="server" />
    </form>
</body>