panning and zoomin and out, and ect

Luis Treviño ltrevinoh at GMAIL.COM
Tue Aug 1 22:25:11 EDT 2006


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<http://us.rd.yahoo.com/mail_us/taglines/postman1/*http://us.rd.yahoo.com/evt=39663/*http://voice.yahoo.com>to the US (and 30+ countries) for 2¢/min or less.
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/mapserver-users/attachments/20060801/1536625a/attachment.html


More information about the mapserver-users mailing list