ArcGIS API Layer Hide/Show

by Vignesh Gopalakrishnan

HTML

<link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.14/dijit/themes/claro/claro.css">
<script src="http://js.arcgis.com/3.14/"></script>Layer List : <span id="layer_list">
    <input type='checkbox' class='list_item' id='layer0CheckBox' value=0 />Cities&nbsp;&nbsp;

    </span>

<br />
<br />
<div id="map" class="claro" style="width:600px; height:400px; border:1px solid #000;"></div>

CSS

html, body, #map {
          height: 100%;
          width: 100%;
          margin: 0;
          padding: 0;
      }
      body {
          background-color: #FFF;
          overflow: hidden;
          font-family:"Trebuchet MS";
      }

JavaScript

var map;

  require([
        "esri/map",
        "dojo/_base/array",
        "esri/layers/ArcGISDynamicMapServiceLayer",
        "esri/geometry/Geometry",
        "esri/geometry/Point",
        "esri/geometry/webMercatorUtils",
        "esri/graphic",
        "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/symbols/PictureMarkerSymbol",
        "esri/Color",
        "esri/InfoTemplate",
        "esri/layers/GraphicsLayer",
        "dijit/layout/BorderContainer", 
        "dijit/layout/ContentPane",
        "dojo/domReady!"
        ], function(Map, arrayUtils, ArcGISDynamicMapServiceLayer, Geometry, Point, webMercatorUtils,  Graphic, SimpleMarkerSymbol, SimpleLineSymbol, SimpleFillSymbol,PictureMarkerSymbol,  Color, InfoTemplate, GraphicsLayer) {
          var layer1, layer2;
      var pointInfoTemplate, pointInfoTemplate2;

          map = new Map("map", {
              basemap: "topo",
              center: [-106.61, 35.1107],
              zoom: 8
          });

          function drawSeries1() {
              var point = new esri.geometry.Point(-106.61, 35.1107);
              point = esri.geometry.geographicToWebMercator(point);
              var symbol = new esri.symbol.PictureMarkerSymbol("https://cdn1.iconfinder.com/data/icons/Map-Markers-Icons-Demo-PNG/128/Map-Marker-Marker-Outside-Chartreuse.png", 32, 32);
              pointInfoTemplate = new InfoTemplate(); 
              pointInfoTemplate.setTitle("Project Details");
              pointInfoTemplate.setContent('<div>Some Att Here</div> ');
              var graphic = new esri.Graphic(point, symbol).setInfoTemplate(pointInfoTemplate);
              layer1 = new esri.layers.GraphicsLayer();
              layer1.add(graphic);
              map.addLayer(layer1);

          }
          drawSeries1();
          layer1.hide();
      function drawSeries2() {
          var point2 = new esri.geometry.Point(-105.2, 35.1207);
      ...