Skip to content

Commit 89b754f

Browse files
risenWrisenW
committed
Update ReadMe
1 parent ed951d8 commit 89b754f

3 files changed

Lines changed: 343 additions & 155 deletions

File tree

‎README.md‎

Lines changed: 95 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -47,8 +47,29 @@ easy and intuitive. It is heavily inspired by [Pandas](https://pandas.pydata.org
4747
- Robust data preprocessing functions like [OneHotEncoders](https://danfo.jsdata.org/api-reference/general-functions/danfo.onehotencoder), [LabelEncoders](https://danfo.jsdata.org/api-reference/general-functions/danfo.labelencoder), and scalers like [StandardScaler](https://danfo.jsdata.org/api-reference/general-functions/danfo.standardscaler) and [MinMaxScaler](https://danfo.jsdata.org/api-reference/general-functions/danfo.minmaxscaler) are supported on DataFrame and Series
4848

4949

50+
## Installation
51+
There are three ways to install and use Danfo.js in your application
52+
* For Nodejs applications, you can install the [__danfojs-node__]() version via package managers like yarn and/or npm:
5053

51-
To use Danfo.js via script tags, copy and paste the CDN below to the body of your HTML file
54+
```bash
55+
npm install danfojs-node
56+
57+
or
58+
59+
yarn add danfojs-node
60+
```
61+
For client-side applications built with frameworks like React, Vue, Next.js, etc, you can install the [__danfojs__]() version:
62+
63+
```bash
64+
npm install danfojs
65+
66+
or
67+
68+
yarn add danfojs
69+
```
70+
71+
For use directly in HTML files, you can add the latest script tag from [JsDelivr](https://www.jsdelivr.com/package/npm/danfojs) to your HTML file:
72+
<script src="https://cdn.jsdelivr.net/npm/danfojs@0.3.3/lib/bundle.min.js"></script>
5273

5374
```html
5475
<script src="https://cdn.jsdelivr.net/npm/danfojs@0.2.7/lib/bundle.min.js"></script>
@@ -57,135 +78,137 @@ See all available versions [here](https://www.jsdelivr.com/package/npm/danfojs)
5778

5879
### Example Usage in the Browser
5980

60-
> See the example below in [Code Sandbox](https://codepen.io/risingodegua/pen/bGwPGMG)
81+
> Run in [Code Sandbox](https://codepen.io/risingodegua/pen/bGwPGMG)
6182
6283
```html
6384

6485
<!DOCTYPE html>
6586
<html lang="en">
66-
<head>
67-
<meta charset="UTF-8">
68-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
69-
<script src="https://cdn.plot.ly/plotly-1.2.0.min.js"></script>
70-
<script src="https://cdn.jsdelivr.net/npm/danfojs@0.2.7/lib/bundle.min.js"></script>
87+
<head>
88+
<meta charset="UTF-8" />
89+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
90+
<script src="/Users/mac/Documents/Opensource/danfojs/src/danfojs-browser/lib/bundle.js"></script>
7191

7292
<title>Document</title>
73-
</head>
74-
75-
<body>
93+
</head>
7694

95+
<body>
7796
<div id="div1"></div>
7897
<div id="div2"></div>
7998
<div id="div3"></div>
8099

81100
<script>
82101
83-
dfd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv")
84-
.then(df => {
85-
86-
df['AAPL.Open'].plot("div1").box() //makes a box plot
102+
dfd.readCSV("https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv")
103+
.then(df => {
87104
88-
df.plot("div2").table() //display csv as table
105+
df['AAPL.Open'].plot("div1").box() //makes a box plot
89106
90-
new_df = df.set_index({ key: "Date" }) //resets the index to Date column
91-
new_df.plot("div3").line({ columns: ["AAPL.Open", "AAPL.High"] }) //makes a timeseries plot
107+
df.plot("div2").table() //display csv as table
92108
93-
}).catch(err => {
94-
console.log(err);
95-
})
109+
new_df = df.setIndex({ column: "Date", drop: true }); //resets the index to Date column
110+
new_df.head().print() //
111+
new_df.plot("div3").line({
112+
config: {
113+
columns: ["AAPL.Open", "AAPL.High"]
114+
}
115+
}) //makes a timeseries plot
96116
117+
}).catch(err => {
118+
console.log(err);
119+
})
97120
</script>
98-
99-
</body>
100-
121+
</body>
101122
</html>
123+
102124
```
103125

104126
Output in Browser:
105127

106128
![](assets/browser-out.gif)
107129

108-
## How to install
109-
Danfo.js is hosted on NPM, and can installed via package managers like npm and yarn
110-
111-
```sh
112-
npm install danfojs-node
113-
```
114-
115130
### Example usage in Nodejs
116131

117132
```javascript
118133

119134
const dfd = require("danfojs-node")
120135

136+
const file_url = "https://web.stanford.edu/class/archive/cs/cs109/cs109.1166/stuff/titanic.csv"
137+
dfd.readCSV(file_url)
138+
.then(df => {
139+
//prints the first five columns
140+
df.head().print()
141+
142+
// Calculate descriptive statistics for all numerical columns
143+
df.describe().print()
121144

122-
dfd.read_csv("https://web.stanford.edu/class/archive/cs/cs109/cs109.1166/stuff/titanic.csv")
123-
.then(df => {
124-
//prints the first five columns
125-
df.head().print()
145+
//prints the shape of the data
146+
console.log(df.shape);
126147

127-
//Calculate descriptive statistics for all numerical columns
128-
df.describe().print()
148+
//prints all column names
149+
console.log(df.columns);
129150

130-
//prints the shape of the data
131-
console.log(df.shape);
151+
// //prints the inferred dtypes of each column
152+
df.ctypes.print()
132153

133-
//prints all column names
134-
console.log(df.column_names);
154+
//selecting a column by subsetting
155+
df['Name'].print()
135156

136-
//prints the inferred dtypes of each column
137-
df.ctypes.print()
157+
//drop columns by names
158+
cols_2_remove = ['Age', 'Pclass']
159+
df_drop = df.drop({ columns: cols_2_remove, axis: 1 })
160+
df_drop.print()
138161

139-
//selecting a column by subsetting
140-
df['Name'].print()
141162

142-
//drop columns by names
143-
cols_2_remove = ['Age', 'Pclass']
144-
df_drop = df.drop({ columns: cols_2_remove, axis: 1 })
145-
df_drop.print()
163+
//select columns by dtypes
164+
let str_cols = df_drop.selectDtypes(["string"])
165+
let num_cols = df_drop.selectDtypes(["int32", "float32"])
166+
str_cols.print()
167+
num_cols.print()
146168

147169

148-
//select columns by dtypes
149-
let str_cols = df_drop.select_dtypes(["string"])
150-
let num_cols = df_drop.select_dtypes(["int32", "float32"])
151-
str_cols.print()
152-
num_cols.print()
170+
//add new column to Dataframe
153171

172+
let new_vals = df['Fare'].round(1)
173+
df_drop.addColumn("fare_round", new_vals, { inplace: true })
174+
df_drop.print()
154175

155-
//add new column to Dataframe
156-
let new_vals = df['Fare'].round().values
157-
df_drop.addColumn({ column: "fare_round", value: new_vals})
158-
df_drop.print()
176+
df_drop['fare_round'].round(2).print(5)
159177

160-
df_drop['fare_round'].print(5)
178+
//prints the number of occurence each value in the column
179+
df_drop['Survived'].valueCounts().print()
161180

162-
//prints the number of occurence each value in the column
163-
df_drop['Survived'].value_counts().print()
181+
//print the last ten elementa of a DataFrame
182+
df_drop.tail(10).print()
164183

165-
//print the last ten elementa of a DataFrame
166-
df_drop.tail(10).print()
184+
//prints the number of missing values in a DataFrame
185+
df_drop.isNa().sum().print()
167186

168-
//prints the number of missing values in a DataFrame
169-
df_drop.isna().sum().print()
187+
}).catch(err => {
188+
console.log(err);
189+
})
170190

171-
}).catch(err => {
172-
console.log(err);
173-
})
174191

175192
```
176193
Output in Node Console:
177194

178195
![](assets/node-rec.gif)
179-
180-
> If you want to use Danfo in frontend frameworks like React/Vue, read this [guide](https://danfo.jsdata.org/examples/using-danfojs-in-react)
181-
182-
#### You can play with Danfo.js on Dnotebooks playground [here](https://playnotebook.jsdata.org/demo)
196+
## Notebook support
197+
* You can use Danfo.js on Dnotebooks playground [here](https://playnotebook.jsdata.org/demo)
198+
* VsCode nodejs notebook extension now supports Danfo.js. See guide [here](https://marketplace.visualstudio.com/items?itemName=donjayamanne.typescript-notebook)
183199

184200
#### [See the Official Getting Started Guide](https://danfo.jsdata.org/getting-started)
185201

186202
## Documentation
187203
The official documentation can be found [here](https://danfo.jsdata.org)
188204

205+
## Danfo.js Official Book
206+
207+
![image](https://user-images.githubusercontent.com/29900845/134811659-25ff6b05-8e0d-415f-a60c-03ab1d33fd71.jpeg)
208+
209+
210+
We recently published a book titled "Building Data Driven Applications with Danfo.js". Read more about it [here](https://danfo.jsdata.org/building-data-driven-applications-with-danfo.js-book)
211+
189212
## Discussion and Development
190213
Development discussions take place [here](https://github.com/opensource9ja/danfojs/discussions).
191214

@@ -196,4 +219,4 @@ All contributions, bug reports, bug fixes, documentation improvements, enhanceme
196219

197220
#### Created by [Rising Odegua](https://github.com/risenW) and [Stephen Oni](https://github.com/steveoni)
198221

199-
<a href="https://www.producthunt.com/posts/danfo-js?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-danfo-js" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=233871&theme=light" alt="Danfo.js - Open Source JavaScript library for manipulating data. | Product Hunt Embed" style="width: 250px; height: 54px;" width="250px" height="54px" /></a>
222+
<a href="https://www.producthunt.com/posts/danfo-js?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-danfo-js" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=233871&theme=light" alt="Danfo.js - Open Source JavaScript library for manipulating data. | Product Hunt Embed" style="width: 250px; height: 54px;" width="250px" height="54px" /></a>

0 commit comments

Comments
 (0)