CODEWITHSUNDEEP
meteor
Nathan
Nathan

Reputation: 470

Rendering map with 'googlemaps' package

I'm using the googlemaps package and I'm unable to get the map to render.

main.html contains: 

<body>
    <div id="map-canvas"></div>
</body>

and main.js contains:

GoogleMaps.init(
    { ... });

Everything is set correctly (API Key, mapOptions, etc.) but the map is not rendering. What am I missing? Thanks.

Upvotes: 1

Views: 60

Answers (1)

Tarang
Tarang

Reputation: 75955

The reason this does not work is when the JS runs, the HTML may not be drawn yet. This style should work instead which waits for the DOM to be drawn, then inits the map.

<body>
    {{>mapTemplate}}
</body>

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

Then your JS

Template.mapTemplate.rendered = function() {
    GoogleMaps.init(
    { ... });
}

An alternative to not splitting your map into mapTemplate is to init your map in the UI.body.rendered callback

Upvotes: 1

Related Questions