using dataforge in angular

[capaneus]

hi Ashley,
I'm building an angular 6 application recently and was looking for some data processing lib. So happy to find data-forge as I used pandas and it's a great lib on python.
Would you mind put some instruction on how to import data-forge into angular to be used there?

[ashleydavis]

Hi, I haven't used AngularJS since version 1, so please be aware that any instructions I have for you might be out of date.

For a start, Data-Forge is TypeScript so you might just be able to install it via npm then import it into your AngularJS app as you would any other TypeScript module.

I've used Data-Forge when I've made apps using AngularJS v1+ and I do have some instructions that will work for that.

Browser installation: https://github.com/data-forge/data-forge-ts/blob/master/docs/guide.md#browser-installation-and-setup

AngularJS v1+ usage: https://github.com/data-forge/data-forge-ts/blob/master/docs/guide.md#working-with-http-in-angularjs

Hope this helps. Please let me know how it goes. Maybe you could help me update the instructions noce you figure it out?

[yiu31802]

This worked perfectly to me, this lib can be "the" de-facto standard of dataframe in Angular! Thank you @ashleydavis so much, I will try to spread this library within my team:-)

import { DataFrame } from 'data-forge'

@Component({
selector: 'app-top',
templateUrl: './main.html',
styleUrls: ['./main.css']
})
export class TopPageComponent implements OnInit {


public constructor(
){}

public ngOnInit(): void {
    let df = new DataFrame({
        columns: {
            'regiment': ['Nighthawks', 'Nighthawks', 'Nighthawks', 'Nighthawks', 'Dragoons', 'Dragoons', 'Dragoons', 'Dragoons', 'Scouts', 'Scouts', 'Scouts', 'Scouts'],
            'company': ['1st', '1st', '2nd', '2nd', '1st', '1st', '2nd', '2nd','1st', '1st', '2nd', '2nd'],
            'TestScore': [4, 24, 31, 2, 3, 4, 24, 31, 2, 3, 2, 3]
        }
    });
    const pivotted = df.pivot(["regiment", "company"], "TestScore", testScores => testScores.average());
    console.log(pivotted.toArray())

[ashleydavis]

Thanks mate! I'll add that to the docs.

Don't forget to star the repo.

You might also be interested to know that I'm writing a book on working with data in JavaScript. Please help spread the word!

[capaneus]

nah, I'm not super lucky :-(
@yiu31802, do you mind share a bit more how you setup it in the project? I tried different options, it gives me:

ERROR in ./node_modules/data-forge/build/index.js
Module not found: Error: Can't resolve 'fs' in 'E:\MyCode\flaskagular\project_planning\app\static\node_modules\data-forge\build'
ERROR in ./node_modules/data-forge/build/lib/dataframe.js
Module not found: Error: Can't resolve 'fs' in 'E:\MyCode\flaskagular\project_planning\app\static\node_modules\data-forge\build\lib'

and did some search seems it's normal for angular to not support fs...
angular/angular-cli#8272

how did you solve this problem?

[yiu31802]

Hi, @capaneus
Weird, I have not met that error at all. My environment is Angular 5.0.5. But it makes also sense that Angular should not support fs in the browser... I will check my environment later and update you.

[ashleydavis]

Yeah you can't load files from the file system when running in the browser (whether you are using AngularJS, React, etc doesn't matter).

You can only use the readFile/writeFile functions under Node.js.

Don't use those functions in your code and it should work under AngularJS for you.

[capaneus]

hi Ashley,
thanks and back to js again :-) I actually didn't use any of the fs function in the code, what I used to test is the code from yiu31802. It comes at the compiling phase, seems it complained about something in dataframe.js which I haven't triggered at all...

[ashleydavis]

That's odd. Can you please give me more information about how you are compiling it?

[ashleydavis]

Please give me more information about how you are trying to use Data-Forge with AngularJS. Otherwise I'll close this issue.

[maykon-oliveira]

I have de same problem!
ERROR in ./node_modules/data-forge/build/index.js Module not found: Error: Can't resolve 'fs' in 'C:\Users\Maykon Oliveira\Documents\analise-das-escolas\node_modules\data-forge\build' ERROR in ./node_modules/data-forge/build/lib/dataframe.js Module not found: Error: Can't resolve 'fs' in 'C:\Users\Maykon Oliveira\Documents\analise-das-escolas\node_modules\data-forge\build\lib'

I don't know what I do, I need this library. Has anyone managed to solve it?

[ashleydavis]

Please share the broken code with me on github so I can run it and debug.

[maykon-oliveira]

The project repository
I'm at the beginning

[ashleydavis]

@maykon-oliveira I got your code, installed dependencies and then ran it using npm start.

I see a bunch of errors in the console, but I don't think any of them relate to Data-Forge.

Can you give me more information about the problem you are experiencing?