Question

我想在我的meteor应用程序中添加一个地理位置功能，它只显示错误，我在这里搜索过，但找不到任何合适的答案。我还添加了meteor add mdg:geolocation包

 <!--html part-->
  <head>
  <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=YOUR_API_KEY&sensor=false"></script>
     <script type="text/javascript">initMap = function(){
        console.log("*** Map  Start ********")
                var mapOptions = {
                  center: new google.maps.LatLng(-34.397, 150.644),
                  zoom: 8,
                  mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("map-canvas"),
                    mapOptions);
                console.log("*** Map  end ********")
        }


    </script> 
    </head>


  <template name="map">  
  <div id="map-canvas"></div>
  </template>

的客户机/ main.js

if(Meteor.isClient)
{
     Template.map.rendered = function(){

    var successHandler = function(position) {
      Session.set('lat', position.coords.latitude);
      Session.set('lon', position.coords.longitude);
    };

    var errorHandler = function (errorObj) {
      alert(errorObj.code + ": " + errorObj.message);

      Session.set('lat',22.0546106 );
      Session.set('lon',88.3939791);

    };

    navigator.geolocation.getCurrentPosition(
        successHandler, errorHandler,
        {timeout: 20000, enableHighAccuracy: true, maximumAge: 10000});
  }

  Tracker.autorun(function(){
    initMap();
  });
}


if (Meteor.isServer) {
         Meteor.startup(function () {
        // code to run on server at startup
        });
        }

        initMap = function() {
        console.log("***** Start *****");
        var mapOptions = {
        center: new google.maps.LatLng(Session.get('lat'),Session.get('lon')),
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
        console.log("***** End *****");
        }

Router.route('map');

的客户机/的main.css

#map-canvas { 
width: 100%; 
height: 300px; 
}

控制台中显示错误

"*** Map Start ********" map:9 TypeError: a is null js:80 Use of getPreventDefault() is deprecated. Use defaultPrevented instead. map "Google Maps API warning: InvalidKey https://developers.google.com/maps/documentation/javascript/error-messages#invalid-key" util.js:210 "Google Maps API warning: SensorNotRequired https://developers.google.com/maps/documentation/javascript/error-messages#sensor-not-required" util.js:210

Meteor App中的谷歌地图

0 个答案: