Zoom To Point From Datagrid

[EmilyLaMunyon]

Hello,

I am super new to JavaScript and am attempting to zoom to a point from a data grid using the code below. However, it is not zooming, and in Firebug I get an error saying:
selectedTaxLot.geometry.getExtent() is null on this line of code:
var screenpoint = map.toScreen(selectedTaxLot.geometry.getExtent().getCenter());

Any help would be greatly appreciated!!

//Zoom to the parcel when the user clicks a row
      function onRowClickHandler(evt){
        var clickedTaxLotId = grid.getItem(evt.rowIndex).City;
        var selectedTaxLot;

        dojo.forEach(map.graphics.graphics,function(graphic){
          if((graphic.attributes) && graphic.attributes.City === clickedTaxLotId){
            selectedTaxLot = graphic;
            //added this part to build infotemplate
             map.infoWindow.setTitle(graphic.getTitle());
             map.infoWindow.setContent(graphic.getContent());
              //
            return;
          }
        });
        var taxLotExtent = selectedTaxLot.geometry.getExtent();
        var screenpoint = map.toScreen(selectedTaxLot.geometry.getExtent().getCenter());
        var mappoint = map.toMap(screenpoint);

       // map.setExtent(taxLotExtent);

         map.centerAt(mappoint);
         map.infoWindow.show(taxLotExtent.getCenter(), map.getInfoWindowAnchor(screenpoint));
        
      }
function oc(a)
    {
      var o = {};
      for(var i=0;i<a.length;i++)
      {
        o[a]='';
      }
      return o;
   }

[derekswingley1]

Are you working from the Show find task results in a DataGrid sample? 

Can you post all of your code?

[EmilyLaMunyon]

Thanks for looking into this Derek!!

Yes, I am using the Show Find Task Results in Data Grid as a starting point for my map.

I have attached the entire code I am using.

[derekswingley1]

The main issue is that the sample you're working from uses polygon data and you're using points.

To get your code working, I added the following to your onRowClickHandler function:

// points don't have a getExtent() method...
// if selectedTaxLot is a point, center the map on it
if ( selectedTaxLot.geometry.declaredClass == 'esri.geometry.Point' ) {
  map.centerAt(selectedTaxLot.geometry);
  var sp = map.toScreen(selectedTaxLot.geometry);
  map.infoWindow.show(selectedTaxLot.geometry, map.getInfoWindowAnchor(sp));
} else {
  var taxLotExtent = selectedTaxLot.geometry.getExtent(); 
  var screenpoint = map.toScreen(selectedTaxLot.geometry.getExtent().getCenter());
  var mappoint = map.toMap(screenpoint);
  map.centerAt(mappoint);
  map.infoWindow.show(taxLotExtent.getCenter(), map.getInfoWindowAnchor(screenpoint));
}

If you know you're always going to use point data you can remove the if statement and just go with the code to handle points.

[EmilyLaMunyon]

I appreciate your help.

I incorporated your adjustments into my code, although I am not sure I did it correctly...

Anyways, now I am getting an error in Firebug that reads:

selectedTaxLot.geometry.getExtent() is null on line 344
var screenpoint = map.toScreen(selectedTaxLot.geometry.getExtent().getCenter());

Sorry to be such a pain:o

[derekswingley1]

Please take a look at the comments I added to the code in my previous post ;).

The root of the issue is that esri.geometry.Point objects do not have a getExtent method. Since you're just trying to center the map, pass your selectedTaxLot.geometry object to map.centerAt() and it will work.

[MatthewStarr]

I am having the same problem trying to zoom to the selected point.  I tried adapting your code sample to mine and still I am failing..  I am hitting the wall on this one and a deadline is looming for making this test look pretty.  my click event is at the bottm befor the body.  If you could give me any advice that would be super.

Matt

[AndreSmit]

Recently implemented this:

   gridPrj = new dojox.grid.DataGrid({
        query: {PRJ_NBR: '*'},
        clientSort: true,
        onRowDblClick: function(e) {
            var item = this.selection.getSelected()[0];
            var p = new esri.geometry.Point(item.BLON[0], item.BLAT[0], new esri.SpatialReference({'wkid': 4326}));
            var w = new esri.geometry.geographicToWebMercator(p);
            var cpanel = dijit.byId("cPanel");
            var tmap = dijit.byId("map");
            cpanel.selectChild(tmap);
            map.centerAndZoom(w,12);
        },
        rowSelector: '50px',
        structure: tabLayout
    }, dojo.create("div"));

[AndreSmit]

Also check source on this.

[MatthewStarr]

I am still stuck, but these are great starts,  I think my selection is not tied to the map for some reason.