Skip to content

Commit f31c4ab

Browse files
authored
Update README.md
1 parent c69f6a2 commit f31c4ab

File tree

1 file changed

+34
-30
lines changed

1 file changed

+34
-30
lines changed

README.md

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -280,78 +280,59 @@ A data URL may be significantly less efficient than [URL.createObjectURL](https:
280280

281281
See [File Attachments](https://observablehq.com/@observablehq/file-attachments) on Observable for examples.
282282

283-
<a href="#FileAttachments" name="FileAttachments">#</a> <br>FileAttachments</b>(<i>resolve</i>) [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
283+
<a href="#FileAttachment" name="FileAttachment">#</a> <b>FileAttachment</b>(<i>name</i>) [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
284284

285-
The **FileAttachments** function exported by the standard library is an abstract class that can be used to fetch files by name from remote URLs. To make it concrete, you call it with a *resolve* function, which is an async function that takes a *name* and returns a URL at which the file of that name may be loaded. For example:
286-
287-
```js
288-
const FileAttachment = FileAttachments((name) =>
289-
`https://my.server/notebooks/demo/${name}`
290-
);
291-
```
292-
293-
Or, with a more complex example, calling an API to produce temporary URLs:
294-
295-
```js
296-
const FileAttachment = FileAttachments(async (name) =>
297-
if (cachedUrls.has(name)) return cachedUrls.get(name);
298-
const url = await fetchSignedFileUrl(notebookId, name);
299-
cachedUrls.set(name, url);
300-
return url;
301-
);
302-
```
303-
304-
Once you have your **FileAttachment** function defined, you can call it from notebook code:
285+
Returns the file attachment with the given *name*, or throws an error if there is no file with the given name.
305286

306287
```js
307288
photo = FileAttachment("sunset.jpg")
308289
```
309290

310291
FileAttachments work similarly to the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch), providing methods that return promises to the file’s contents in a handful of convenient forms.
311292

312-
<a href="#FileAttachment_url" name="FileAttachment_url">#</a> FileAttachment(name).<b>url</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
293+
<a href="#attachment_url" name="attachment_url">#</a> *attachment*.<b>url</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
313294

314295
Returns a promise to the URL at which the file may be retrieved.
315296

316297
```js
317298
const url = await FileAttachment("file.txt").url();
318299
```
319300

320-
<a href="#FileAttachment_text" name="FileAttachment_text">#</a> FileAttachment(name).<b>text</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
301+
<a href="#attachment_text" name="attachment_text">#</a> *attachment*.<b>text</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
321302

322303
Returns a promise to the file’s contents as a JavaScript string.
323304

324305
```js
325306
const data = d3.csvParse(await FileAttachment("cars.csv").text());
326307
```
327308

328-
<a href="#FileAttachment_json" name="FileAttachment_json">#</a> FileAttachment(name).<b>json</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
309+
<a href="#attachment_json" name="attachment_json">#</a> *attachment*.<b>json</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
329310

330311
Returns a promise to the file’s contents, parsed as JSON into JavaScript values.
331312

332313
```js
333314
const logs = await FileAttachment("weekend-logs.json").json();
334315
```
335316

336-
<a href="#FileAttachment_image" name="FileAttachment_image">#</a> FileAttachment(name).<b>image</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
317+
<a href="#attachment_image" name="attachment_image">#</a> *attachment*.<b>image</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
337318

338-
Returns a promise to a file loaded as an [HTML Image](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image). Note that the promise won't resolve until the image has finished loadingmaking this a useful value to pass to other cells that need to process the image, or paint it into a `<canvas>`.
319+
Returns a promise to a file loaded as an [Image](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image). The promise resolves when the image has finished loading, making this useful for reading the image pixels in Canvas, or for loading the image into a WebGL texture. consider [*attachment*.url](#attachment_url) if you want to embed an image in HTML or Markdown.
339320

340321
```js
341322
const image = await FileAttachment("sunset.jpg").image();
342323
```
343324

344-
<a href="#FileAttachment_arrayBuffer" name="FileAttachment_arrayBuffer">#</a> FileAttachment(name).<b>arrayBuffer</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
325+
<a href="#attachment_arrayBuffer" name="attachment_arrayBuffer">#</a> *attachment*.<b>arrayBuffer</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
345326

346327
Returns a promise to the file’s contents as an [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer).
347328

348329
```js
349330
const city = shapefile.read(await FileAttachment("sf.shp").arrayBuffer());
350331
```
351332

352-
<a href="#FileAttachment_stream" name="FileAttachment_stream">#</a> FileAttachment(name).<b>stream</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
333+
<a href="#attachment_stream" name="attachment_stream">#</a> *attachment*.<b>stream</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
353334

354-
Returns a promise to a [Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) of the file’s contents.
335+
Returns a promise to a [ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) of the file’s contents.
355336

356337
```js
357338
const stream = await FileAttachment("metrics.csv").stream();
@@ -362,14 +343,37 @@ while (({done, value} = await reader.read()), !done) {
362343
}
363344
```
364345

365-
<a href="#FileAttachment_blob" name="FileAttachment_blob">#</a> FileAttachment(name).<b>blob</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
346+
<a href="#attachment_blob" name="attachment_blob">#</a> *attachment*.<b>blob</b>() [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
366347

367348
Returns a promise to a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob) containing the raw contents of the file.
368349

369350
```js
370351
const blob = await FileAttachment("binary-data.dat").blob();
371352
```
372353

354+
<a href="#FileAttachments" name="FileAttachments">#</a> <b>FileAttachments</b>(<i>resolve</i>) [<>](https://github.com/observablehq/stdlib/blob/master/src/fileAttachment.js "Source")
355+
356+
*Note: this function is not part of the Observable standard library (in notebooks), but is provided by this module as a means for defining custom file attachment implementations when working directly with the Observable runtime.*
357+
358+
Returns a [*FileAttachment*](#FileAttachment) function given the specified *resolve* function. The *resolve* function is an async function that takes a *name* and returns a URL at which the file of that name can be loaded. For example:
359+
360+
```js
361+
const FileAttachment = FileAttachments((name) =>
362+
`https://my.server/notebooks/demo/${name}`
363+
);
364+
```
365+
366+
Or, with a more complex example, calling an API to produce temporary URLs:
367+
368+
```js
369+
const FileAttachment = FileAttachments(async (name) =>
370+
if (cachedUrls.has(name)) return cachedUrls.get(name);
371+
const url = await fetchSignedFileUrl(notebookId, name);
372+
cachedUrls.set(name, url);
373+
return url;
374+
);
375+
```
376+
373377
### Generators
374378

375379
<a href="#Generators_disposable" name="Generators_disposable">#</a> Generators.<b>disposable</b>(<i>value</i>, <i>dispose</i>) [<>](https://github.com/observablehq/stdlib/blob/master/src/generators/disposable.js "Source")

0 commit comments

Comments
 (0)