{"id":18750334,"url":"https://github.com/silx-kit/h5web","last_synced_at":"2025-04-05T04:10:52.487Z","repository":{"id":36950805,"uuid":"242169831","full_name":"silx-kit/h5web","owner":"silx-kit","description":"React components for data visualization and exploration","archived":false,"fork":false,"pushed_at":"2024-05-13T14:18:59.000Z","size":65190,"stargazers_count":153,"open_issues_count":40,"forks_count":16,"subscribers_count":12,"default_branch":"main","last_synced_at":"2024-05-14T00:27:57.356Z","etag":null,"topics":["data-visualization","hdf5","react","visualization"],"latest_commit_sha":null,"homepage":"https://h5web.panosc.eu/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/silx-kit.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":"support/h5grove/poetry.lock","governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-02-21T15:24:53.000Z","updated_at":"2024-05-16T09:49:17.583Z","dependencies_parsed_at":"2024-01-05T14:25:20.408Z","dependency_job_id":"7069adb8-57bd-46df-aed4-d47f60123cf1","html_url":"https://github.com/silx-kit/h5web","commit_stats":{"total_commits":1931,"total_committers":10,"mean_commits":193.1,"dds":"0.35370274469186946","last_synced_commit":"d23ddad552c7b1fca3585b0f251b75bd01375293"},"previous_names":[],"tags_count":148,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/silx-kit%2Fh5web","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/silx-kit%2Fh5web/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/silx-kit%2Fh5web/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/silx-kit%2Fh5web/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/silx-kit","download_url":"https://codeload.github.com/silx-kit/h5web/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247284949,"owners_count":20913704,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["data-visualization","hdf5","react","visualization"],"created_at":"2024-11-07T17:11:27.638Z","updated_at":"2025-04-05T04:10:52.469Z","avatar_url":"https://github.com/silx-kit.png","language":"TypeScript","readme":"# H5Web: React components for data visualization and exploration\n\n[![Demos](https://img.shields.io/website?down_message=offline\u0026label=demo\u0026up_message=online\u0026url=https%3A%2F%2Fh5web.panosc.eu%2F)](https://h5web.panosc.eu/)\n[![DOI](https://zenodo.org/badge/DOI/10.5281/zenodo.6458452.svg)](https://doi.org/10.5281/zenodo.6458452)\n\nH5Web is a collection of React components to visualize and explore data. It\nconsists of three packages:\n\n- **@h5web/lib**: visualization components built with\n  [react-three-fiber](https://github.com/react-spring/react-three-fiber).\n- **@h5web/app**: a component to explore and visualize data stored in HDF5 (or\n  HDF5-like) files, and data providers to connect this component to various\n  back-end solutions.\n- **@h5web/h5wasm**: an additional data provider that can read HDF5 files\n  straight in the browser.\n\n\u003e While H5Web was initially built with the HDF5 format in mind, `@h5web/lib`\n\u003e visualization components are not tied to HDF5 and can be used to visualize\n\u003e data from any source. Also, `@h5web/app` lets you write your own data provider\n\u003e and can therefore work with any other hierarchical data format.\n\nIf you're after a ready-made solution to view local HDF5 files, take a look at\n[myHDF5](https://myhdf5.hdfgroup.org/), at the\n[Visual Studio Code extension](https://marketplace.visualstudio.com/items?itemName=h5web.vscode-h5web)\nor at the [JupyterLab extension](https://github.com/silx-kit/jupyterlab-h5web).\n\n![H5Web GIF demo](https://user-images.githubusercontent.com/2936402/107791492-4c512980-6d54-11eb-8ba4-4a1433bdfeea.gif)\n\n## NPM packages 📚\n\n### [@h5web/lib](https://www.npmjs.com/package/@h5web/lib)\n\nH5Web's component library, which includes the main visualization components\n(`LineVis`, `HeatmapVis`, etc.) as well as some of their lower-level building\nblocks (`VisCanvas`, `ColorBar`, etc.)\n\nThe library is documented in a Storybook site accessible at\nhttps://h5web-docs.panosc.eu.\n\nSome examples of usage of `@h5web/lib`:\n\n| Multiple curves                                                                                                                                                                                     | Heatmap with color bar                                                                                                                                                                                          | Gamma vs Power scale                                                                                                                                                                                    |\n| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| [![Multiple curves](https://github.com/silx-kit/h5web/assets/2936402/0c967dbc-b70b-43e1-93aa-f340889da01a)](https://codesandbox.io/p/sandbox/h5weblib-multiple-curves-46kppn?file=%2Fsrc%2FApp.tsx) | [![Heatmap with color bar](https://github.com/silx-kit/h5web/assets/2936402/0677a610-3812-4867-a9e6-967ec7d36675)](https://codesandbox.io/p/sandbox/h5weblib-heatmap-with-tooltip-4nc9hp?file=%2Fsrc%2FApp.tsx) | [![Gamma vs Power scale](https://github.com/silx-kit/h5web/assets/2936402/71c5bebb-7d12-4315-8382-d2e36d5240f2)](https://codesandbox.io/p/sandbox/h5weblib-gamma-vs-power-kksyd7?file=%2Fsrc%2FApp.tsx) |\n\n### [@h5web/app](https://www.npmjs.com/package/@h5web/app)\n\nHDF5 viewer component (`App`) and built-in data providers.\n\nData providers are components that fetch data from HDF5 back-end solutions and\nprovide this data to the app through React Context. H5Web currently includes\nthree providers, two of which are available in the `@h5web/app` package:\n\n- `H5GroveProvider` for server implementations based on\n  [h5grove](https://github.com/silx-kit/h5grove), like\n  [jupyterlab-h5web](https://github.com/silx-kit/jupyterlab-h5web)\n- `HsdsProvider` for [HSDS](https://github.com/HDFGroup/hsds)\n\n### [@h5web/h5wasm](https://www.npmjs.com/package/@h5web/h5wasm)\n\nThis package includes two additional data providers, `H5WasmLocalFileProvider`\nand `H5WasmBufferProvider`, that can read HDF5 files straight in the browser\nthanks to the [h5wasm](https://github.com/usnistgov/h5wasm) library.\n\n## Demos\n\nThe [demo app](https://h5web.panosc.eu/) demonstrates the use of the built-in\ndata providers and visualizations. Several demos are available, one per data\nprovider:\n\n- [**H5GroveProvider**](https://h5web.panosc.eu/h5grove)\n- [**HsdsProvider**](https://h5web.panosc.eu/hsds)\n- [**H5WasmLocalFileProvider**](https://h5web.panosc.eu/h5wasm) (when browsing\n  for a local file)\n- [**H5WasmBufferProvider**](https://h5web.panosc.eu/h5wasm) (when supplying the\n  URL of a remote file)\n- [**MockProvider**](https://h5web.panosc.eu/mock)\n\n## Ecosystem\n\nCheck out these projects from the H5Web ecosystem:\n\n- [myHDF5](https://myhdf5.hdfgroup.org/) – online HDF5 file viewing service\n- [jupyterlab-h5web](https://github.com/silx-kit/jupyterlab-h5web) – H5Web\n  extension for JupyterLab\n- [vscode-h5web](https://github.com/silx-kit/vscode-h5web) – H5Web extension for\n  Visual Studio Code\n- [h5whale](https://github.com/silx-kit/h5whale) – full-stack Docker application\n  to visualise HDF5 files\n- [h5grove](https://github.com/silx-kit/h5grove) – core utilities to serve HDF5\n  file contents\n\n## Contributing\n\nWant to help improve H5Web? We're always looking for feedback, bug reports and\nfeature requests, so don't hesitate to\n[open an issue](https://github.com/silx-kit/h5web/issues/new/choose) or\n[start a discussion](https://github.com/silx-kit/h5web/discussions).\n\nIf you'd like to know more about contributing to the codebase, please check out\nthe [CONTRIBUTING](CONTRIBUTING.md) guide.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsilx-kit%2Fh5web","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsilx-kit%2Fh5web","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsilx-kit%2Fh5web/lists"}