Marriage in NY by ZIP

by Alex Azuero

HTML

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Query features from a FeatureLayerView - 4.0</title>

  <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css">
  <script src="https://js.arcgis.com/4.0/"></script>

  <script>
    require([
        "esri/Map",
        "esri/views/MapView",

        "esri/layers/FeatureLayer",

        "esri/PopupTemplate",

        "dijit/a11yclick",

        "dojo/on",

        "dojo/dom",
        "dojo/dom-attr",
        "dojo/dom-construct",

        "dojo/domReady!"
      ],
      function(
        Map, MapView,
        FeatureLayer,
        PopupTemplate,
        a11yclick,
        on,
        dom, domAttr, domConstruct
      ) {

        var map = new Map({
          basemap: "dark-gray"
        });

        var view = new MapView({
          container: "sceneDiv",
          map: map,
          center: [-73.950, 40.702],
          zoom: 11,
          padding: {
            right: 300
          }
        });

        var listNode = dom.byId("nyc_graphics");

        /********************
         * Add feature layer
         ********************/

        // Create the PopupTemplate
        var tpl = new PopupTemplate({
          title: "Marriage in NY, Zip Code: {ZIP}",
          content: "<p><b> Marriage Rate: {MARRIEDRATE}% </b></p>" +
            "<p> Married: {MARRIED_CY}</p>" +
            "<p> Never Married: {NEVMARR_CY}</p>" +
            "<p> Divorced: {DIVORCD_CY}</p>"
        });

        // Create the FeatureLayer using the popupTemplate
        var featureLayer = new FeatureLayer({
          url: "http://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/NYCDemographics1/FeatureServer/0",
          outFields: ["*"],
          popupTemplate: tpl
        });
        map.add(featureLayer);

        var graphics;

        view.whenLayerView(featureLayer).then(function(lyrView) {
         ...