Examples - Githubissues

Kerchunk example
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Untitled</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
  </head>
  <body>
    <p>Things are in the console - look there</p>
    <!--
    JSPM Generator Import Map
    Edit URL: https://generator.jspm.io/#U2NhYGBkDM0rySzJSU1hqEosKnIw0DPTMwQArVL7dRkA
  -->
    <script type="importmap">
      {
        "imports": {
          "reference-spec-reader": "https://ga.jspm.io/npm:reference-spec-reader@0.1.3/src/index.js",
          "zarr": "https://ga.jspm.io/npm:zarr@0.6.1/zarr.mjs"
        }
      }
    </script>
    
    <!-- ES Module Shims: Import maps polyfill for modules browsers without import maps support (all except Chrome 89+) -->
    <script
      async
      src="https://ga.jspm.io/npm:es-module-shims@1.7.0/dist/es-module-shims.js"
      crossorigin="anonymous"
    ></script>

    <script type="module">
      import * as zarr from "zarr";
      import { ReferenceStore } from "reference-spec-reader";
      const { HTTPStore, slice, openArray, NestedArray } = zarr;

      const date = "20230310";
      const URL = `https://mnemosyne.somisana.ac.za/somisana/marine-heat-waves/${date}.kerchunk.json`;
      const variable = "marine_heat_waves";
      const zArray = `${variable}/.zarray`;
      const zChunk = `${variable}/0.0.0`;

      const refs = await fetch(URL).then((res) => res.json());
      const store = ReferenceStore.fromJSON(refs);
      const { dtype, shape } = JSON.parse(store.ref.get(zArray));

      console.info("Fetching binary array... (look at your network tab)");
      const binaryData = await store.getItem(zChunk);
      const nArray = new NestedArray(binaryData, shape, dtype);
      window.nArray = nArray;
      console.info(
        'Done. Access the Zarr.js NestedArray instance on the browser window object (just type "nArray" or "window.nArray" in this console)'
      );
    </script>
  </body>
</html>
SAEON / mnemosyne

Examples #8
