0

I'm trying to implement this Angular-nvD3 chart. So far I have the following code:

in my main index.html I have the following scripts included:

    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/d3/d3.js"></script>
    <script src="bower_components/nvd3/nv.d3.js"></script>
    <script src="bower_components/angular-nvd3/dist/angular-nvd3.js"></script>
    <script src="bower_components/angularjs-nvd3-directives/dist/angularjs-nvd3-directives.js"></script>

Controller:

'use strict';

/**
* @ngdoc function
* @name myApp.controller:DashboardCtrl
* @description
* # DashboardCtrl
* Controller of the myApp
*/
angular.module('myApp')
  .controller('DashboardCtrl', function ($scope) {
   // init data and option params for the chart
});

Apps:

var myApp= angular
  .module('myApp', ["nvd3"])

HTML view:

<div ng-app="myApp">
    <div ng-controller="DashboardCtrl">
        <nvd3 options="options" data="data"></nvd3>
    </div>
</div>

I hope that I include all relevant parts.

When I run my UI app I'm getting this error:

Error: [$injector:nomod] Module 'nvd3' is not available

Any ideas what am I missing?

Anton Belev
  • 11,963
  • 22
  • 70
  • 111

1 Answers1

0

Answered here: https://stackoverflow.com/a/37196430/3414722

This is a missing dependency issue of javascript. In your index.html, load your app.js after you load the the external libraries, because angular module isn't able to instantiate the nvd3 module because it isn't there.

Community
  • 1
  • 1
sammalfix
  • 310
  • 4
  • 9