jsn

Toolbar the Zoom In button only works once

Discussion created by jsn on Aug 23, 2013
Hi all

I am using the Toolbar from this sample:  https://developers.arcgis.com/en/javascript/jssamples/toolbar_navigation.html

but in my program when I Zoom In the first time it works but the second time it looks like it gets confused with the Pan button, so it does not Zoom in, and it draws the zoom in window from bottom to top even if the zoom in is drawn from top to botton.

//create the map and specify the custom info window as the info window that will
    //be used by the map
    map = new esri.Map("map", {
        extent: mapExtent
    });

    // Loading image
    //
    dojo.connect(map, "onUpdateStart", showLoading);
    dojo.connect(map, "onUpdateEnd", hideLoading);


    //Takes a URL to a map in a map service.
    var dynamicUrl = "";
     dynamicUrl = "http://...../ArcGIS/rest/services/OneLayer/MapServer"


    var dynamicLayer = new esri.layers.ArcGISDynamicMapServiceLayer(dynamicUrl);

    legendLayers.push({ layer: dynamicLayer, title: "Dolfin" });

    dojo.connect(map, 'onLayersAddResult', function (results) {
        //add the legend 
        var legend = new esri.dijit.Legend({
            map: map,
            layerInfos: legendLayers,
            arrangement: esri.dijit.Legend.ALIGN_LEFT
        }, "legendDiv");
        legend.startup();

        var standardTOC = new agsjs.dijit.TOC({
            map: map
        }, 'standardDiv');
        standardTOC.startup();

   });


    map.addLayers([dynamicLayer]);

      //define the info template that is used to display the popup content. 
      var infoTemplate1 = new esri.InfoTemplate("Attributes", "${*}");


        //create the feature layer (street trees of San Francisco)
      var featureLayer = new esri.layers.FeatureLayer("http://jsancn-3-doug/ArcGIS/rest/services/OneLayer/MapServer/0",{
          mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
        infoTemplate: infoTemplate1,
        outFields: ["*"]
      });

     map.addLayers([featureLayer]);

      //resize the info window 
      map.infoWindow.resize(180, 75);

    navToolbar = new esri.toolbars.Navigation(map);

    dojo.connect(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler);

    dojo.connect(map, 'onLayersAddResult', function (results) {

        //add check boxes 
        dojo.forEach(legendLayers, function (layer) {
            var layerName = layer.title;
            var checkBox = new dijit.form.CheckBox({
                name: "checkBox" + layer.layer.id,
                value: layer.layer.id,
                checked: layer.layer.visible,
                onChange: function (evt) {
                    var clayer = map.getLayer(this.value);
                    clayer.setVisibility(!clayer.visible);
                    this.checked = clayer.visible;
                }
            });

            //add the check box and label to the toc
            dojo.place(checkBox.domNode, dojo.byId("toggle"), "after");
            var checkLabel = dojo.create('label', { 'for': checkBox.name, innerHTML: layerName }, checkBox.domNode, "after");
            dojo.place("<br />", checkLabel, "after");

        });

    });


    //resize the map when the browser resizes - view the 'Resizing and repositioning the map' section in 
    //the following help topic for more details http://help.esri.com/EN/webapi/javascript/arcgis/help/jshelp_start.htm#jshelp/inside_faq.htm

    //              dojo.connect(map, 'onLoad', function (theMap) {
    //                  //resize the map when the browser resizes
    //                  dojo.connect(dijit.byId('map'), 'resize', map, map.resize);
    //              });

    var resizeTimer;

    dojo.connect(map, "onLoad", function (map) { map.infoWindow.resize(250, 100); });
    dojo.connect(map, 'onLoad', function (theMap) {
        dojo.connect(dijit.byId('map'), 'resize', function () { //resize the map if the div is resized
            clearTimeout(resizeTimer);
            resizeTimer = setTimeout(function () {
                map.resize();
                map.reposition();
            }, 500);
        });

        //after map loads, connect to listen to mouse move & drag events
        dojo.connect(map, "onMouseMove", showCoordinates);
        dojo.connect(map, "onMouseDrag", showCoordinates);

        //add the overview map 
        var overviewMapDijit = new esri.dijit.OverviewMap({
            map: map,
            visible: false
        });
        overviewMapDijit.startup();
    });

}


//show map on load 
dojo.addOnLoad(init);


Outcomes