JSFiddle - React, Tailwind, and code Playground

by Alex Azuero

HTML

<!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>Layer in a map service - [ON-DEMAND]</title>

  <link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css">
  <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css" />

  <script src="https://js.arcgis.com/3.16/"></script>
  <script>
    var map;

    require([
      "esri/InfoTemplate",
      "esri/map",
      "esri/layers/FeatureLayer",
      "esri/symbols/SimpleFillSymbol",
      "esri/symbols/SimpleLineSymbol",
      "esri/tasks/query",
      "esri/toolbars/draw",
      "dojo/dom",
      "dojo/on",
      "dojo/parser",
      "dojo/_base/array",
      "esri/Color",
      "dijit/form/Button",
      "dojo/domReady!"
    ],
      function (
        InfoTemplate, Map, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol,
        Query, Draw, dom, on, parser, arrayUtil, Color
      ) {

        parser.parse();

        var selectionToolbar, featureLayer;

        map = new Map("map", {
          basemap: "streets",
          center: [-97.395, 37.537],
          zoom: 11
        });

        map.on("load", initSelectToolbar);

        var fieldsSelectionSymbol =
          new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
            new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
          new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.5]));

        var content = "<b>Status</b>: ${STATUS}" +
                      "<br><b>Cumulative Gas</b>: ${CUMM_GAS} MCF" +
                      "<br><b>Total Acres</b>: ${APPROXACRE}" +
                      "<br><b>Avg. Field Depth</b>: ${AVG_DEPTH} meters";
        var infoTemplate = new InfoTemplate("${FIELD_NAME}", content);

        featureLayer = new FeatureLayer("https://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1",
          {
         ...