Commit 9cc3df91 authored by Amy Stamile's avatar Amy Stamile
Browse files

Render thumbnails on click of footprint.

parent 9cb5c31d

app/package.json

+1 −0
Original line number Diff line number Diff line
@@ -89,6 +89,7 @@ 
    "proj4leaflet": "^1.0.2",

    "react": "^17.0.2",

    "react-dom": "^17.0.2",

    "stac-layer": "^0.8.0",

    "wicket": "^1.3.8"

  }

}

app/src/js/AstroMap.js

+13 −3
Original line number Diff line number Diff line
@@ -4,6 +4,7 @@ import AstroProj from "./AstroProj"; 
import LayerCollection from "./LayerCollection";

import { getItemCollection, setNumberMatched, setMaxNumberPages, getCurrentPage, setCurrentPage } from "./ApiJsonCollection";

import { MY_JSON_MAPS } from "./layers";

import stacLayer from 'stac-layer/src/index.js';



/**

 * @class AstroMap
@@ -140,9 +141,7 @@ export default L.Map.AstroMap = L.Map.extend({ 
        this._geoLayers = new Array(result.length);

        for (let i = 0; i < result.length; i++) {

          this._geoLayers[i] = L.geoJSON()

            .on('click', function(e){

              console.log(e);

            }).addTo(this);

            .on({click: handleClick}).addTo(this);

          matched += result[i].numberMatched;

          for (let j = 0; j < result[i].features.length; j++) {

            this._footprintCollection[result[i].features[j].collection] = this._geoLayers[i];
@@ -155,6 +154,17 @@ export default L.Map.AstroMap = L.Map.extend({ 
      }

      setNumberMatched(matched);

    });



    function handleClick(e) {

      const url_to_stac_item = e.layer.feature.links[0].href;

      fetch(url_to_stac_item).then(res => res.json()).then(async feature => {

        const thumbnail = await L.stacLayer(feature, {displayPreview: true});

        thumbnail.on("click", e => {

          this.removeLayer(thumbnail);

        })

        thumbnail.addTo(this);

      });

    }

  },



  /**

package.json

0 → 100644
+5 −0
Original line number Diff line number Diff line 
{

  "dependencies": {

    "stac-layer": "^0.9.0"

  }

}