0

I have an angular2 application where i wish to use rickshaw. This requires the following: d3, nvd3 and ng2-nvd3. I have these in my lib folder:

enter image description here

And my systemjs.config.js map looks as follows:

enter image description here

However, when run this i get an error: enter image description here

telling me it has not been implemented. Can someone please tell me what i´m missing?

Thanks in advance.

kodeaben
  • 1,829
  • 3
  • 24
  • 33
  • What build/bundling tool are you using? Are you sure those files are getting bundled up in your application? Take a look at the network section, is there an attempt to load the nv.d3.js file that fails or is there no attempt to load the file at all? – Pace Jul 28 '16 at 13:58
  • Hello. there are no attempt to load said file. Where am i to include this? – kodeaben Aug 02 '16 at 07:13
  • If there is no attempt at all do you have any import statement for nvd3? – Pace Aug 02 '16 at 10:21
  • Yes. ng2-nvd3 has been imported. I have followed this https://github.com/krispo/ng2-nvd3 – kodeaben Aug 02 '16 at 11:13
  • Ok, well the line `import {nvD3} from 'ng2-nvd3'` should trigger a lookup of some kind of file. Can you debug at that line and look at the network tab's list of files both before and after that line to see what gets fetched as a result of that call? – Pace Aug 02 '16 at 11:37
  • hi. thanks for all your help. I the erorr was my understanding of systemjs. I have included to my index.html, though i´m not sure this is the right way... – kodeaben Aug 03 '16 at 04:50
  • It isn't really the right way. You shouldn't have to use script elements. The `import` call should trigger a fetch of those `.js` files for you. Some frameworks may break at production if they do something like bundle all of your vendor `.js` files into a single file. – Pace Aug 03 '16 at 17:57
  • Specifically, `import {nvD3} from 'ng2-nvd3'` should compile down to something like `var nvd3_1 = require('ng2-nvd3');` The require statement should then trigger a lookup through SystemJS to fetch the appropriate files. However, I have noticed that your script tag is referencing `lib/ng2-nvd3/build/nv.d3.js` while your `system-config.ts` appears to be setup to look for `lib/ng2-nvd3` and is missing the `build` part of the path. Although I have no idea if you have some `packages` configuration later in your `system-config.ts` that addresses this. – Pace Aug 03 '16 at 18:05

1 Answers1

0

adding

lib/ng2-nvd3/node_modules/d3/d3.js
lib/nvd3/build/nv.d3.js

to the index.html solved my problem. I´m however not sure this is the right way to do this.

kodeaben
  • 1,829
  • 3
  • 24
  • 33