Googleマップでユーザーの一般的な位置を取得する

Question

私はユーザーの一般的な場所を取得しようとしていますが、理由は関係ありませんが、APIを使用して場所を取得することはできません。私は、IPに関連付けられたデータを解析しようとしましたが、initMap（）関数の外に$ .getJson（）がある場合、変数は変更されず、initMap（）、initMap関数として認識される。

tl：dr - 私はinitMap（）関数の中から$ .getJSONをどのように呼び出すのですか？

は、ここで私が試した何：

<div id="map" style="width: 100%; height: 100%;; "></div> 
     <!-- G-Maps box-sizing: border-box; --> 

     <script> 
      var usrLat = 0; 
      var usrLon = 0; 

      function initMap() { 
       var map = new google.maps.Map(document.getElementById('map'), { 
        zoom: 6, 

        $.getJSON("https://freegeoip.net/json/", function (data) { 
             usrLat = parseFloat(data.latitude); 
             usrLon = parseFloat(data.longitude); 
             console.log(usrLon + ", " + usrLat); 
             }); 

        center: {lat: usrLat, lng: usrLon}, 
        mapTypeControl: true, 
        scrollwheel: false, 
        navigationControl: false, 
        mapTypeControl: false, 
        scaleControl: false, 
        draggable: false, 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        disableDefaultUI: true, 
        mapTypeControlOptions: { 
        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU, 
        mapTypeIds: ['roadmap', 'terrain'] 
        } 
       }); 
      } 
     </script> 

Answer 1

あなたの問題は、（データ構造内部の）お電話の位置、プラスコールの終わりにセミコロンです。

は

<div id="map" style="width: 100%; height: 100%;; "></div> 
    <!-- G-Maps box-sizing: border-box; --> 

    <script> 
     var usrLat = 0; 
     var usrLon = 0; 

     function initMap() { 

      $.getJSON("https://freegeoip.net/json/", function (data) { 
            usrLat = parseFloat(data.latitude); 
            usrLon = parseFloat(data.longitude); 
            console.log(usrLon + ", " + usrLat); 
            }); 
      var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 6, 
       center: {lat: usrLat, lng: usrLon}, 
       mapTypeControl: true, 
       scrollwheel: false, 
       navigationControl: false, 
       mapTypeControl: false, 
       scaleControl: false, 
       draggable: false, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
       disableDefaultUI: true, 
       mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.DROPDOWN_MENU, 
       mapTypeIds: ['roadmap', 'terrain'] 
       } 
      }); 
     } 

    </script> 

Answer 2

がそれを整理代わりにこれを試してみてください。

<script> 
      var usrLat = 0; 
      var usrLon = 0; 


      $.getJSON("https://freegeoip.net/json/", function (data) { 
       var map = new google.maps.Map(document.getElementById('map'), { 
         zoom: 8, 
         center: {lat: parseFloat(data.latitude), lng: parseFloat(data.longitude)}, 
         mapTypeControl: true, 
         scrollwheel: false, 
         navigationControl: false, 
         mapTypeControl: false, 
         scaleControl: false, 
         draggable: false, 
         mapTypeId: google.maps.MapTypeId.ROADMAP, 
         disableDefaultUI: true, 
         mapTypeControlOptions: { 
          style: google.maps.MapTypeControlStyle.DROPDOWN_MENU, 
          mapTypeIds: ['roadmap', 'terrain'] 
         } 
       }); 
      }); 
     </script>