简体   繁体   中英

leaflet.js map not showing with meteor.

This is the code that I have in my js file.

if (Meteor.isClient) {
  Template.map.rendered = function(){
  var map = L.map('map').setView([51.505, -0.09], 13);
  var osmUrl='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
  var osmAttrib='Map data © OpenStreetMap contributors';

  console.log("RENDERED CALLED");
  var osm = new L.TileLayer(osmUrl, {minZoom: 8, maxZoom: 12, attribution: osmAttrib});   
  map.setView(new L.LatLng(51.3, 0.7),9);
  map.addLayer(osm);
};
}

This is my html -

<head>

WhatsGoingOn

<body>
  {{> map}}
</body>

<template name="map">
  {{#constant}}
      <div id="map" class="map"></div>
  {{/constant}}
</template>

I looked at the page in console - the template is being appended, and there are leaflet dom elements. However, I can't see a map.

Why?

您是否尝试过将库置于客户端/兼容性下?

Set map height properly. For example:

<div id="map" class="map" style="height: 100px;"></div>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM