AnsweredAssumed Answered

Help Home Button

Question asked by hchapa89 on Apr 25, 2014
Latest reply on Apr 25, 2014 by hchapa89
This is my code below I am new to the JavaScript API can some one explain me why does the home button work.

[HTML] <!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>Home Extent</title>
  <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
  <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css">
  <style>
    html, body, #map {
      padding:0;
      margin:0;
      height:100%;
    }
    #HomeButton {
      position: absolute;
      top: 95px;
      left: 20px;
      z-index: 50;
    }
  </style>
  <script src="//js.arcgis.com/3.9/"></script>
  <script>
 
     require([
     
      "esri/dijit/HomeButton",
      "dojo/domReady!"
    ], function(
     
       HomeButton
    )  {
     
       
      var home = new HomeButton({
        map: map
      }, "HomeButton");
      home.startup();

    });

  
   
  
      require([
        "esri/map", "esri/dijit/HomeButton", "esri/dijit/BasemapGallery", "esri/arcgis/utils",
        "dojo/parser",

        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane",
        "dojo/domReady!"
      ], function(
        Map, HomeButton, BasemapGallery, arcgisUtils,
        parser
      ) {
        
        parser.parse();
      var  map = new Map("map", {
          basemap: "topo",
          center: [-98.185272, 26.282376],
          zoom: 9
        });
        var basemapGallery = new BasemapGallery({
          showArcGISBasemaps: true,
          map: map
        }, "basemapGallery");
        basemapGallery.startup();
       
        basemapGallery.on("error", function(msg) {
          console.log("basemap gallery error:  ", msg);
        });
      });
     
     
     
     
    </script>
   
   
   
  </script>
</head>
<body class="claro">
<div data-dojo-type="dijit/layout/BorderContainer"
         data-dojo-props="design:'headline', gutters:false"
         style="width:100%;height:100%;margin:0;">
  <div id="map" class="map"
          data-dojo-type="dijit/layout/ContentPane">
    <div id="HomeButton"></div>
   
    <div style="position:absolute; right:20px; top:10px; z-Index:999;">
          <div data-dojo-type="dijit/TitlePane"
               data-dojo-props="title:'Switch Basemap', closable:false,  open:false">
            <div data-dojo-type="dijit/layout/ContentPane" style="width:380px; height:280px; overflow:auto;">
            <div id="basemapGallery" ></div></div>
          </div>
        </div>
        </div>
  </div>
</body>
</html>[/HTML]

Outcomes