JSFiddle - React, Tailwind, and code Playground

Working w closure. Read photo Exif info and place in an Esri map with popup

by Bryan McIntosh

HTML

<script src="https://rawgit.com/exif-js/exif-js/master/exif.js"></script>
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Flickr</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.24/esri/css/esri.css">
    <style>
      html, body, #map {height:100%; width:100%; margin:0; padding:0;}
      .esriScalebar{padding: 20px 20px;}
      #map{padding:0;}
    </style>
    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="https://js.arcgis.com/3.24/"></script>
    <script>
      var map;
      require([
        "esri/map", "esri/layers/FeatureLayer",
        "esri/dijit/PopupTemplate", "esri/request",
        "esri/geometry/Point", "esri/graphic",
        "dojo/on", "dojo/_base/array",
        "dojo/domReady!"
      ], function(
        Map, FeatureLayer,
        PopupTemplate, esriRequest,
        Point, Graphic,
        on, array
      ) {

        var featureLayer;

        map = new Map("map", {
          basemap: "satellite",
          center: [ -80.429517, 43.543426],
          zoom: 8
        });

        //create a feature collection for the photos
        var featureCollection = {
          "layerDefinition": null,
          "featureSet": {
            "features": [],
            "geometryType": "esriGeometryPoint"
          }
        };
        featureCollection.layerDefinition = {
          "geometryType": "esriGeometryPoint",
          "objectIdField": "ObjectID",
          "fields": [{
            "name": "ObjectID",
            "alias": "ObjectID",
            "type": "esriFieldTypeOID"
          }, {
            "name": "description",
            "alias": "Description",
            "type": "esriFieldTypeString"
          }, {
            "name": "title",
            "alias": "Title",
            "type": "esriFieldTypeString"
          }]
        };

        //define a...