example-sort
This commit is contained in:
parent
15c8071586
commit
34938cc39a
@ -79,6 +79,31 @@ complete filter would be:
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
```
|
||||
|
||||
### Sorting by First Term
|
||||
|
||||
The dataset is sorted in chronological order by the first presidential or vice
|
||||
presidential term. The Vice President and President in a given term are sorted
|
||||
alphabetically. Joe Biden and Barack Obama were Vice President and President
|
||||
respectively in 2009. Since "Biden" is lexicographically before "Obama", Biden's
|
||||
data point appears first. The goal is to sort the presidents in order of their
|
||||
presidential term.
|
||||
|
||||
The first step is adding the first presidential term start date to the dataset.
|
||||
`Array#find` will find the first value in an array that matches a criterion.
|
||||
The following code looks at each president and creates a `"start"` property that
|
||||
represents the start of the first presidential term.
|
||||
|
||||
```js
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
```
|
||||
|
||||
`Array#sort` will sort the array. Since the `start` properties are strings, the
|
||||
recommended approach is to use `String#localeCompare` to compare strings:
|
||||
|
||||
```js
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
```
|
||||
|
||||
### Reshaping the Array
|
||||
|
||||
For this example, the name will be the first name combined with the last name
|
||||
@ -200,6 +225,10 @@ function Presidents() { return ( <button onClick={async () => {
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -248,6 +277,10 @@ hosted (no `file:///` access).
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -294,6 +327,10 @@ const XLSX = require("xlsx");
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -347,6 +384,10 @@ const axios = require("axios");
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -393,6 +434,10 @@ const raw_data = await (await fetch(url)).json();
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter((row: any) => row.terms.some((term: any) => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map((row: any) => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -434,6 +479,10 @@ const raw_data = await (await fetch(url)).json();
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter((row) => row.terms.some((term) => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map((row) => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -479,6 +528,10 @@ Save the following script to `snippet.html`:
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
@ -519,15 +572,14 @@ Save the following to `package.json`:
|
||||
}
|
||||
```
|
||||
|
||||
Install dependencies and build the app:
|
||||
Install dependencies and run:
|
||||
|
||||
```bash
|
||||
npm i
|
||||
npx -p nw-builder nwbuild --mode=build .
|
||||
npx nw .
|
||||
```
|
||||
|
||||
Run the generated app in the `build\sheetjs-nwjs` folder. It will show a save
|
||||
dialog box. After selecting a path, the app will write the file.
|
||||
The app will show a save dialog. After selecting a path, it will write the file.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="mobile" label="Mobile App">
|
||||
@ -542,7 +594,7 @@ of the React Native documentation before testing the demo.
|
||||
Create a new project by running the following commands in the Terminal:
|
||||
|
||||
```bash
|
||||
npx react-native init SheetJSPres --version="0.70.6"
|
||||
npx react-native@0.70.6 init SheetJSPres --version="0.70.6"
|
||||
cd SheetJSPres
|
||||
|
||||
npm i -S https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz react-native-blob-util@0.17.1
|
||||
@ -564,6 +616,10 @@ const make_workbook = async() => {
|
||||
/* filter for the Presidents */
|
||||
const prez = raw_data.filter(row => row.terms.some(term => term.type === "prez"));
|
||||
|
||||
/* sort by first presidential term */
|
||||
prez.forEach(prez => prez.start = prez.terms.find(term => term.type === "prez").start);
|
||||
prez.sort((l,r) => l.start.localeCompare(r.start));
|
||||
|
||||
/* flatten objects */
|
||||
const rows = prez.map(row => ({
|
||||
name: row.name.first + " " + row.name.last,
|
||||
|
@ -162,7 +162,7 @@ function SheetJSEnregistrez() {
|
||||
|
||||
:::note
|
||||
|
||||
This demo was last tested on 2022 February 28.
|
||||
This demo was last tested on 2023 February 28.
|
||||
|
||||
:::
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user