Backbone app with Vexflow - rendering issue

[cortez]

I am building a large web application using Backbone.js, which displays a score rendered with Vexflow along with an 'analysis' of it, also using Vexflow. Each of these lives inside its own Backbone View, and both are contained within a larger application-level view as 'subviews'. The score and analysis views each have a render method which contains all the Vexflow drawing code, and the larger parent view calls each of these inside its own render method, somewhat like this:

var AppView = Backbone.View.extend({

  //...

  initialize: function() {
    this.scoreView = new ScoreView();
    this.analysisView = new AnalysisView({
      data: this.getAnalysisData()
    });
  },

  render: function() {
    this.scoreView.render();
    this.analysisView.render();
    return this;
  },

  getAnalysisData: function() {
    // Performs anaysis of this.scoreView,
    // and returns result.
  }

});

The analysis view depends on the score view for its initial data, which occurs in the parent view's initialize method, as seen above. The problem is that this data often depends on things which are only available once the score has been rendered - for example, the horizontal position of a StaveNote. I am currently working around this situation, when it occurs, by moving the analysis view setup into the render method, after the score view has been rendered. I dislike doing this, as the getAnalysisData method often involves heavy computation, and the render method should be reserved simply for rendering things, not processing.

Is there any way of avoiding this, using Vexflow? Whatever I do it seems that certain important attributes of a Vexflow score - particularly stuff relating to the positioning of notes - can only be accessed after the score has been rendered. Or am I mistaken?

Thanks,
Cortez