bugfix> javascript > 投稿

私はjavascriptを使用してジオロケーションを使用してユーザーの位置を取得しようとしていますしかし、私は座標変数をC#オブジェクトラベルに取得しようとすると、その何でも返します。以下は私のJavaScriptです。

 <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=ABC"></script>
    <script type="text/javascript">
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function (p) {
                var LatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
                var mapOptions = {
                    center: LatLng,
                    zoom: 20,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
                var marker = new google.maps.Marker({
                    position: LatLng,
                    map: map,
                    title: "<div style = 'height:60px;width:200px'><b>Your location:</b><br />Latitude: " + p.coords.latitude + "<br />Longitude: " + p.coords.longitude,
                });
                google.maps.event.addListener(marker, "click", function (e) {
                    var infoWindow = new google.maps.InfoWindow();
                    infoWindow.setContent(marker.title);
                    infoWindow.open(map, marker);
                  //  document.getElementById("latitude").value = p.coords.latitude;
                 //   document.getElementById("longitude").value = p.coords.latitude;
                });
                var longitude = document.getElementById('latitude'),
                    latitude =  document.getElementById('longitude');
                function GetPosition(p) {
                    var long = p.coords.longitude,
                        lat = p.coords.latitude
                    longitude.text(long);
                    latitude.text(lat);
                }
            });
        } else {
            alert('Location feature is not supported in this browser.');
        }
    </script>

そして体

<div>
            <div id="dvMap" style="width: 500px; height: 500px"></div>
            <asp:Label ID="latitude" runat="server"></asp:Label>
            <asp:Label ID="longitude" runat="server"></asp:Label>
        </div>

また、GeoCoordinateWatcherを試してみましたが成功しませんでした。ユーザーの位置を取得できる他の関数があります。前もって感謝します。

回答 1 件
  • @NAJEEB、以下のソリューションで試してください

    <!DOCTYPE html>
    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <script src="https://maps.googleapis.com/maps/api/js?key=ABC&callback=myMap"></script>
        <script type="text/javascript">
        $(document).ready(function(){
          var longitude = $('#longitude');
           var latitude = $('#latitude');
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function (p) {
                 console.log(longitude);
                        longitude.text(p.coords.longitude);
                        latitude.text(p.coords.latitude);
                    var LatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
                    var mapOptions = {
                        center: LatLng,
                        zoom: 20,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                    };
                    var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
                    var marker = new google.maps.Marker({
                        position: LatLng,
                        map: map,
                        title: "<div style = 'height:60px;width:200px'><b>Your location:</b><br />Latitude: " + p.coords.latitude + "<br />Longitude: " + p.coords.longitude,
                    });
                    google.maps.event.addListener(marker, "click", function (e)                 {
                        var infoWindow = new google.maps.InfoWindow();
                        infoWindow.setContent(marker.title);
                        infoWindow.open(map, marker);
                    });
                });
            } else {
                alert('Location feature is not supported in this browser.');
            }
            });
        </script>
    <title>Page Title</title>
    </head>
    <body>
     <div>
      <label ID="latitude"></label>
     <label ID="longitude"></label>
     <br/>
     <div id="dvMap" style="width: 500px; height: 500px"></div>
     </div>
    </body>
    </html>
    
    

あなたの答え