forked from sheetjs/docs.sheetjs.com
drash-moved
This commit is contained in:
parent
2c4c81603d
commit
f270ad6b3f
@ -68,7 +68,7 @@ and the types URLs should be updated at the same time:
|
||||
|
||||
#### Deno Registry
|
||||
|
||||
:::warning
|
||||
:::warning pass
|
||||
|
||||
The official Deno registry is out of date. This is a registry bug.
|
||||
|
||||
|
||||
@ -1150,7 +1150,7 @@ see a preview of the data. The Numbers app can open the file.
|
||||
[^1]: <https://theunitedstates.io/congress-legislators/executive.json> is the
|
||||
original location of the example dataset. The contributors to the dataset
|
||||
dedicated the content to the public domain.
|
||||
[^2]: See ["The Executive Branch](https://github.com/unitedstates/congress-legislators#the-executive-branch)
|
||||
[^2]: See ["The Executive Branch"](https://github.com/unitedstates/congress-legislators#the-executive-branch)
|
||||
in the dataset documentation.
|
||||
[^3]: See [`json_to_sheet` in "Utilities"](/docs/api/utilities/array#array-of-objects-input)
|
||||
[^4]: See [`book_new` in "Utilities"](/docs/api/utilities/wb)
|
||||
|
||||
@ -17,7 +17,7 @@ This demo is for the legacy AngularJS framework (version 1).
|
||||
|
||||
:::
|
||||
|
||||
AngularJS is a JS library for building user interfaces.
|
||||
[AngularJS](https://angularjs.org/) is a JS library for building user interfaces.
|
||||
|
||||
## Demo
|
||||
|
||||
|
||||
@ -542,7 +542,7 @@ This will generate `SheetJSPool.xlsx`.
|
||||
|
||||
## Deno
|
||||
|
||||
:::caution
|
||||
:::caution pass
|
||||
|
||||
Many hosted services like Deno Deploy do not offer filesystem access.
|
||||
|
||||
@ -550,8 +550,8 @@ This breaks web frameworks that use the filesystem in body parsing.
|
||||
|
||||
:::
|
||||
|
||||
Deno provides the basic elements to implement a server. It does not provide a
|
||||
body parser out of the box.
|
||||
Deno provides the basic elements to implement a web server. It does not provide
|
||||
a body parser out of the box.
|
||||
|
||||
#### Drash
|
||||
|
||||
@ -561,13 +561,18 @@ which could handle file uploads on hosted services like Deno Deploy.
|
||||
_Reading Data_
|
||||
|
||||
`Request#bodyParam` reads body parameters. For uploaded files, the `content`
|
||||
property is a `Uint8Array`:
|
||||
property is a `Uint8Array` which can be parsed with the SheetJS `read` method[^1].
|
||||
|
||||
This example server responds to POST requests. The server will look for a file
|
||||
in the request body under the `"upload"` key. If a file is present, the server
|
||||
will parse the file, generate an HTML table using the `sheet_to_html` method[^2]
|
||||
and respond with the HTML code:
|
||||
|
||||
<CodeBlock language="ts">{`\
|
||||
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
|
||||
import { read, utils } from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
|
||||
\n\
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
\n\
|
||||
class ParseResource extends Drash.Resource {
|
||||
public paths = ["/"];
|
||||
@ -579,7 +584,7 @@ class ParseResource extends Drash.Resource {
|
||||
if (!file) throw new Error("File is required!");
|
||||
// highlight-next-line
|
||||
var wb = read(file.content);
|
||||
return response.html( utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]));
|
||||
return response.html(utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]));
|
||||
}
|
||||
}`}
|
||||
</CodeBlock>
|
||||
@ -587,13 +592,22 @@ class ParseResource extends Drash.Resource {
|
||||
_Writing Data_
|
||||
|
||||
Headers are manually set with `Response#headers.set` while the raw body is set
|
||||
with `Response#send`:
|
||||
with `Response#send`. The raw body can be `Uint8Array` or `ArrayBuffer` objects.
|
||||
|
||||
Given a SheetJS workbook object, the `write` method using `type: "buffer"`[^3]
|
||||
generates data objects compatible with Drash.
|
||||
|
||||
This example server responds to GET requests. The server will generate a SheetJS
|
||||
worksheet object from an array of arrays[^4], build up a new workbook using the
|
||||
`book_new`[^5] and `book_append_sheet`[^6] utility methods, generate a XLSX file
|
||||
using `write`, and send the file with appropriate headers to initiate a download
|
||||
with file name `"SheetJSDrash.xlsx"`:
|
||||
|
||||
<CodeBlock language="ts">{`\
|
||||
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
|
||||
import { utils, write } from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
|
||||
\n\
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
\n\
|
||||
class WriteResource extends Drash.Resource {
|
||||
public paths = ["/export"];
|
||||
@ -617,6 +631,12 @@ class WriteResource extends Drash.Resource {
|
||||
|
||||
<details><summary><b>Complete Example</b> (click to show)</summary>
|
||||
|
||||
:::note
|
||||
|
||||
This demo was last tested on 2023 August 18 against Drash 2.8.0 and Deno 1.36.1.
|
||||
|
||||
:::
|
||||
|
||||
1) Download [`SheetJSDrash.ts`](pathname:///server/SheetJSDrash.ts):
|
||||
|
||||
```bash
|
||||
@ -642,3 +662,10 @@ The page should show the contents of the file as an HTML table.
|
||||
The page should attempt to download `SheetJSDrash.xlsx` . Open the new file.
|
||||
|
||||
</details>
|
||||
|
||||
[^1]: See [`read` in "Reading Files"](/docs/api/parse-options)
|
||||
[^2]: See [`sheet_to_html` in "Utilities"](/docs/api/utilities/html#html-table-output)
|
||||
[^3]: See [`write` in "Writing Files"](/docs/api/write-options)
|
||||
[^4]: See [`aoa_to_sheet` in "Utilities"](/docs/api/utilities/array#array-of-arrays-input)
|
||||
[^5]: See [`book_new` in "Utilities"](/docs/api/utilities/wb)
|
||||
[^6]: See [`book_append_sheet` in "Utilities"](/docs/api/utilities/wb)
|
||||
|
||||
@ -1,13 +1,11 @@
|
||||
---
|
||||
title: SvelteKit
|
||||
title: Supercharge SvelteKit Apps with Spreadsheets
|
||||
sidebar_label: SvelteKit
|
||||
description: Make static websites from spreadsheets using SvelteKit. Seamlessly integrate data into your website using SheetJS. Rapidly develop web apps powered by data in Excel.
|
||||
pagination_prev: demos/net/index
|
||||
pagination_next: demos/mobile/index
|
||||
---
|
||||
|
||||
# Supercharge SvelteKit Apps with Spreadsheets
|
||||
|
||||
import current from '/version.js';
|
||||
import CodeBlock from '@theme/CodeBlock';
|
||||
|
||||
@ -96,14 +94,8 @@ each file extension supported in the loader:
|
||||
|
||||
```ts title="src/app.d.ts"
|
||||
declare global {
|
||||
declare module '*.numbers' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.xlsx' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.numbers' { const data: string; export default data; }
|
||||
declare module '*.xlsx' { const data: string; export default data; }
|
||||
}
|
||||
```
|
||||
|
||||
@ -253,7 +245,7 @@ npm i --save @sveltejs/adapter-static
|
||||
|
||||
13) Edit `svelte.config.js` to use the new adapter:
|
||||
|
||||
```diff title="svelte.config.js"
|
||||
```diff title="svelte.config.js (diff)"
|
||||
-import adapter from '@sveltejs/adapter-auto';
|
||||
+import adapter from '@sveltejs/adapter-static';
|
||||
```
|
||||
|
||||
@ -97,22 +97,10 @@ This data loader returns Base64 strings:
|
||||
|
||||
```ts title="src/env.d.ts"
|
||||
/// <reference types="astro/client" />
|
||||
declare module '*.numbers' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.xlsx' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.xls' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.xlsb' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.numbers' { const data: string; export default data; }
|
||||
declare module '*.xlsx' { const data: string; export default data; }
|
||||
declare module '*.xls' { const data: string; export default data; }
|
||||
declare module '*.xlsb' { const data: string; export default data; }
|
||||
// ... (more spreadsheet formats) ...
|
||||
```
|
||||
|
||||
@ -226,14 +214,8 @@ npm i --save https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz`}
|
||||
|
||||
```ts title="src/env.d.ts"
|
||||
/* add to the end of the file */
|
||||
declare module '*.numbers' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.xlsx' {
|
||||
const data: string;
|
||||
export default data;
|
||||
}
|
||||
declare module '*.numbers' { const data: string; export default data; }
|
||||
declare module '*.xlsx' { const data: string; export default data; }
|
||||
```
|
||||
|
||||
5) Add the highlighted lines to `astro.config.mjs`:
|
||||
|
||||
@ -441,7 +441,7 @@ const res = await readFile(path, 'ascii');
|
||||
const wb = XLSX.read(new Uint8Array(res), {type:'buffer'});
|
||||
```
|
||||
|
||||
:::caution
|
||||
:::caution pass
|
||||
|
||||
On iOS, the URI from `react-native-document-picker` must be massaged:
|
||||
|
||||
@ -546,7 +546,7 @@ await writeFile(DocumentDirectoryPath + "/sheetjs.xlsx", bstr, "ascii");
|
||||
|
||||
#### `expo-file-system`
|
||||
|
||||
:::caution
|
||||
:::caution pass
|
||||
|
||||
Some Expo APIs return URI that cannot be read with `expo-file-system`. This
|
||||
will manifest as an error:
|
||||
@ -601,7 +601,7 @@ The Android simulator runs Android 12 (S) Platform 31 on a Pixel 5.
|
||||
|
||||
:::
|
||||
|
||||
:::warning
|
||||
:::warning pass
|
||||
|
||||
There are many moving parts and pitfalls with React Native apps. It is strongly
|
||||
recommended to follow the official React Native tutorials for iOS and Android
|
||||
@ -811,7 +811,7 @@ const make_width = ws => {
|
||||
</TabItem>
|
||||
<TabItem value="EXPO" label="EXPO">
|
||||
|
||||
:::warning
|
||||
:::warning pass
|
||||
|
||||
At the time of testing, Expo Modules were incompatible with Android projects.
|
||||
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
---
|
||||
title: Flutter
|
||||
title: Let Data Fly with Flutter
|
||||
sidebar_label: Dart + Flutter
|
||||
description: Build data-intensive mobile apps with Dart + Flutter. Seamlessly integrate spreadsheets into your app using SheetJS. Securely process and generate Excel files on the go.
|
||||
pagination_prev: demos/static/index
|
||||
pagination_next: demos/desktop/index
|
||||
sidebar_position: 5
|
||||
sidebar_position: 6
|
||||
sidebar_custom_props:
|
||||
summary: Dart + JS Interop
|
||||
---
|
||||
@ -10,22 +12,29 @@ sidebar_custom_props:
|
||||
import current from '/version.js';
|
||||
import CodeBlock from '@theme/CodeBlock';
|
||||
|
||||
Dart + Flutter is a cross-platform alternative to [JS + React Native](/docs/demos/mobile/reactnative).
|
||||
Dart[^1] + Flutter[^2] is a popular cross-platform app framework. JavaScript
|
||||
code can be run through [embedded engines](/docs/demos/engines).
|
||||
|
||||
For the iOS and Android targets, the `flutter_js` package wraps JavaScriptCore
|
||||
and QuickJS engines respectively.
|
||||
[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
|
||||
data from spreadsheets.
|
||||
|
||||
The [Standalone scripts](/docs/getting-started/installation/standalone) can be
|
||||
parsed and evaluated in the wrapped engines.
|
||||
This demo uses Dart + Flutter and SheetJS to process spreadsheets. We'll explore
|
||||
how to use the `flutter_js` package to run JavaScript code and how to pass data
|
||||
between Dart code and the platform-specific JS engines.
|
||||
|
||||
The "Complete Example" creates an app that looks like the screenshots below:
|
||||
The "Demo" creates an app that looks like the screenshots below:
|
||||
|
||||
<table><thead><tr>
|
||||
<th><a href="#demo">iOS</a></th>
|
||||
<th><a href="#demo">Android</a></th>
|
||||
</tr></thead><tbody><tr><td>
|
||||
|
||||
|
||||
|
||||
</td><td>
|
||||
|
||||
|
||||
|
||||
</td></tr></tbody></table>
|
||||
|
||||
:::warning Telemetry
|
||||
@ -43,8 +52,18 @@ flutter config --disable-telemetry
|
||||
|
||||
## Integration Details
|
||||
|
||||
:::note pass
|
||||
|
||||
This demo assumes familiarity with Dart and Flutter.
|
||||
|
||||
:::
|
||||
|
||||
For the iOS and Android targets, the `flutter_js` package[^3] wraps JavaScriptCore[^4]
|
||||
and QuickJS[^5] engines respectively.
|
||||
|
||||
The [SheetJS Standalone scripts](/docs/getting-started/installation/standalone)
|
||||
can be parsed and evaluated in the wrapped engines.
|
||||
|
||||
### Loading SheetJS
|
||||
|
||||
#### Adding the scripts
|
||||
@ -95,6 +114,7 @@ Since fetching assets is asynchronous, it is recommended to create a wrapper
|
||||
```dart
|
||||
class SheetJSFlutterState extends State<SheetJSFlutter> {
|
||||
String _version = '0.0.0';
|
||||
late JavascriptRuntime _engine;
|
||||
|
||||
@override void initState() {
|
||||
_engine = getJavascriptRuntime();
|
||||
@ -119,22 +139,47 @@ class SheetJSFlutterState extends State<SheetJSFlutter> {
|
||||
|
||||
### Reading data
|
||||
|
||||
The following diagram depicts the workbook waltz:
|
||||
|
||||
```mermaid
|
||||
flowchart LR
|
||||
file[(file data\nUint8List)]
|
||||
subgraph SheetJS operations
|
||||
base64(Base64\nstring)
|
||||
wb((SheetJS\nWorkbook))
|
||||
csv(CSV\nstring)
|
||||
end
|
||||
lld(List of\nLists)
|
||||
tbl{{Data\nTable}}
|
||||
file --> |`base64Encode`\nDart| base64
|
||||
base64 --> |`XLSX.read`\nParse Bytes| wb
|
||||
wb --> |`sheet_to_csv`\nExtract Data| csv
|
||||
csv --> |`CsvToListConverter`\nDart| lld
|
||||
lld --> |`Table`\nFlutter| tbl
|
||||
```
|
||||
|
||||
The most common binary data type in Dart is `Uint8List`. It is the data type
|
||||
for `http.Response#bodyBytes` and the return type of `File#readAsBytes()`.
|
||||
|
||||
The Flutter JS connector offers no simple interop for `Uint8List` data. The data
|
||||
should be converted to Base64 before parsing.
|
||||
should be converted to Base64 using `base64Encode` before parsing.
|
||||
|
||||
Once passed into the JS engine, the SheetJS `read` function[^6] can read the
|
||||
Base64-encoded string and the `sheet_to_csv` utility function[^7] can generate
|
||||
a CSV string from a worksheet. This string can be pulled back into Dart code.
|
||||
|
||||
The `csv` package provides a special `CsvToListConverter` converter to generate
|
||||
`List<List<dynamic>>` (Dart's spiritual equivalent of the array of arrays):
|
||||
`List<List<dynamic>>` (Dart's spiritual equivalent of the array of arrays).
|
||||
|
||||
The following snippet generates `List<List<dynamic>>` from a Dart `Uint8List`:
|
||||
|
||||
```dart
|
||||
import 'dart:convert';
|
||||
import 'package:http/http.dart' as http;
|
||||
import 'package:csv/csv.dart';
|
||||
|
||||
class SheetJSFlutterState extends State<SheetJSFlutter> {
|
||||
List<List<dynamic>> _data = [];
|
||||
late JavascriptRuntime _engine;
|
||||
|
||||
void _processBytes(Uint8List bytes) {
|
||||
String base64 = base64Encode(bytes);
|
||||
@ -145,19 +190,76 @@ class SheetJSFlutterState extends State<SheetJSFlutter> {
|
||||
String csv = func.stringResult;
|
||||
setState(() { _data = CsvToListConverter(eol: "\n").convert(csv); });
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Demo
|
||||
|
||||
:::note
|
||||
|
||||
This demo was tested on an Intel Mac on 2023 May 31 with Flutter 3.10.2,
|
||||
Dart 3.0.2, and `flutter_js` 0.7.0
|
||||
This demo was tested on an Intel Mac on 2023-08-18 with Flutter 3.13.0, Dart
|
||||
3.1.0, and `flutter_js` 0.8.0.
|
||||
|
||||
The iOS simulator runs iOS 16.2 on an iPhone 14 Pro Max.
|
||||
|
||||
The Android simulator runs Android 12.0 (S) API 31 on a Pixel 3.
|
||||
|
||||
:::
|
||||
|
||||
0) Follow the official "Install" instructions for Flutter[^8].
|
||||
|
||||
Run `flutter doctor` and confirm the following items are checked:
|
||||
|
||||
```
|
||||
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
|
||||
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
|
||||
[✓] Android Studio (version 2022.1)
|
||||
```
|
||||
|
||||
(the actual version numbers may differ)
|
||||
|
||||
<details open><summary><b>Installation Notes</b> (click to hide)</summary>
|
||||
|
||||
:::caution pass
|
||||
|
||||
In local testing, there were issues with the Android toolchain:
|
||||
|
||||
```
|
||||
error: Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to resolve this.
|
||||
```
|
||||
|
||||
This was fixed by switching to Java 20, installing `Android SDK 33`, and rolling
|
||||
back to `Android SDK Command-Line Tools (revision: 10.0)`
|
||||
|
||||
:::
|
||||
|
||||
:::caution pass
|
||||
|
||||
If Google Chrome is not installed, `flutter doctor` will show an issue:
|
||||
|
||||
```
|
||||
[✗] Chrome - develop for the web (Cannot find Chrome executable at
|
||||
/Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
|
||||
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
|
||||
```
|
||||
|
||||
If Chromium is installed, the environment variable should be manually assigned:
|
||||
|
||||
```bash
|
||||
export CHROME_EXECUTABLE=/Applications/Chromium.app/Contents/MacOS/Chromium
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
</details>
|
||||
|
||||
Run `flutter emulators` and check for both `ios` and `android` emulators:
|
||||
|
||||
```
|
||||
apple_ios_simulator • iOS Simulator • Apple • ios
|
||||
Pixel_3_API_31 • Pixel 3 API 31 • Google • android
|
||||
```
|
||||
|
||||
1) Disable telemetry.
|
||||
|
||||
```bash
|
||||
@ -167,6 +269,8 @@ flutter config --no-analytics
|
||||
flutter config --disable-telemetry
|
||||
```
|
||||
|
||||
### Base Project
|
||||
|
||||
2) Create a new Flutter project:
|
||||
|
||||
```bash
|
||||
@ -174,7 +278,7 @@ flutter create sheetjs_flutter
|
||||
cd sheetjs_flutter
|
||||
```
|
||||
|
||||
3) Open the iOS simulator
|
||||
3) Open the iOS simulator.
|
||||
|
||||
4) While the iOS simulator is open, start the application:
|
||||
|
||||
@ -182,7 +286,7 @@ cd sheetjs_flutter
|
||||
flutter run
|
||||
```
|
||||
|
||||
Once the app loads in the simulator, stop the terminal process.
|
||||
Once the app loads, stop the terminal process and close the simulator.
|
||||
|
||||
5) Install Flutter / Dart dependencies:
|
||||
|
||||
@ -219,7 +323,11 @@ cd ..`}
|
||||
curl -L -o lib/main.dart https://docs.sheetjs.com/flutter/main.dart
|
||||
```
|
||||
|
||||
9) Launch the app:
|
||||
### iOS
|
||||
|
||||
9) Start the iOS simulator again.
|
||||
|
||||
10) Launch the app:
|
||||
|
||||
```bash
|
||||
flutter run
|
||||
@ -227,3 +335,70 @@ flutter run
|
||||
|
||||
The app fetches <https://sheetjs.com/pres.numbers>, parses, converts data to an
|
||||
array of arrays, and presents the data in a Flutter `Table` widget.
|
||||
|
||||
11) Close the iOS simulator.
|
||||
|
||||
### Android
|
||||
|
||||
12) Start the Android emulator with `emulator -avd name_of_device`. The actual
|
||||
emulator name can be found with `flutter emulators`:
|
||||
|
||||
```
|
||||
% flutter emulators
|
||||
2 available emulators:
|
||||
|
||||
apple_ios_simulator • iOS Simulator • Apple • ios
|
||||
Pixel_3_API_31 • Pixel 3 API 31 • Google • android
|
||||
^^^^^^^^^^^^^^--- the first column is the name
|
||||
|
||||
% emulator -avd Pixel_3_API_31
|
||||
```
|
||||
|
||||
13) Launch the app:
|
||||
|
||||
```bash
|
||||
flutter run
|
||||
```
|
||||
|
||||
The app fetches <https://sheetjs.com/pres.numbers>, parses, converts data to an
|
||||
array of arrays, and presents the data in a Flutter `Table` widget.
|
||||
|
||||
:::caution pass
|
||||
|
||||
When the demo was last run, there was a build error:
|
||||
|
||||
```
|
||||
│ The plugin flutter_js requires a higher Android SDK version. │
|
||||
│ Fix this issue by adding the following to the file /.../android/app/build.gradle: │
|
||||
│ android { │
|
||||
│ defaultConfig { │
|
||||
│ minSdkVersion 21 │
|
||||
│ } │
|
||||
│ } │
|
||||
```
|
||||
|
||||
This was fixed by editing `android/app/build.gradle`.
|
||||
|
||||
Searching for `minSdkVersion` should reveal the following line:
|
||||
|
||||
```text title="android\app\build.gradle"
|
||||
minSdkVersion flutter.minSdkVersion
|
||||
```
|
||||
|
||||
`flutter.minSdkVersion` should be replaced with `21`:
|
||||
|
||||
```diff title="android\app\build.gradle (diff)"
|
||||
- minSdkVersion flutter.minSdkVersion
|
||||
+ minSdkVersion 21
|
||||
```
|
||||
|
||||
:::
|
||||
|
||||
[^1]: <https://dart.dev/> is the official site for the Dart Programming Language.
|
||||
[^2]: <https://flutter.dev/> is the official site for the Flutter Framework.
|
||||
[^3]: [The `flutter_js` package](https://pub.dev/packages/flutter_js) is hosted on the Dart package repository.
|
||||
[^4]: See [the dedicated "Swift + JavaScriptCore" demo](/docs/demos/engines/jsc) for more details.
|
||||
[^5]: See [the dedicated "C + QuickJS" demo](/docs/demos/engines/quickjs) for more details.
|
||||
[^6]: See [`read` in "Reading Files"](/docs/api/parse-options)
|
||||
[^7]: See [`sheet_to_csv` in "CSV and Text"](/docs/api/utilities/csv#delimiter-separated-output)
|
||||
[^8]: See [the Flutter Installation Instructions](https://docs.flutter.dev/get-started/install)
|
||||
|
||||
@ -44,7 +44,7 @@ This demo was tested in the following deployments:
|
||||
|:-------------|:--------|:------------|:-----------|
|
||||
| `darwin-x64` | `5.8.1` | `18.5.0` | 2023-05-08 |
|
||||
| `darwin-arm` | `5.8.1` | `18.5.0` | 2023-06-05 |
|
||||
| `win32-x64` | `5.8.1` | `18.5.0` | 2023-05-08 |
|
||||
| `win10-x64` | `5.8.1` | `18.5.0` | 2023-05-08 |
|
||||
| `linux-x64` | `5.8.1` | `18.5.0` | 2023-05-08 |
|
||||
|
||||
**`nexe`**
|
||||
@ -53,7 +53,7 @@ This demo was tested in the following deployments:
|
||||
|:-------------|:-------------|:------------|:-----------|
|
||||
| `darwin-x64` | `4.0.0-rc.2` | `14.15.3` | 2023-05-08 |
|
||||
| `darwin-arm` | `4.0.0-rc.2` | `18.16.0` | 2023-06-05 |
|
||||
| `win32-x64` | `4.0.0-rc.2` | `14.15.3` | 2023-05-08 |
|
||||
| `win10-x64` | `4.0.0-rc.2` | `14.15.3` | 2023-05-08 |
|
||||
| `linux-x64` | `4.0.0-rc.2` | `14.15.3` | 2023-05-08 |
|
||||
|
||||
**`boxednode`**
|
||||
@ -166,7 +166,7 @@ This demo was last tested in the following deployments:
|
||||
| `darwin-x64` | `11.4.183.2` | 2023-05-22 |
|
||||
| `darwin-mac` | `11.4.183.2` | 2023-05-22 |
|
||||
| `linux-x64` | `11.4.183.2` | 2023-05-23 |
|
||||
| `win32-x64` | `11.4.183.2` | 2023-05-23 |
|
||||
| `win10-x64` | `11.4.183.2` | 2023-05-23 |
|
||||
|
||||
</details>
|
||||
|
||||
@ -253,7 +253,7 @@ This demo was last tested in the following deployments:
|
||||
|:-------------|:---------|:-----------|
|
||||
| `darwin-x64` | `1.33.2` | 2023-05-08 |
|
||||
| `darwin-arm` | `1.34.1` | 2023-06-05 |
|
||||
| `win32-x64` | `1.33.2` | 2023-05-08 |
|
||||
| `win10-x64` | `1.33.2` | 2023-05-08 |
|
||||
| `linux-x64` | `1.33.2` | 2023-05-08 |
|
||||
|
||||
</details>
|
||||
|
||||
@ -41,7 +41,7 @@ The following example assumes the file is submitted at field name `file`:
|
||||
<CodeBlock language="ts">{`\
|
||||
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
|
||||
import { read, utils } from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
\n\
|
||||
class SheetJSResource extends Drash.Resource {
|
||||
public paths = ["/"];
|
||||
|
||||
@ -362,7 +362,7 @@ This demo was last tested in the following deployments:
|
||||
| `darwin-x64` | `0.71.2` | 2023-05-22 |
|
||||
| `darwin-arm` | `0.73.0` | 2023-06-05 |
|
||||
| `linux-x64` | `0.71.2` | 2023-05-23 |
|
||||
| `win32-x64` | `0.71.2` | 2023-05-23 |
|
||||
| `win10-x64` | `0.71.2` | 2023-05-23 |
|
||||
|
||||
:::
|
||||
|
||||
|
||||
@ -344,7 +344,7 @@ import * as XLSX from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs'
|
||||
import * as cptable from 'https://cdn.sheetjs.com/xlsx-${current}/package/dist/cpexcel.full.mjs';
|
||||
XLSX.set_cptable(cptable);
|
||||
\n\
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
\n\
|
||||
class SheetResource extends Drash.Resource {
|
||||
public paths = ["/"];
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
---
|
||||
title: Cell Objects
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Cell Object
|
||||
|
||||
Cell objects are plain JS objects with keys and values following the convention:
|
||||
|
||||
| Key | Description |
|
||||
| --- | ---------------------------------------------------------------------- |
|
||||
| | **Core Cell Properties** ([More Info](#data-types)) |
|
||||
| `v` | raw value (number, string, Date object, boolean) |
|
||||
| `t` | type: `b` Boolean, `e` Error, `n` Number, `d` Date, `s` Text, `z` Stub |
|
||||
| `v` | raw value (number, string, Date object, boolean) |
|
||||
| | **Number Formats** ([More Info](/docs/csf/features/nf)) |
|
||||
| `z` | number format string associated with the cell (if requested) |
|
||||
| `w` | formatted text (if applicable) |
|
||||
@ -25,9 +24,11 @@ Cell objects are plain JS objects with keys and values following the convention:
|
||||
| `h` | HTML rendering of the rich text (if applicable) |
|
||||
| `s` | the style/theme of the cell (if applicable) |
|
||||
|
||||
Built-in export utilities (such as the CSV exporter) will use the `w` text if it
|
||||
is available. To change a value, be sure to delete `cell.w` (or set it to
|
||||
`undefined`) before attempting to export. The utilities will regenerate the `w`
|
||||
Cell objects are expected to have a type (`t` property).
|
||||
|
||||
Built-in utilities that use formatted text (such as the CSV exporter) will use
|
||||
the `w` text if available. When programmatically changing values, the `w` text
|
||||
should be deleted before attempting to export. Utilities will regenerate the `w`
|
||||
text from the number format (`cell.z`) and the raw value if possible.
|
||||
|
||||
The actual array formula is stored in the `f` field of the first cell in the
|
||||
|
||||
@ -33,7 +33,7 @@ supported in `XLSM`, `XLSB`, and `BIFF8 XLS` formats. The supported format
|
||||
writers automatically insert the data blobs if it is present in the workbook and
|
||||
associate with the worksheet names.
|
||||
|
||||
:::note
|
||||
:::note pass
|
||||
|
||||
The `vbaraw` property stores raw bytes. [SheetJS Pro](https://sheetjs.com/pro)
|
||||
offers a special component for extracting macro text from the VBA blob, editing
|
||||
@ -217,7 +217,7 @@ To ensure the writers export the VBA blob:
|
||||
- The `write` or `writeFile` call must include the option `bookVBA: true`
|
||||
|
||||
This example uses [`vbaProject.bin`](pathname:///vba/vbaProject.bin) from the
|
||||
[sample file](pathname:///vba/vbaProject.bin):
|
||||
[sample file](pathname:///vba/SheetJSVBAFormula.xlsm):
|
||||
|
||||
```jsx live
|
||||
function SheetJSVBAPrepared() { return ( <button onClick={async () => {
|
||||
|
||||
@ -3,7 +3,7 @@ import { read, utils, set_cptable, version } from 'https://cdn.sheetjs.com/xlsx-
|
||||
import * as cptable from 'https://cdn.sheetjs.com/xlsx-0.20.0/package/dist/cpexcel.full.mjs';
|
||||
set_cptable(cptable);
|
||||
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
|
||||
class SheetJSResource extends Drash.Resource {
|
||||
public paths = ["/"];
|
||||
@ -23,7 +23,7 @@ class SheetJSResource extends Drash.Resource {
|
||||
try { response.headers.set("access-control-allow-origin", "*"); } catch(e) {}
|
||||
if (!file) throw new Error("File is required!");
|
||||
var wb = read(file.content, {type: "buffer", dense: true});
|
||||
return response.html( (type == "csv" ? utils.sheet_to_csv : utils.sheet_to_html)(wb.Sheets[wb.SheetNames[0]]));
|
||||
return response.html((type == "csv" ? utils.sheet_to_csv : utils.sheet_to_html)(wb.Sheets[wb.SheetNames[0]]));
|
||||
}
|
||||
|
||||
public GET(request: Drash.Request, response: Drash.Response): void {
|
||||
|
||||
BIN
docz/static/flutter/and.png
Normal file
BIN
docz/static/flutter/and.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 69 KiB |
@ -4,7 +4,7 @@ import { read, utils, write, set_cptable } from 'https://cdn.sheetjs.com/xlsx-la
|
||||
import * as cptable from 'https://cdn.sheetjs.com/xlsx-latest/package/dist/cpexcel.full.mjs';
|
||||
set_cptable(cptable);
|
||||
|
||||
import * as Drash from "https://deno.land/x/drash@v2.5.4/mod.ts";
|
||||
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.0/mod.ts";
|
||||
|
||||
class ParseResource extends Drash.Resource {
|
||||
public paths = ["/"];
|
||||
@ -13,7 +13,7 @@ class ParseResource extends Drash.Resource {
|
||||
const file = request.bodyParam<Drash.Types.BodyFile>("file");
|
||||
if (!file) throw new Error("File is required!");
|
||||
var wb = read(file.content);
|
||||
return response.html( utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]));
|
||||
return response.html(utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]));
|
||||
}
|
||||
|
||||
public GET(request: Drash.Request, response: Drash.Response): void {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user