NVD3.js: ReferenceError: nv is not defined

问题:

I am using NVD3.js library to generate graph. I tried adding line chart into it & getting the above error. How to resolve it?

I am trying this here

回答1:

Can you post a Plunker/Fiddle? Off the top of my head, it may just be where you're including the nv.d3.js. Did you also include D3.js?

回答2:

Actually i found out, the problem was the folder structure. The examples that comes with the angular-nvd3 website gives path

bower_components/nvd3/nv.d3.js

, check in your bower_components file the actual path would be

bower_components/nvd3/build/nv.d3.js

Similarly the nv.d3.css path is NOT

bower_components/nvd3/nv.d3.css

it is,

bower_components/nvd3/build/nv.d3.css

Also, DON'T forget to add

<meta charset="utf-8">

as the first line inside your head tag..

回答3:

Did u include nv.d3.js & d3.js as the sequence of these will also cause issues Try adding d3.js first

回答4:

I had the similar problem working with ionic2 (based on Angular2).

Although all the necessary libraries were included in the index.html. The problem finaly was that the scripts has to be included before the ionic app is loaded!!!

<!-- These scripts are copied from node_modules-->
  <script src="build/d3.min.js" charset="utf-8"></script>
  <script src="build/nv.d3.min.js"></script>

<!-- Ionic's root component and where the app will load -->
  <ion-app></ion-app>

回答5:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.8.4/nv.d3.min.css"/>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.8.5/nv.d3.min.js"></script>
  
 

Add these files in your index.html

回答6:

"../node_modules/ng2-nvd3/node_modules/d3/d3.min.js",
"../node_modules/ng2-nvd3/node_modules/nvd3/build/nv.d3.min.js"

Just add above lines under scripts array in .angular-cli.json.