小册子使用骨干和要求

时间:2013-09-18 08:05:51

标签: javascript dom backbone.js

我试图在Backbone应用程序中使用Leaflet。加上AMD的需求 - 所以它不是页面中的脚本...... 我认为问题在于它无法访问页面DOM。

L.Map需要一个字符串。不是DOM ......

这是一些代码。我甚至尝试延迟几秒钟直到页面呈现。没有成功。

错误是“找不到地图容器”

   define([
      'jquery',
      'underscore',
      'backbone',
      'collections/Collection',
      'text!templates/map/Template.html',
      'libs/leaflet-markercluster/leaflet-0.6.4'
   ], function($, _, Backbone, Collection, Template, L) {
       var MapView = Backbone.View.extend({
          el : "#sub-page",
          template: _.template(Template),
          delayedRender: function() {
              try {
                  var map = this.map = new L.Map( '#map_canvas' );   
              } catch ( err ) {
                  console.log(err);
              }   
          },

          render : function() {
              this.$el.html( this.template() ); 
              setTimeout( this.delayedRender, 2 );         
          }

深入研究Leaflet L.Map构造函数会执行document.getElementById,这在AMD骨干应用程序中可能没有意义。

 return (typeof id === 'string' ? document.getElementById(id) : id);

1 个答案:

答案 0 :(得分:8)

你可能早已解决了这个问题,或者继续前进,但我遇到了同样的问题。对我而言,解决方案与Backbone无关。相反,看起来对L.map(...)的调用是在DOM准备好之前运行的。

要解决这个问题,我只是将L.map包装在一个标准的jQuery文档中。已经很好了。