JSFiddle - React, Tailwind, and code Playground

by borcagos

HTML

<html>

  <head>
    <meta name="description" content="DevLab: Style a feature layer">
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>ArcGIS JavaScript Tutorials: Style a feature layer</title>
    <style>
      html,
      body,
      #viewDiv {
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }

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



  <body>
    <div id="viewDiv"></div>
  </body>

</html>

JavaScript

require([
      "esri/Map",
      "esri/views/MapView",
      "esri/layers/FeatureLayer",
      "esri/layers/MapImageLayer"
    ],
    function(
      Map,
      MapView,
      FeatureLayer,
      MapImageLayer
    ) {

      var map = new Map({
        basemap: "topo-vector"
      });

      var view = new MapView({
        container: "viewDiv",
        map: map,
        center: [36.09, 52.97], // [36.6, 50.6]; //бел
        zoom: 12,
      });
      const ROAD_URL = 'https://ms-ts-gis-db2.rainvest.local/arcgis/rest/services/common/fields_sowing/MapServer'
      /*const ROAD_URL = 'https://ms-ts-gis-db2.rainvest.local/arcgis/rest/services/common/fields_sowing/MapServer/4'*/

var layer = new MapImageLayer({
        url: ROAD_URL,
        sublayers: [
             {
               id: 3,
               visible: false
             }, {
               id: 2,
               visible: false
             }, {
               id: 1,
               visible: false
             }, {
               id: 0,
               visible: false
             }, {
               id: 4,
               visible: true
             }
           ],
        title: 'title',
        id: 'layer_id',
        outFields: ['*'],
        popupTemplate: {},
        visible: true,
      })

/*
      var layer = new MapImageLayer({
        url: ROAD_URL,
        title: 'title',
        id: 'layer_id',
        outFields: ['*'],
        popupTemplate: {},
        visible: true,
      })*/
      map.add(layer, 0);
      /**/
    });