lundi 14 novembre 2016

Ember + local am charts integration not defined

I am struggling with adding amcharts library to my ember app. I can't user bower because I have a commercial version of the am-charts.

The chart is not displayed and the error I am getting in the terminal is:

components/quality-chart.js: line 24, col 17, 'AmCharts' is not defined.

What's interesting the chrome's javascript console doesn't report any errors.

According to the Ember's guide I should:

  1. Add my javascript to vendor's file. I did. It's there.

  2. Import the library using app.import in the ember-cli:

    var EmberApp = require('ember-cli/lib/broccoli/ember-app');
     module.exports = function(defaults) {
      var app = new EmberApp(defaults, {
        'ember-bootstrap': {
                   'importBootstrapTheme': true
               }
        // Add options here
      });
    
      app.import('vendor/charts/amcharts/amcharts.js');
      app.import('vendor/charts/amcharts/serial.js');
    
      return app.toTree();
    };
    
    
  3. In my component I am trying to add chart in the didInsertElement callback:

    import Ember from 'ember';
    
    export default Ember.Component.extend({
      chartData: function(){
         return generateChartData();
       }.property(),
    didInsertElement() {
    this._super(...arguments);
    var chartData = this.get('chartData');
    var amExport = {
      top:80,
      right:20,
      imageFileName:'sample-graph',
      buttonTitle: 'Save Chart'
    };
    
    this.set('chartData', chartData);
    
    var chart = AmCharts.makeChart("chartdiv", {
    
    
  4. Template

 
 <div class="chartDiv" style="width:500px; height:500px"></div>




Aucun commentaire:

Enregistrer un commentaire