2017-02-22 20 views
0

ユーザーの現在地の地図を表示して中心化しようとしています。ハードコードされた緯度と経度を手動で入力するとすべて正常に機能しますが、これらは1人のユーザーが場所を変更することが多いため、動的である必要があります。JavaScriptでの参照による変数の受け渡し

私は基本的な間違いをしていると思われますが、私の論理は正しいと思われます。私の仕事をチェックし、私が間違っていることを教えてください。緯度と経度で注目されている行は、ハードコードされた値を持つ前の行の代わりに使用したい行です。

<!DOCTYPE html> 
<html> 
<head> 
    <title>W123</title> 
    <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> 

</head> 

<body> 
    <div id='printoutPanel'></div> 
    <div id='myMap' style='width: 100vw; height: 100vh;'></div> 

    <script type='text/javascript'> 

     function showlocation() { 
      navigator.geolocation.getCurrentPosition(getLocation); 
     } 

     function getLocation(position) { 
      var latitude = position.coords.latitude; 
      var longitude = position.coords.longitude; 
      } 

     function loadMapScenario() { 
      var mapOptions = { 
       credentials: 'My API key code goes here', 
       center: new Microsoft.Maps.Location(39.1887643719098, -92.8261546188403), 
       //center: new Microsoft.Maps.Location(latitude, longitude), 
       mapTypeId: Microsoft.Maps.MapTypeId.road, 
       zoom: 8 
      }; 

      var map = new Microsoft.Maps.Map(document.getElementById('myMap'), mapOptions); 
      var urlTemplate = 'http://mesonet.agron.iastate.edu/cache/tile.py/1.0.0/nexrad-n0q-{timestamp}/{zoom}/{x}/{y}.png'; 
      var timestamps = ['900913-m50m', '900913-m45m', '900913-m40m', '900913-m35m', '900913-m30m', '900913-m25m', '900913-m20m', '900913-m15m', '900913-m10m', '900913-m05m', '900913']; 
      var tileSources = []; 
      for (var i = 0; i < timestamps.length; i++) { 
       var tileSource = new Microsoft.Maps.TileSource({ 
        uriConstructor: urlTemplate.replace('{timestamp}', timestamps[i]) 
       }); 
       tileSources.push(tileSource); 
      } 
      var animatedLayer = new Microsoft.Maps.AnimatedTileLayer({ mercator: tileSources, frameRate: 500 }); 
      map.layers.insert(animatedLayer); 
     } 

    </script> 
    <script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=experimental&callback=loadMapScenario' async defer></script> 
</body> 
</html> 
+2

タイトルを「Javascriptで変数を渡す」に変更できますか? JavaとJavascriptは同じものではありません。 –

答えて

0

は、あなたが「mapUserLocation」などの新機能にBingのマップであなたのコールバックを変更

function loadMapScenario(latitude,longitude) { 
     ....your code here.... 
} 

の下に見られるように、あなたのloadMapScenario関数に緯度と経度を渡し含めるその後、mapUserLocationを行う必要があり次のタスク

function mapUserLocation() { 
    // code here to get the latitude and longitude from users position 
    loadMapScenario(latitude,longitude); 
} 
+0

正しく理解すれば、私が緯度と経度を取得するために使用している関数は間違った場所にあります。私はこれを "function loadMapScenario"関数の中に移動する必要がありますか? –

+0

私があなたが言っていたことを理解し、それが私の問題を解決しました。今は私にとってうまくいきます。どうもありがとうございます!! –

+0

@CarlAydelotte - 申し訳ありませんが、私はあなたの最初のコメントをすぐには見ませんでした。喜んでそれはあなたのために働いています、喜んで:) – Phil

関連する問題