I have some JavaScript that queries for a parcel in a feature layer, successfully, and then zooms to the parcel using view.goTo(). It works great, except it zooms a little TOO close into the parcel. I'd like to have it fully display the parcel on the map, not go too far in. Any ideas? Using ESRI's JavaScript 4.4 API view . then ( function ( ) { var url = urlUtils . urlToObject ( document . URL ) ; //make sure we have parameters if ( url . query ) { var parcelNumber = url . query . PID ; return parcelLayer . then ( function ( ) { var query = parcelLayer . createQuery ( ) ; query . where = "PID_NUM = '" + parcelNumber + "'" ; query . outSpatialReference = view . spatialReference ; return parcelLayer . queryFeatures ( query ) ; } ) ; } } ) . then ( zoomTo ) . then ( highlight ) ; function zoomTo ( response ) { var parcel = response . features [ 0 ] ; //var parcelExtent = response.features[0].geometry.getExtent().expand(0.5); view . goTo ( parcel ) ; //map.setExtent(parcelExtent); return ( parcel ) ; } Here is my zoomed map with the code above -- as you can see, it's not showing the full extent of the polygon I need to have zoomed into: Here is a more preferable view one click zoomed out (though I'd rather have the polygon fill the space, but be completely visible in the map): Thanks for any ideas.

Kirsten, Have you tried: view . goTo ( parcelExtent ); var parcelExtent = response.features[0].geometry.extent.clone().expand(0.5); Updated: 8/15/17 8:13 AM

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

How to view.goTo feature result and display full extent of feature?

KirstenFrost_Andersen

I have some JavaScript that queries for a parcel in a feature layer, successfully, and then zooms to the parcel using view.goTo(). It works great, except it zooms a little TOO close into the parcel. I'd like to have it fully display the parcel on the map, not go too far in. Any ideas?

Using ESRI's JavaScript 4.4 API

view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> url <SPAN class="operator token">=</SPAN> urlUtils<SPAN class="punctuation token">.</SPAN><SPAN class="token function">urlToObject</SPAN><SPAN class="punctuation token">(</SPAN>document<SPAN class="punctuation token">.</SPAN>URL<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="comment token">//make sure we have parameters</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>url<SPAN class="punctuation token">.</SPAN>query<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> parcelNumber <SPAN class="operator token">=</SPAN> url<SPAN class="punctuation token">.</SPAN>query<SPAN class="punctuation token">.</SPAN>PID<SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">return</SPAN> parcelLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> query <SPAN class="operator token">=</SPAN> parcelLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">createQuery</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; query<SPAN class="punctuation token">.</SPAN>where <SPAN class="operator token">=</SPAN> <SPAN class="string token">"PID_NUM = '"</SPAN> <SPAN class="operator token">+</SPAN> parcelNumber <SPAN class="operator token">+</SPAN> <SPAN class="string token">"'"</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; query<SPAN class="punctuation token">.</SPAN>outSpatialReference <SPAN class="operator token">=</SPAN> view<SPAN class="punctuation token">.</SPAN>spatialReference<SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">return</SPAN> parcelLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">queryFeatures</SPAN><SPAN class="punctuation token">(</SPAN>query<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN>
&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN>
&nbsp;&nbsp; <SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN>zoomTo<SPAN class="punctuation token">)</SPAN>
&nbsp;&nbsp; <SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN>highlight<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp; 
&nbsp;&nbsp; <SPAN class="keyword token">function</SPAN> <SPAN class="token function">zoomTo</SPAN><SPAN class="punctuation token">(</SPAN>response<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> parcel <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>features<SPAN class="punctuation token">[</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="comment token">//var parcelExtent = response.features[0].geometry.getExtent().expand(0.5);</SPAN>
&nbsp;&nbsp;&nbsp; view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">goTo</SPAN><SPAN class="punctuation token">(</SPAN>parcel<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="comment token">//map.setExtent(parcelExtent);</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">return</SPAN> <SPAN class="punctuation token">(</SPAN>parcel<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Here is my zoomed map with the code above -- as you can see, it's not showing the full extent of the polygon I need to have zoomed into:

Here is a more preferable view one click zoomed out (though I'd rather have the polygon fill the space, but be completely visible in the map):

Thanks for any ideas.

Encuentra más publicaciones etiquetadas con

Accepted answers

RobertScheitlin__GISP

Kirsten,

Have you tried:

<CODE>view<SPAN class="" style="color: #999999; border: 0px; font-weight: inherit; font-size: 14px;">.</SPAN><SPAN class="" style="color: #d74444; border: 0px; font-weight: inherit; font-size: 14px;">goTo</SPAN><SPAN class="" style="color: #999999; border: 0px; font-weight: inherit; font-size: 14px;">(</SPAN><SPAN class="" style="color: slategray; border: 0px; font-weight: inherit;">parcelExtent</SPAN>);<SPAN class="" style="color: slategray; border: 0px; font-weight: inherit;">var parcelExtent = response.features[0].geometry.extent.clone().expand(0.5);</SPAN>

Updated: 8/15/17 8:13 AM

All comments

kenbuja

In the 3.x version, the setExtent method had the fit option to have the input extent shown completely on the map. It looks like this was lost in the 4.x version of goTo and extent. I don't remember if was a very early version of JS API or the old Flex API where this wasn't an option, but the workaround for it was to use Extent.contains to see if the feature's extent was contained by the map extent. If not, zoom out one level.

RobertScheitlin__GISP

Kirsten,

Have you tried:

<CODE>view<SPAN class="" style="color: #999999; border: 0px; font-weight: inherit; font-size: 14px;">.</SPAN><SPAN class="" style="color: #d74444; border: 0px; font-weight: inherit; font-size: 14px;">goTo</SPAN><SPAN class="" style="color: #999999; border: 0px; font-weight: inherit; font-size: 14px;">(</SPAN><SPAN class="" style="color: slategray; border: 0px; font-weight: inherit;">parcelExtent</SPAN>);<SPAN class="" style="color: slategray; border: 0px; font-weight: inherit;">var parcelExtent = response.features[0].geometry.extent.clone().expand(0.5);</SPAN>

Updated: 8/15/17 8:13 AM

ThomasSolow

I would second this, although I don't think the .getExtent function made it into 4.xyz.

Also, .expand modifies the extent in place so it's probably best to clone it first.

RobertScheitlin__GISP

Thanks Thomas. I updated my post.

KirstenFrost_Andersen

Thanks guys, just got a chance to dig back in today. I broke the zoom:

<SPAN class="keyword token">function</SPAN> <SPAN class="token function">zoomTo</SPAN><SPAN class="punctuation token">(</SPAN>response<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="comment token">//var parcel = response.features[0];</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">var</SPAN> parcelExtent <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>features<SPAN class="punctuation token">[</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">.</SPAN>geometry<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getExtent</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">expand</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">0.5</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">goTo</SPAN><SPAN class="punctuation token">(</SPAN>parcelExtent<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">return</SPAN> <SPAN class="punctuation token">(</SPAN>parcel<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

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