How to Set ArcGIS as background and Set Zoom level?

Discussion created by vani36384 on Jan 25, 2011
Hi Folks,

I am rookie to ArcGIS map. I am displaying  map as background and placing some objects over it.When i save the page,the objects are going to background & map is coming foreground,so how to set the map as background layer. Second i am placing the objects on street,so i need to Zoom to max and how to do that.Please find my below code,

[HTML]<html xmlns="">
<head runat="server">
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Find Address</title>
    <link rel="stylesheet" type="text/css" href=""/>
    <script type="text/javascript" src=""></script>
    <script type="text/javascript" src=""></script>
<script src="" type="text/javascript"></script>
<script src="" type="text/javascript" ></script>


    <script type="text/javascript">

      var map, locator;

      function init() {
          var initExtent = new esri.geometry.Extent({ xmin: -20098296, ymin: -2804413, xmax: 5920428, ymax: 15813776, spatialReference: { wkid: 54032} });
          map = new esri.Map("map", { extent: initExtent });

//Donot know how to Zoom to max during the onload
//        map.ZoomFactor=0;
//        var Zoom = G_SATELLITE_MAP.getMaximumResolution(point);
//        map.setCenter(point, zoom);
        var tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer("");

        locator = new esri.tasks.Locator("");
        dojo.connect(locator, "onAddressToLocationsComplete", showResults);

        dojo.connect(map, "onExtentChange", showExtent);

      function showExtent(ext) {
          var s = "";
          s = "XMin: " + ext.xmin +
       " YMin: " + ext.ymin +
       " XMax: " + ext.xmax +
       " YMax: " + ext.ymax;
          dojo.byId("onExtentChangeInfo").innerHTML = s;

      function locate() {;
        var add = dojo.byId("address").value.split(",");
        var address = {
          Address : add[0],
          City: add[1],
          State: add[2],
          Zip: add[3]

      function showResults(candidates) {
        var candidate;
        var symbol = new esri.symbol.SimpleMarkerSymbol();
        var infoTemplate = new esri.InfoTemplate("Location", "Address: ${address}<br />Score: ${score}<br />Source locator: ${locatorName}");

        symbol.setColor(new dojo.Color([255,0,0,0.75]));

        var points =  new esri.geometry.Multipoint(map.spatialReference);

        for (var i=0, il=candidates.length; i<il; i++) {
          candidate = candidates[i];
          if (candidate.score > 70) {
            var attributes = { address: candidate.address, score:candidate.score, locatorName:candidate.attributes.Loc_name };
            var geom = esri.geometry.geographicToWebMercator(candidate.location);
            var graphic = new esri.Graphic(geom, symbol, attributes, infoTemplate);
   esri.Graphic(geom, new esri.symbol.TextSymbol(attributes.address).setOffset(0, 8)));

<body class="claro">
    <form id="form1" runat="server">
     Address : <input type="text" id="address" size="60" value="300 Indiana Ave NW,Washington D.C., DC, 20001" /> <i>(Address, City, State, Zip)</i>
    <input type="button" value="Locate" onclick="locate()" /><br />
    <%--<applet code="applet/" archive="applet/DesignApplet.jar" width="800" height="600" name="Diagram Tool"></applet>--%>
    <br />
    <label id="onExtentChangeInfo" runat="server"></label>
    <asp:Panel ID="Panel1" runat="server" Width="550px" Height="400px" style="padding-top: 20px;">
    <div id="map" style="width:550px; height:400px; overflow:hidden; border:1px solid #000;"></div>