How to use external JS libraries


#1

I am new to ember and embercli. What is the best way to use other libraries with ember. I need to initialise some stuff when page loads. Googling told me that I should insert other JS code for initialisation after page load in didInsertElement of the View. I tried that with some JQuery code and it worked nicely but with Rickshaw (graphs) I have errors like this “Uncaught TypeError: Cannot read property ‘Fixtures’ of undefined”. The code is bellow.

export default Ember.View.extend({
  templateName: 'dashboard',

  didInsertElement: function () {
    this._super();
    Ember.run.scheduleOnce('afterRender', this, function () {
      var random = new this.Rickshaw.Fixtures.RandomData(50);
//some other code

Btw, Rickshaw is imported as all other JS stuff with app.import(‘vendor/io.revox.pages/assets/plugins/rickshaw/rickshaw.min.js’);


#2

Where are the Fixtures coming from?


#3

From Rickshaw. But it does not matter it complains on everything with the same error message whatever I use in Rickshaw.<whatever>

I looked in packaged vendor.js and there are variables ‘Rickshaw.Graph’, ‘Rickshaw.Fixtures’, etc. Can it be some namespace problem, or something with method chaining?


#4
export default Ember.View.extend({
  templateName: 'dashboard',

  didInsertElement: function () {
    this._super();
    Ember.run.scheduleOnce('afterRender', this, function () {
      var random = new this.Rickshaw.Fixtures.RandomData(50);
//some other code

Did you try removing this in this.Rickshaw? I think Rickshaw is a global.


#5

I tried that also, and Ember.Rickshaw, I lost few hours and many nerves. But, I fixed it by restarting the computer, deleting ‘node_modules’ folder and running ‘npm install’ again :scream: Why would that fix my problem I do not know. Did you encounter such strange behaviour before which could be ‘fixed’ like this? So I can keep that in mind.