javascript - BackboneJS。加载 View 后如何向 View 添加历元图

我正在将BackboneJS和RequireJS一起使用，并且我想向视图添加纪元图。

是）我有的：

我的视图模板是：

<h1>Charts</h1>
<div id="gaugeChart" class="epoch gauge-small"></div>

我的路由器

showChart: function(){
  $('#page-wrapper').html(new ChartsView().el);
}

我的看法

/*global define*/
define([
  'jquery',
  'underscore',
  'backbone',
  'handlebars',
  'd3',
  'epoch',
  'text!templates/Charts.html'
], function($, _, Backbone, Handlebars, d3, epoch, templateSource) {
  var ChartsView = Backbone.View.extend({

    template: Handlebars.compile(templateSource),

    events: {
      'click #gaugeChart': 'hasRendered'
    },

    initialize: function() {
      this.render();
    },

    render: function() {
      this.$el.append(this.template());
      return this;
    },

    hasRendered: function() {
      $('#gaugeChart').epoch({
        type: 'time.gauge',
        domain: [1, 100],
        format: function(v) {
          return v.toFixed(0);
        },
        value: 1
      });

    }
  });
  return ChartsView;
});

在上面的Backbone视图中，我在#gaugeChart元素上有一个click事件，此方法有效，但是如何触发load事件，以便在视图加载后可以调用JavaScript函数来添加历元图。
渲染功能完成后，我尝试触发hasRendered功能，但这不起作用。

最佳答案

最简单的方法可能是通过使用超时来延迟图表的呈现，以使其在呈现功能完成后执行。例如

render: function() {
      this.$el.append(this.template());

      setTimeout(function () {
        $('#gaugeChart').epoch({
             type: 'time.gauge',
             domain: [1, 100],
             format: function(v) {
               return v.toFixed(0);
              },
          value: 1
        });
      },0);

      return this;
    },

或者，您可以采取的另一种方法是让路由器在将el附加到DOM后调用视图的某种方法来呈现Epoch图表，或触发事件，您的视图将使用该方法来呈现图表。

例如

showChart: function(){
     var chartView = new ChartsView();
    $('#page-wrapper').html(chartView .el);

  //render chart directly
   chartView.renderChart(); //this assumes there is a "renderChart" method in your view
   //or trigger some event for view to respond to
  //chartView.trigger('atachedToDom'); //with your view subscribing to this event
}

关于javascript - BackboneJS。加载 View 后如何向 View 添加历元图，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31162924/