nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

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;
   }

Vind meer berichten getagd met

Accepted answers

All comments

MatthewStarr

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

AndreSmit

Also check source on this.

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"));

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

FindDataGrid.txt.zip

Example.zip

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.

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

index2.zip

report_template_issue2.pdf

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

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.

index1.zip

Portal_offset.jpg

derekswingley1

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

Can you post all of your code?

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.