JSAPI v3.30 - Set map extent using offset

MaximeDemers

Hi,

I am trying to set map extent using an offset because there is a floating panel over the map and sometimes, when I zoom to a feature extent, the feature is partly hidden behind it.

I would like to offset the extent so it will always be displayed and centred in the map section that is not hidden by the panel

This is what I tried so far without success:

<SPAN class="keyword token">function</SPAN> <SPAN class="token function">zoomToExtent</SPAN><SPAN class="punctuation token">(</SPAN>extent<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
  <SPAN class="keyword token">var</SPAN> hiddenMapPartTopLeft <SPAN class="operator token">=</SPAN> map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toMap</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ScreenPoint</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN>
      hiddenMapPartBottomRight <SPAN class="operator token">=</SPAN> map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toMap</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ScreenPoint</SPAN><SPAN class="punctuation token">(</SPAN>panel<SPAN class="punctuation token">.</SPAN>position<SPAN class="punctuation token">.</SPAN>left <SPAN class="operator token">+</SPAN> panel<SPAN class="punctuation token">.</SPAN>position<SPAN class="punctuation token">.</SPAN>width<SPAN class="punctuation token">,</SPAN> map<SPAN class="punctuation token">.</SPAN>container<SPAN class="punctuation token">.</SPAN>offsetHeight<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

  <SPAN class="keyword token">var</SPAN> dx <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Extent</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
    xmin<SPAN class="punctuation token">:</SPAN> hiddenMapPartTopLeft<SPAN class="punctuation token">.</SPAN>x<SPAN class="punctuation token">,</SPAN>
    ymin<SPAN class="punctuation token">:</SPAN> hiddenMapPartBottomRight<SPAN class="punctuation token">.</SPAN>y<SPAN class="punctuation token">,</SPAN>
    xmax<SPAN class="punctuation token">:</SPAN> hiddenMapPartBottomRight<SPAN class="punctuation token">.</SPAN>x<SPAN class="punctuation token">,</SPAN>
    ymax<SPAN class="punctuation token">:</SPAN> hiddenMapPartTopLeft<SPAN class="punctuation token">.</SPAN>y<SPAN class="punctuation token">,</SPAN>
    spatialReference<SPAN class="punctuation token">:</SPAN> map<SPAN class="punctuation token">.</SPAN>spatialReference
  <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">getWidth</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>

  extent <SPAN class="operator token">=</SPAN> extent<SPAN class="punctuation token">.</SPAN><SPAN class="token function">offset</SPAN><SPAN class="punctuation token">(</SPAN>dx<SPAN class="punctuation token">,</SPAN> <SPAN class="number token">0</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
  map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setExtent</SPAN><SPAN class="punctuation token">(</SPAN>extent<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<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>

The map zoom way too far to the right. Is there a solution for this?

MaximeDemers

Hi, thanks for your answer.

I am not sure how to define the arbitrary value. As the value is in map unit (meters) and the width of the floating panel in pixels, does the panIncr will change with the zoom level?

Also, I would like the extent to be centred in the right part of the map, the part that is not hidden by the panel. Then, I suppose the offset will be different from a layer extent to another?