forked from sheetjs/docs.sheetjs.com
		
	dojo
This commit is contained in:
		
							parent
							
								
									0cb225361b
								
							
						
					
					
						commit
						62bba8b309
					
				| @ -130,6 +130,7 @@ DOM | ||||
| DPI | ||||
| DataGrid | ||||
| Deno | ||||
| Dojo | ||||
| Downloadify | ||||
| Drash | ||||
| Duktape | ||||
|  | ||||
| @ -93,3 +93,77 @@ require(['xlsx'], function(XLSX) { | ||||
|   // ... use XLSX here | ||||
| }); | ||||
| ``` | ||||
| 
 | ||||
| ## Dojo Toolkit | ||||
| 
 | ||||
| Dojo has changed module loading strategies over the years.  These examples were | ||||
| tested with Dojo `1.10.4` and are not guaranteed to work with other versions. | ||||
| 
 | ||||
| Live demos are included in ["Dojo Toolkit"](../../demos/legacy#dojo-toolkit) | ||||
| 
 | ||||
| :::caution | ||||
| 
 | ||||
| The standalone scripts add `window.XLSX`, so it is recommended to use `_XLSX` | ||||
| in the function arguments and access the library with `XLSX` in the callback: | ||||
| 
 | ||||
| ```js | ||||
| require(["xlsx"], function( | ||||
|   // highlight-next-line | ||||
|   _XLSX // !! NOTE: this is not XLSX! A different variable name must be used | ||||
| ) { | ||||
|   // highlight-next-line | ||||
|   console.log(XLSX.version); // use XLSX in the callback | ||||
| }) | ||||
| ``` | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| #### Synchronous Loading | ||||
| 
 | ||||
| When `async` is disabled, the scripts can be referenced directly in `require` | ||||
| calls. | ||||
| 
 | ||||
| ```html | ||||
| <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="isDebug:1, async:0"></script> | ||||
| <script> | ||||
| require([ | ||||
| // highlight-next-line | ||||
|   "https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js" | ||||
| ], function( | ||||
| // highlight-next-line | ||||
|   _XLSX // !! NOTE: this is not XLSX! A different variable name must be used | ||||
| ) { | ||||
|   // ... use XLSX here | ||||
| }) | ||||
| </script> | ||||
| ``` | ||||
| 
 | ||||
| #### Asynchronous Loading | ||||
| 
 | ||||
| When `async` is enabled, Dojo will only understand the name `xlsx`.  The config | ||||
| object can map package names to scripts: | ||||
| 
 | ||||
| ```html | ||||
| <script> | ||||
| // This setting must appear *before* loading dojo.js | ||||
| dojoConfig = { | ||||
|   packages: [ | ||||
|     // highlight-start | ||||
|     { | ||||
|       name: "xlsx", | ||||
|       // if self-hosting the script, location should be a folder relative to baseUrl setting | ||||
|       location: "https://cdn.sheetjs.com/xlsx-latest/package/dist", | ||||
|       // name of the script (without the .js extension) | ||||
|       main: "xlsx.full.min" | ||||
|     } | ||||
|     // highlight-end | ||||
|   ] | ||||
| } | ||||
| </script> | ||||
| <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="isDebug:1, async:1"></script> | ||||
| <script> | ||||
| require(["xlsx"], function(_XLSX) { | ||||
|   // ... use XLSX here | ||||
| }); | ||||
| </script> | ||||
| ``` | ||||
| @ -404,8 +404,8 @@ result.forEach(function(row) { | ||||
|   var query = db.prepareQuery("SELECT * FROM '" + row[0] + "' LIMIT 100000") | ||||
|   var aoa = query.all(); | ||||
|   if(aoa.length > 0) { | ||||
| 		/* Create array of arrays */ | ||||
| 		var data = [query.columns().map(x => x.name)].concat(aoa); | ||||
|     /* Create array of arrays */ | ||||
|     var data = [query.columns().map(x => x.name)].concat(aoa); | ||||
|     /* Create Worksheet from the aoa */ | ||||
|     var ws = XLSX.utils.aoa_to_sheet(data, {dense: true}); | ||||
|     /* Add to Workbook */ | ||||
|  | ||||
| @ -168,6 +168,13 @@ bun bun.js | ||||
| </details> | ||||
| 
 | ||||
| 
 | ||||
| ## Dojo | ||||
| 
 | ||||
| Integration details are included [in the "AMD" installation](../getting-started/installation/amd#dojo-toolkit) | ||||
| 
 | ||||
| Complete Examples are included [in the "Dojo" demo](./legacy#dojo-toolkit) | ||||
| 
 | ||||
| 
 | ||||
| ## esbuild | ||||
| 
 | ||||
| The `xlsx.mjs` source file are written in a subset of ES6 that `esbuild` | ||||
|  | ||||
| @ -2,6 +2,13 @@ | ||||
| title: Excel JavaScript API | ||||
| --- | ||||
| 
 | ||||
| :::info | ||||
| 
 | ||||
| This demo focuses on the JavaScript API included with Excel. For reading and | ||||
| writing Excel files, [other demos](/docs/demos) cover a wide variety of use cases | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| Office 2016 introduced a JavaScript API for interacting with the application. | ||||
| It offers solutions for custom functions as well as task panes. | ||||
| 
 | ||||
| @ -314,6 +314,18 @@ var wb = XLSX.readFile("sheetjs.numbers"); | ||||
| XLSX.writeFile(wb, "sheetjs.xlsx"); | ||||
| ``` | ||||
| 
 | ||||
| ### ExtendScript | ||||
| 
 | ||||
| In Photoshop and other Adobe apps, `readFile` and `writeFile` use the `File` | ||||
| object under the hood: | ||||
| 
 | ||||
| ```js | ||||
| #include "xlsx.extendscript.js" | ||||
| 
 | ||||
| var wb = XLSX.readFile("sheetjs.xlsx"); | ||||
| XLSX.writeFile(wb, "sheetjs.csv"); | ||||
| ``` | ||||
| 
 | ||||
| ### Deno | ||||
| 
 | ||||
| `Deno.readFileSync` and `Deno.writeFileSync` are supported by `readFile` and | ||||
|  | ||||
| @ -301,6 +301,94 @@ XLSX.writeFile(wb, "sheetjs.xlsx"); | ||||
| 
 | ||||
| </details> | ||||
| 
 | ||||
| ### Dojo Toolkit | ||||
| 
 | ||||
| _Live Demos_ | ||||
| 
 | ||||
| - [Download and display data](pathname:///dojo/read.html) | ||||
| - [Fetch JSON and generate a workbook](pathname:///dojo/write.html) | ||||
| 
 | ||||
| 
 | ||||
| The ["AMD" instructions](../getting-started/installation/amd#dojo-toolkit) | ||||
| includes details for use with `require`. | ||||
| 
 | ||||
| <details><summary><b>Integration in the demos</b> (click to show)</summary> | ||||
| 
 | ||||
| The demos use the async loading strategy with the SheetJS CDN: | ||||
| 
 | ||||
| ```html | ||||
| <script> | ||||
| dojoConfig = { | ||||
|   packages: [ | ||||
|     { name: "xlsx", location: "https://cdn.sheetjs.com/xlsx-latest/package/dist", main: "xlsx.full.min" } | ||||
|   ] | ||||
| } | ||||
| </script> | ||||
| <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="isDebug:1, async:1"></script> | ||||
| <script> | ||||
| require(["dojo/request/xhr", "xlsx"], function(xhr, _XLSX) { | ||||
|   /* XLSX-related operations happen in the callback */ | ||||
| }); | ||||
| </script> | ||||
| ``` | ||||
| 
 | ||||
| </details> | ||||
| 
 | ||||
| The ["Dojo" section in "Bundlers"](./bundler#dojo) includes a complete example | ||||
| mirroring the [official example](../getting-started/example) | ||||
| 
 | ||||
| <details><summary><b>Details</b> (click to show)</summary> | ||||
| 
 | ||||
| _Reading Data_ | ||||
| 
 | ||||
| When fetching spreadsheets with XHR, `handleAs: "arraybuffer"` yields an | ||||
| `ArrayBuffer` which can be passed to `XLSX.read`: | ||||
| 
 | ||||
| ```html | ||||
| <div id="tbl"></div> | ||||
| <script> | ||||
| require(["dojo/request/xhr", "xlsx"], function(xhr, _XLSX) { | ||||
|   xhr("https://sheetjs.com/pres.numbers", { | ||||
|     headers: { "X-Requested-With": null }, | ||||
| // highlight-next-line | ||||
|     handleAs: "arraybuffer" | ||||
|   }).then(function(ab) { | ||||
|     /* read ArrayBuffer */ | ||||
| // highlight-next-line | ||||
|     var wb = XLSX.read(ab); | ||||
|     /* display first worksheet data */ | ||||
|     var ws = wb.Sheets[wb.SheetNames[0]]; | ||||
|     document.getElementById("tbl").innerHTML = XLSX.utils.sheet_to_html(ws); | ||||
|   }); | ||||
| }); | ||||
| </script> | ||||
| ``` | ||||
| 
 | ||||
| :::note | ||||
| 
 | ||||
| The `X-Requested-With` header setting resolves some issues related to CORS. | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| _Writing Data_ | ||||
| 
 | ||||
| `XLSX.writeFile` works as expected: | ||||
| 
 | ||||
| ```html | ||||
| <script> | ||||
| require(["xlsx"], function(_XLSX) { | ||||
|   var ws = XLSX.utils.aoa_to_sheet(["SheetJS".split(""), [5,4,3,3,7,9,5]]); | ||||
|   var wb = XLSX.utils.book_new(); XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); | ||||
|   /* create an XLSX file and try to save to SheetJSDojo.xlsx */ | ||||
|   // highlight-next-line | ||||
|   XLSX.writeFile(workbook, "SheetJSDojo.xlsx"); | ||||
| }); | ||||
| </script> | ||||
| ``` | ||||
| 
 | ||||
| </details> | ||||
| 
 | ||||
| 
 | ||||
| ### KnockoutJS | ||||
| 
 | ||||
| [KnockoutJS](https://en.wikipedia.org/wiki/Knockout_(web_framework)) was a | ||||
|  | ||||
| @ -34,7 +34,7 @@ explores storing and comparing versions of structured CSV and JSON data.  The | ||||
| official ["Excel to CSV"](https://github.com/githubocto/flat-demo-xlsx) example | ||||
| uses SheetJS under the hood to generate CSV data from an XLSX file. | ||||
| 
 | ||||
| This demo covers implementation details elided in the official writeup. | ||||
| This demo covers implementation details elided in the official write-up. | ||||
| 
 | ||||
| ## Flat Data | ||||
| 
 | ||||
|  | ||||
| @ -25,6 +25,7 @@ run in the web browser, demos will include interactive examples. | ||||
| - [`Svelte`](./svelte) | ||||
| - [`VueJS`](./vue) | ||||
| - [`Angular.JS`](./legacy#angularjs) | ||||
| - [`Dojo`](./legacy#dojo) | ||||
| - [`Knockout`](./legacy#knockout) | ||||
| 
 | ||||
| ### Front-End UI Components | ||||
| @ -50,7 +51,7 @@ run in the web browser, demos will include interactive examples. | ||||
| - [`ExtendScript for Adobe Apps`](./extendscript) | ||||
| - [`NetSuite SuiteScript`](./netsuite) | ||||
| - [`SalesForce Lightning Web Components`](./salesforce) | ||||
| - [`Excel JavaScript API`](./excel) | ||||
| - [`Excel JavaScript API`](./excelapi) | ||||
| - [`Headless Automation`](./headless) | ||||
| - [`Other JavaScript Engines`](./engines) | ||||
| - [`Azure Functions and Storage`](./azure) | ||||
|  | ||||
| @ -794,13 +794,40 @@ Readable Stream. | ||||
| <Tabs> | ||||
|   <TabItem value="nodejs" label="NodeJS"> | ||||
| 
 | ||||
| In a CommonJS context, NodeJS Streams immediately work with SheetJS.  This | ||||
| example reads a worksheet passed as an argument to the script, pulls the first | ||||
| worksheet, converts to CSV and writes to `out.csv`: | ||||
| :::note | ||||
| 
 | ||||
| In a CommonJS context, NodeJS Streams and `fs` immediately work with SheetJS: | ||||
| 
 | ||||
| ```js | ||||
| const XLSX = require("xlsx"); | ||||
| const XLSX = require("xlsx"); // "just works" | ||||
| ``` | ||||
| 
 | ||||
| In NodeJS ESM, the dependency must be loaded manually: | ||||
| 
 | ||||
| ```js | ||||
| import * as XLSX from 'xlsx'; | ||||
| import { Readable } from 'stream'; | ||||
| 
 | ||||
| XLSX.stream.set_readable(Readable); // manually load stream helpers | ||||
| ``` | ||||
| 
 | ||||
| Additionally, for file-related operations in NodeJS ESM, `fs` must be loaded: | ||||
| 
 | ||||
| ```js | ||||
| import * as XLSX from 'xlsx'; | ||||
| import * as fs from 'fs'; | ||||
| 
 | ||||
| XLSX.set_fs(fs); // manually load fs helpers | ||||
| ``` | ||||
| 
 | ||||
| **It is strongly encouraged to use CommonJS in NodeJS whenever possible.** | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| This example reads a worksheet passed as an argument to the script, pulls the | ||||
| first worksheet, converts to CSV and writes to `out.csv`: | ||||
| 
 | ||||
| ```js | ||||
| const workbook = XLSX.readFile(process.argv[2]); | ||||
| const worksheet = workbook.Sheets[workbook.SheetNames[0]]; | ||||
| // highlight-next-line | ||||
|  | ||||
| @ -91,7 +91,7 @@ The interpretation of date codes requires a shared understanding of date code | ||||
| The workbook's epoch can be determined by examining the workbook's `wb.Workbook.WBProps.date1904` property: | ||||
| 
 | ||||
| ```js | ||||
| if(!!(((wb.Workbook||{}).WBProps||{}).date1904)) { | ||||
| if(!(wb?.Workbook?.WBProps?.date1904)) { | ||||
|   /* uses 1904 date system */ | ||||
| } else { | ||||
|   /* uses 1900 date system */ | ||||
|  | ||||
| @ -163,6 +163,9 @@ const config = { | ||||
|       redirects: [ | ||||
|         { from: '/docs/example', to: '/docs/getting-started/example' }, | ||||
|         { from: '/docs/installation', to: '/docs/getting-started/' }, | ||||
|         { from: '/docs/demos/excel', to: '/docs/demos/' }, | ||||
|         { from: '/docs/getting-started/demos/', to: '/docs/demos/' }, | ||||
|         { from: '/docs/getting-started/demos/excel', to: '/docs/demos/' }, | ||||
|       ] | ||||
|     }] | ||||
|   ] | ||||
|  | ||||
							
								
								
									
										34
									
								
								docz/static/dojo/read.html
									
									
									
									
									
										Normal file
									
								
							
							
								
								
								
								
								
									
									
								
							
						
						
									
										34
									
								
								docz/static/dojo/read.html
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,34 @@ | ||||
| <!DOCTYPE html> | ||||
| <html> | ||||
| <head><title>SheetJS + Dojo Read Demo</title></head> | ||||
| <body> | ||||
|   <h1>SheetJS + Dojo Read Demo</h1> | ||||
| 
 | ||||
|   (this HTML page is not minified -- feel free to view source!)<br/><br/> | ||||
|   <a href="https://docs.sheetjs.com">SheetJS CE Documentation</a><br/><br/> | ||||
|   <b>Table output:</b><br/><br/> | ||||
|   <div id="tbl"></div> | ||||
| <script> | ||||
| dojoConfig = { packages: [ | ||||
|   { name: "xlsx", location: "https://cdn.sheetjs.com/xlsx-latest/package/dist", main: "xlsx.full.min" } | ||||
| ] }; | ||||
| </script> | ||||
| <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="isDebug:1, async:1"></script> | ||||
| <script> | ||||
| require(["dojo/request/xhr", "xlsx"], function(xhr, _XLSX) { | ||||
|   xhr("https://sheetjs.com/pres.numbers", { | ||||
|     headers: { "X-Requested-With": null }, | ||||
| // highlight-next-line | ||||
|     handleAs: "arraybuffer" | ||||
|   }).then(function(ab) { | ||||
|     /* read ArrayBuffer */ | ||||
| // highlight-next-line | ||||
|     var wb = XLSX.read(ab); | ||||
|     /* display first worksheet data */ | ||||
|     var ws = wb.Sheets[wb.SheetNames[0]]; | ||||
|     document.getElementById("tbl").innerHTML = XLSX.utils.sheet_to_html(ws); | ||||
|   }); | ||||
| }); | ||||
| </script> | ||||
| </body> | ||||
| </html> | ||||
							
								
								
									
										50
									
								
								docz/static/dojo/write.html
									
									
									
									
									
										Normal file
									
								
							
							
								
								
								
								
								
									
									
								
							
						
						
									
										50
									
								
								docz/static/dojo/write.html
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,50 @@ | ||||
| <!DOCTYPE html> | ||||
| <html> | ||||
| <head><title>SheetJS + Dojo Write Demo</title></head> | ||||
| <body> | ||||
|   <h1>SheetJS + Dojo Write Demo</h1> | ||||
| 
 | ||||
|   (this HTML page is not minified -- feel free to view source!)<br/><br/> | ||||
|   <a href="https://docs.sheetjs.com">SheetJS CE Documentation</a> | ||||
| <script> | ||||
| dojoConfig = { packages: [ | ||||
|   { name: "xlsx", location: "https://cdn.sheetjs.com/xlsx-latest/package/dist", main: "xlsx.full.min" } | ||||
| ] }; | ||||
| </script> | ||||
| <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="isDebug:1, async:1"></script> | ||||
| <script> | ||||
| require(["dojo/request/xhr", "xlsx"], function(xhr, _XLSX) { | ||||
|   xhr("https://sheetjs.com/data/executive.json", { | ||||
|     headers: { "X-Requested-With": null }, | ||||
|     handleAs: "json" | ||||
|   }).then(function(raw_data) { | ||||
|     /* filter for the Presidents */ | ||||
|     var prez = raw_data.filter(function(row) { | ||||
|       return row.terms.some(function(term) { return term.type === "prez"; }); | ||||
|     }); | ||||
| 
 | ||||
|     /* flatten objects */ | ||||
|     var rows = prez.map(function(row) { return ({ | ||||
|       name: row.name.first + " " + row.name.last, | ||||
|       birthday: row.bio.birthday | ||||
|     }); }); | ||||
| 
 | ||||
|     /* generate worksheet and workbook */ | ||||
|     var worksheet = XLSX.utils.json_to_sheet(rows); | ||||
|     var workbook = XLSX.utils.book_new(); | ||||
|     XLSX.utils.book_append_sheet(workbook, worksheet, "Dates"); | ||||
| 
 | ||||
|     /* fix headers */ | ||||
|     XLSX.utils.sheet_add_aoa(worksheet, [["Name", "Birthday"]], { origin: "A1" }); | ||||
| 
 | ||||
|     /* calculate column width */ | ||||
|     var max_width = rows.reduce(function(w, r) { return Math.max(w, r.name.length); }, 10); | ||||
|     worksheet["!cols"] = [ { wch: max_width } ]; | ||||
| 
 | ||||
|     /* create an XLSX file and try to save to Presidents.xlsx */ | ||||
|     XLSX.writeFile(workbook, "Presidents.xlsx"); | ||||
|   }); | ||||
| }); | ||||
| </script> | ||||
| </body> | ||||
| </html> | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user