diff --git a/biome.json b/biome.json index 42cf38bb..c7796cb7 100644 --- a/biome.json +++ b/biome.json @@ -7,7 +7,7 @@ }, "files": { "ignoreUnknown": false, - "includes": ["**", "!**/dist/**/*", "!**/coverage/**/*", "!**/.astro/**/*"] + "includes": ["**", "!**/dist/**/*", "!**/coverage/**/*", "!**/.astro/**/*", "!**/*.astro"] }, "formatter": { "enabled": true, diff --git a/site/astro.config.mjs b/site/astro.config.mjs index 1dd8e788..8eb42bd7 100644 --- a/site/astro.config.mjs +++ b/site/astro.config.mjs @@ -29,7 +29,7 @@ export default defineConfig({ autogenerate: { directory: 'packages' }, }, { - label: 'Developers', + label: 'Vis Package Developers', autogenerate: { directory: 'developers' }, }, ], diff --git a/site/src/components/PackageManagerTabs.astro b/site/src/components/PackageManagerTabs.astro new file mode 100644 index 00000000..d70400d1 --- /dev/null +++ b/site/src/components/PackageManagerTabs.astro @@ -0,0 +1,23 @@ +--- +import { Tabs, TabItem, Code } from '@astrojs/starlight/components'; + +interface Props { + npm: string; + pnpm: string; + yarn: string; +} + +const { npm, pnpm, yarn } = Astro.props; +--- + + + + + + + + + + + + diff --git a/site/src/content/docs/getting-started/packages.md b/site/src/content/docs/getting-started/packages.md index 8f87586d..887b615d 100644 --- a/site/src/content/docs/getting-started/packages.md +++ b/site/src/content/docs/getting-started/packages.md @@ -7,14 +7,19 @@ sidebar: The `AllenInstitute/vis` repository holds multiple published packages. The current list of packages is below: -- `vis-core`: A collection of useful utilities used to build our big-data, scalable, data visualization tools, including the DZI viewer, OME-Zarr viewer, and our scatterplot tool "Scatterbrain" for the [ABC Atlas](https://knowledge.brain-map.org/abcatlas) in the Brain Knowledge Platform web application -- `vis-dzi`: A renderer for [Deep Zoom Images](https://en.wikipedia.org/wiki/Deep_Zoom) -- `vis-geometry`: A collection of vector functions for 2D and 3D geometry -- `vis-omezarr`: A renderer for [OME-Zarr](https://ngff.openmicroscopy.org/latest/) datasets +- `vis-core`: A collection of useful utilities used to build our big-data, scalable, data visualization tools, including the DZI viewer, OME-Zarr viewer, and our scatterplot tool "Scatterbrain" for the [ABC Atlas](https://knowledge.brain-map.org/abcatlas) in the Brain Knowledge Platform web application +- `vis-dzi`: A renderer for [Deep Zoom Images](https://en.wikipedia.org/wiki/Deep_Zoom) +- `vis-geometry`: A collection of vector functions for 2D and 3D geometry +- `vis-omezarr`: A renderer for [OME-Zarr](https://ngff.openmicroscopy.org/latest/) datasets +- `vis-scatterbrain`: A scatterplot viewer optimized for visualizing large datasets, such as those in the [ABC Atlas](https://knowledge.brain-map.org/abcatlas) To install and use these packages, see the instructions on [using packages](../using-packages). ## Future Packages -- `@alleninstitute/vis-scatterbrain` - Code for building scatterplots -- `@alleninstitute/vis-react` - React component implementations of each of the visualization packages. +The following is a list of packages that we would like to create in the future. + +If you are interested in contributing to the development of any of these packages, please reach out on GitHub to get started! +- `vis-components` - A collection of web components for displaying visualizations built with our `vis` packages +- `vis-react` - React component implementations of each of the visualization packages +- `vis-[your favorite framework]` - Any other framework-specific implementations of our visualization packages, as driven by community needs diff --git a/site/src/content/docs/index.mdx b/site/src/content/docs/index.mdx index 2976dc41..32ca36d3 100644 --- a/site/src/content/docs/index.mdx +++ b/site/src/content/docs/index.mdx @@ -7,12 +7,12 @@ hero: image: file: ../../assets/umap.png actions: + - text: Get Started + link: /vis/getting-started/packages + variant: primary - text: Examples link: /vis/examples/omezarr1 - icon: right-arrow - - text: Read the docs - link: /vis/getting-started/packages/ - variant: minimal + variant: secondary --- import { Card, CardGrid } from '@astrojs/starlight/components'; @@ -22,14 +22,14 @@ import { Card, CardGrid } from '@astrojs/starlight/components'; The [Allen Brain Cell Atlas (ABC Atlas)](https://knowledge.brain-map.org/abcatlas) - uses `@alleninstitue/vis-core` to visualize millions of points of data in the browser. + uses `@alleninstitute/vis-core` to visualize millions of points of data in the browser. The [Genetic Tools Atlas (GTA)](https://knowledge.brain-map.org/data/7CVKSF7QGAKIQ8LM5LC/specimens/HTS03VQD4BBB67I3BAP) uses `@alleninstitute/vis-omezarr` to display OME-Zarr previews. - The [SEA-AD project](https://dev-knowledge.brain-map.org/data/JGN327NUXRZSHEV88TN/specimens/JGCXWER774NLNWX2NNR) + The [SEA-AD project](https://knowledge.brain-map.org/data/JGN327NUXRZSHEV88TN/specimens/JGCXWER774NLNWX2NNR) uses `@alleninstitute/vis-dzi` to display Deep Zoom Image (DZI) views. diff --git a/site/src/content/docs/packages/core.md b/site/src/content/docs/packages/core.mdx similarity index 93% rename from site/src/content/docs/packages/core.md rename to site/src/content/docs/packages/core.mdx index 036200f1..be39f0a2 100644 --- a/site/src/content/docs/packages/core.md +++ b/site/src/content/docs/packages/core.mdx @@ -1,8 +1,21 @@ --- title: Core -description: Documentation for the `@alleninstiute/vis-core` package +description: Documentation for the `@alleninstitute/vis-core` package --- +import PackageManagerTabs from '../../../components/PackageManagerTabs.astro'; + +## Installation + +To install the `@alleninstitute/vis-core` package, make sure you've followed the instructions for [authenticating +with the Allen Institute's npm registry on GitHub](../../getting-started/using-packages), then run the following command in your terminal: + + + ## How To use generic rendering tools for your cool data ### Use case diff --git a/site/src/content/docs/packages/dzi.mdx b/site/src/content/docs/packages/dzi.mdx index 43ebce9b..7981d9dc 100644 --- a/site/src/content/docs/packages/dzi.mdx +++ b/site/src/content/docs/packages/dzi.mdx @@ -1,8 +1,27 @@ --- title: DZI -description: Documentation for the `@alleninstiute/vis-dzi` package +description: Documentation for the `@alleninstitute/vis-dzi` package --- import { Aside } from '@astrojs/starlight/components'; +import PackageManagerTabs from '../../../components/PackageManagerTabs.astro'; + +# Installation + +To install the `@alleninstitute/vis-dzi` package, make sure you've followed the instructions for [authenticating +with the Allen Institute's npm registry on GitHub](../../getting-started/using-packages), then run the following command in your terminal: + + + +## Examples + +There is one DZI example to view: +- [Linked views with an SVG overlay](../../examples/dzi) + +## Usage diff --git a/site/src/content/docs/packages/geometry.mdx b/site/src/content/docs/packages/geometry.mdx index 339449e5..0c2f5070 100644 --- a/site/src/content/docs/packages/geometry.mdx +++ b/site/src/content/docs/packages/geometry.mdx @@ -1,8 +1,22 @@ --- title: Geometry -description: Documentation for the `@alleninstiute/vis-geometry` package +description: Documentation for the `@alleninstitute/vis-geometry` package --- import { Aside } from '@astrojs/starlight/components'; +import PackageManagerTabs from '../../../components/PackageManagerTabs.astro'; + +## Installation + +To install the `@alleninstitute/vis-geometry` package, make sure you've followed the instructions for [authenticating +with the Allen Institute's npm registry on GitHub](../../getting-started/using-packages), then run the following command in your terminal: + + + +## Usage diff --git a/site/src/content/docs/packages/ome-zarr.mdx b/site/src/content/docs/packages/ome-zarr.mdx index 63b7a9af..e322dab7 100644 --- a/site/src/content/docs/packages/ome-zarr.mdx +++ b/site/src/content/docs/packages/ome-zarr.mdx @@ -1,8 +1,29 @@ --- title: OME-Zarr -description: Documentation for the `@alleninstiute/vis-omezarr` package +description: Documentation for the `@alleninstitute/vis-omezarr` package --- import { Aside } from '@astrojs/starlight/components'; +import PackageManagerTabs from '../../../components/PackageManagerTabs.astro'; + +## Installation + +To install the `@alleninstitute/vis-omezarr` package, make sure you've followed the instructions for [authenticating +with the Allen Institute's npm registry on GitHub](../../getting-started/using-packages), then run the following command in your terminal: + + + +## Examples + +There are three OME-Zarr examples to view: +- [Basic example with a few selectable datasets that shows the viewer and the dataset metadata](../../examples/omezarr1) +- [Basic example but using our priority cache from `@alleninstitute/vis-core`](../../examples/omezarr2-priority) +- [Gallery example of multiple viewers sharing the same web context](../../examples/omezarr3-gallery) + +## Usage diff --git a/site/src/content/docs/packages/scatterbrain.mdx b/site/src/content/docs/packages/scatterbrain.mdx new file mode 100644 index 00000000..c62c76b8 --- /dev/null +++ b/site/src/content/docs/packages/scatterbrain.mdx @@ -0,0 +1,27 @@ +--- +title: Scatterbrain +description: Documentation for the `@alleninstitute/vis-scatterbrain` package +--- + +import { Aside } from '@astrojs/starlight/components'; +import PackageManagerTabs from '../../../components/PackageManagerTabs.astro'; + +## Installation + +To install the `@alleninstitute/vis-scatterbrain` package, make sure you've followed the instructions for [authenticating +with the Allen Institute's npm registry on GitHub](../../getting-started/using-packages), then run the following command in your terminal: + + + +## Examples + +There is one Scatterbrain example to view: +- [Basic example](../../examples/scatterbrain) + +## Usage + +