panning and zoomin and out, and ect

Brent Pedersen bpederse at NATURE.BERKELEY.EDU
Wed Aug 2 08:04:09 PDT 2006


hi, can you give more info on how it is not working?
what happens?
you may want to check what x and y are coming out as.
often + will concatenate numbers instaed of adding.

also, are you sure you want x and y to go negative as you
have made them in 'nw' for example?

i would try
if(direction=='nw'){
     x = 1;
     y = 1;
}
which i think should recenter you on the upper left corner of the map.


On Wed, 2 Aug 2006, Albert Anderson wrote:

> Hi,
>   I put my code with this email "hoping" for more than just it maybe in your map file or hidden variables thats all.
>
>  Thanks,
>  Albert
>
> Luis Treviño <ltrevinoh at gmail.com> wrote:  Albert:
>  Maybe the problem is in your map file or in the hidden variables of your template.
>
>
>
>  2006/8/1, Albert Anderson <bart_doggers at yahoo.com>:    Hi,
>
> I tried that code.  I didnt get it to  work.  Here is my code.  Can you see if I need to do  something else?  What else do I need?
> </script>
>
>  <!-- Panning Javascript here -->
> <script language="javascript" type="text/javascript">
>  var mapheight = 417;
>  var mapwidth = 309;
>  var pansize = 0.75;
>
> function pan(direction) {
>  var x,y;
>
> if(direction== 'n') {
>   x = (309-1)/2.0;
>   y = 0 - (417 * pansize)/2.0;
> } else if(direction== 'nw') {
>   x = 0 - (309 * pansize)/2.0;
>   y = 0 - (309 * pansize)/2.0;
> } else if(direction== 'ne') {
>   x = (309-1) + (309 * pansize)/2.0;
>   y = 0 - (417 * pansize)/2.0;
> } else if(direction== 's') {
>   x = (309-1)/2.0;
>   y = (417-1) + (417 * pansize)/2.0;
> } else if(direction== 'sw') {
>   x = 0 - (309 * pansize)/2.0;
>   y = (417-1) + (417 * pansize)/2.0;
> } else if(direction== 'se') {
>   x = (309-1) + (309 * pansize)/2.0;
>   y = (417-1) + (417 * pansize)/2.0;
> } else if(direction== 'e') {
>   x = (309-1) + (309 * pansize)/2.0;
>   y = (417-1)/2.0;
> } else if(direction== 'w') {
>   x = 0 - (309 * pansize)/2.0;
>   y = (417-1)/2.0;
>    }
>
> document.mapserv.imgxy.value = x + " " + y;
> document.mapserv.submit();
>  }
>
> </script>
>
> <TABLE width="368"
>                                       HEIGHT="460" BORDER="0"  align="left" CELLPADDING="0" CELLSPACING="0">
>
>                                        <TBODY>
>                                           <TR>
>                                             <TD  width="29" height="23" ALIGN="left"
>                                               VALIGN="top"  BGCOLOR="#e7a500"><a href="javascript:pan('nw')"><img  src="../images/cornerarrow5.gif" alt="pan nw" width="25" height="25"  style="border-style:none"></a></TD>
>                                             <TD ALIGN="center" BGCOLOR="#e7a500"
>                                                VALIGN="top"> <div align="center"><a  href="javascript:pan('n')"><img src="../images/cornerarrow2.gif"  alt="pan north" width="25" height="25"  style="border-style:none"></a></div></TD>
>                                             <TD width="30" ALIGN="right"
>                                                VALIGN="top" BGCOLOR="#e7a500"><a  href="javascript:pan('ne')"><img src="../images/cornerarrow6.gif"  alt="pan ne" width="25" height="25"  style="border-style:none"></a></TD>
>                                           </TR>
>
>                                           <TR>
>                                             <TD  ALIGN="LEFT" BGCOLOR="#e7a500"
>                                                VALIGN="MIDDLE"><a href="javascript:pan('w')"><img  src="../images/cornerarrow1.gif" alt="pan west" width="25" height="25"  style="border-style:none"></a></TD>
>                                             <TD CLASS="mapappmidaln" ALIGN="center"
>                                                HEIGHT="413" VALIGN="MIDDLE" WIDTH="309">
>
> <!-- calling for map here -->
>                                               <input name="img" type="image" src="[img]" WIDTH="309" HEIGHT="417"  BORDER="1" /></TD>
>                                             <TD ALIGN="right" BGCOLOR="#e7a500"
>                                                VALIGN="MIDDLE"><div align="left"><a  href="javascript:pan('e')"><img src="../images/cornerarrow3.gif"  alt="pan east" width="25" height="25"  style="border-style:none"></a></div></TD>
>                                           </TR>
>                                           <TR>
>                                             <TD  height="21" ALIGN="left"
>                                                VALIGN="bottom" BGCOLOR="#e7a500"><a  href="javascript:pan('sw')"><img src="../images/cornerarrow8.gif"  alt="pan sw" width="25" height="25"  style="border-style:none"></a></TD>
>                                             <TD ALIGN="center" BGCOLOR="#e7a500"
>                                                VALIGN="bottom"> <div align="center"><a  href="javascript:pan('s')"><img  src="../images/cornerarrow3gif.gif" alt="pan south" width="25"  height="25"  style="border-style:none"></a></div></TD>
>                                             <TD ALIGN="right" BGCOLOR="#e7a500"
>                                                VALIGN="bottom"><a  href="javascript:pan('se')"><img src="../images/cornerarrow7.gif"  alt="pan se" width="25" height="25"  style="border-style:none"></a></TD>
> </table>
>
>
>
> Luis Treviño <ltrevinoh at GMAIL.COM> wrote:
>
>  2006/7/21, Albert Anderson <bart_doggers at yahoo.com>:     Hi,
>
> I figure out my images.  Does anyone have a  _java script for using a image for panning.  I have images set for  the corners of my map. I want to use them to pan.
>
>  You can use something like this, you have to handle your width and height of your image:
>  alto = height, ancho = width.
>  function paneo(direccion,alto,ancho) {
>  var x,y;
>  var pansize = 0.75;
> if(direccion == 'n') {
>   x = (ancho-1)/2.0;
>   y = 0 - (alto * pansize)/2.0;
> } else if(direccion == 'nw') {
>   x = 0 - (ancho * pansize)/2.0;
>   y = 0 - (ancho * pansize)/2.0;
> } else if(direccion == 'ne') {
>   x = (ancho-1) + (ancho * pansize)/2.0;
>   y = 0 - (alto * pansize)/2.0;
> } else if(direccion == 's') {
>   x = (ancho-1)/2.0;
>   y = (alto-1) + (alto * pansize)/2.0;
> } else if(direccion == 'sw') {
>   x = 0 - (ancho * pansize)/2.0;
>   y = (alto-1) + (alto * pansize)/2.0;
> } else if(direccion == 'se') {
>   x = (ancho-1) + (ancho * pansize)/2.0;
>   y = (alto-1) + (alto * pansize)/2.0;
> } else if(direccion == 'e') {
>   x = (ancho-1) + (ancho * pansize)/2.0;
>   y = (alto-1)/2.0;
> } else if(direccion == 'w') {
>   x = 0 - (ancho * pansize)/2.0;
>   y = (alto-1)/2.0;
>    }
> document.mapserv.imgxy.value   = x + " " + y;
> document.mapserv.submit();
> }
>
>
>    Anyother question, is there a _java script for images to  zoom-in and out?
>  you can use the zoomdir and the zoom values within your template, like:
>  <input type="hidden" name="zoom" value="-2">
>    <input type="hidden" name="zoomdir" value="-1">
>  for a zoom out., so you can use radio buttons to manage this values
>
>
>
>    One more question, I have a refresh button and pan radio button,  then we I click refresh to take a layer off it moves the projective  image. Why? But when I am on zoomin radio button and click refresh it  acts like its panning? Why?
>
> Thanks,
>
>  Albert
>
>    __________________________________________________
> Do You Yahoo!?
> Tired of spam? Yahoo! Mail has the best spam protection around
>  http://mail.yahoo.com
>
>
>
>  Hope this helps.
>
> Regards,
>  Luis
>
>
>
>
>
>
> ---------------------------------
>  Yahoo! Messenger with Voice. Make PC-to-Phone Calls   to the US (and 30+ countries) for 2¢/min or less.
>
>
>
>
>
>
>
> ---------------------------------
> Talk is cheap. Use Yahoo! Messenger to make PC-to-Phone calls.  Great rates starting at 1¢/min.


More information about the MapServer-users mailing list