title: Meteor.js and Google Maps
body: <p>i already included maps api into my project. Now i want to show some markers on my map.
  I initialse my map in a startup function:</p>
  
  <pre><code>Meteor.startup(function() {
  ...
  var mapOptions = {
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  
  Map = new google.maps.Map(document.getElementById("map-canvas"),
    mapOptions);  
  </code></pre>
  
  <p>Than i set the center of the map on rendering</p>
  
  <pre><code>Template.mapPostsList.rendered = function() {
  var p2 = Session.get('location');
  
  Map.setCenter(new google.maps.LatLng(p2.lat, p2.lng));
  var marker = new google.maps.Marker({
      position: new google.maps.LatLng(p2.lat, p2.lng),
      title:'Meine Position'
    });
  marker.setMap(Map);   
  </code></pre>
  
  <p>Till now everything works fine.
  Despite i have a PostCollection which contains some coordinates for me.
  I have a publish and subscribefunction. Now i want to show my posts via markers on the map.</p>
  
  <p>My first idea was to do this in my rendered function. The problem is that on initial load no posts are displayed, because my localcollection(clientside) does not contain any posts. It takes some time until posts are loaded from server.</p>
  
  <p>Thats the reason why i tried to build a helperfunction. Because the helper automatically realoads if something within my posts changes.</p>
  
  <pre><code>Template.mapPostsList.helpers({
  posts: function() {
     var allPosts = Posts.find();
     allPosts.foreach(function(post) {
        create marker and attach it to the map
        ....
        marker.setMap(Map);
     })
  </code></pre>
  
  <p>The Problem is now, that my map variable is not defined. Is there a way to define it in global scope? Why can i use my Map variable in my rendered function?
  Despite i dont like my approach to inject my markers with the helperfunction or is it the usual way?</p>
  
  <p>Can someone give me hint how to accomplish my problem?</p>