0

嗨，我正在制作一个简单的应用程序来显示带有流星的传单地图。

这个简单的例子不起作用

testApp.html ：

<head>
  <title>testApp</title>
</head>

<body>
  <h1>Hello World!</h1>
  <div id="map"></div>
</body>

testApp.js

if (Meteor.isClient) {
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';
  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);

}

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

它给了我 Uncaught TypeError: Cannot read property '_leaflet' of null

如果我在控制台中编写相同的代码，地图就会显示。

谢谢您的帮助

4

2 回答 2

4

您需要将地图渲染代码放在一个回调中，该回调将在模板渲染时运行

Template.nameofyourtemplate.rendered = function() { //map code }

像下面这样包装你的地图 div

<template name='nameofyourtemplate'>
 {{#constant}}
   <div id='map'></>
 {{/constant}}
<template>

将地图模板与 HTML 正文分开

<body>
 <{{> nameofyourtemplate>}}
</body>
于 2013-05-15T18:37:16.333 回答
0

您需要如下包装您的地图 div

{{#constant}}
  <div id="map"></div>
{{/constant}}
于 2013-05-15T18:09:52.670 回答