[Mapserver-users] Checkboxes for layer control
Martin, Daniel
DMartin at erac.com
Fri Jan 10 08:59:33 PST 2003
This message is in MIME format. Since your mail reader does not understand
this format, some or all of this message may not be legible.
------_=_NextPart_000_01C2B8C9.A5D847C3
Content-Type: multipart/alternative;
boundary="----_=_NextPart_001_01C2B8C9.A5D847C3"
------_=_NextPart_001_01C2B8C9.A5D847C3
Content-Type: text/plain;
charset="iso-8859-1"
Steve,
I've attached my checkbox legend. I think it will better accomplish what
you are trying to do. Using an html template legend avoids hard coding
layers like you've done. To use it, your map file needs to have:
TEMPLATE "../legendTemplates/checkBox_legend.html"
within the LEGEND object. Then your client should at some point use
<TD>[legend]</TD>
Obviously it's meant to be nested within a table (it really won't look good
otherwise). If you don't want the checkbox to call a Javascript function,
you can change:
onClick="submitMapserv();"
to
onclick="document.mapserv.submit();"
where "mapserv" is the name of your form.
If any of this doesn't make sense, let me know.
-Dan Martin
-----Original Message-----
From: Steve McCrone [mailto:mccrone at pc.jaring.my]
Sent: Tuesday, January 07, 2003 8:07 AM
To: mapserver-users at lists.gis.umn.edu
Subject: [Mapserver-users] Checkboxes for layer control
I'm trying to implement check boxes to toggle on/off layers. It looks
pretty darn simple but I can't seem to get it working. The checkboxes are
to reflect what layers are loaded, but they are not. I've tried for many
hours but once again must resort to the list. So I'm really hoping that
someone can point out my mistake(s).
My original had the rosa applet in it and it was working great. But I took
it out in the code below to see if that made a difference, so there is some
declarations in the template file that do not currently apply.
I start with index.html
==============
<html>
<head>
<title>MapServer 3.5 Tutorial</title>
</head>
<body bgcolor="#ffffff">
<form method=GET action="/cgi-bin/mapserv.exe">
<input type="hidden" name="map" value="C:\Inetpub\wwwroot\s1ex1.map">
<input type="hidden" name="zoomsize" value=2>
<input type="hidden" name="program" value="/cgi-bin/mapserv.exe">
<input type="hidden" name="map_web_imagepath"
value="C:\inetpub\wwwroot\tmp\">
<input type="hidden" name="map_web_imageurl" value="/tmp/">
<center><input type="submit" value="Initialize"></center>
</body>
</html>
s1ex1.map
=======
NAME S1EX1
EXTENT -97.238976 41.619778 -82.122902 49.38562
SIZE 500 400
SHAPEPATH "data"
WEB
TEMPLATE s1ex1.html
IMAGEPATH "set in index.html"
IMAGEURL "set in index.html"
END
LAYER # water
NAME "water"
DATA hydrop_ugl
STATUS DEFAULT
TYPE POLYGON
CLASS
NAME "water"
COLOR 200 200 255
OUTLINECOLOR 255 0 0
END # end of water features class
END # end of water features layer
LAYER # States
NAME "states"
DATA states_ugl
STATUS DEFAULT
TYPE POLYGON
CLASS # States class
NAME "States"
EXPRESSION ('[CLASS]' = 'land')
COLOR 240 240 240
OUTLINECOLOR 0 0 0
END # end of States class object
END # end of layer object
END # end of map file
s1ex1.html
========
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<title>Part1, Example 1</title>
</head>
<h3>Section 1- Example 1</h3>
<form name="mapserver" method=get action="/cgi-bin/mapserv.exe"
onSubmit="zoomin()">
<input type="hidden" name="mode" value="browse">
<input type="hidden" name="zoomdir" value="1">
<input type="hidden" name="zoomsize" value="2">
<input type="hidden" name="map" value="[map]">
<input type="hidden" name="imgext" value="[mapext]">
<!-- <input type="hidden" name="imgxy" value="250 200">-->
<input type="hidden" name="map_web_imagepath" value="[map_web_imagepath]">
<input type="hidden" name="map_web_imageurl" value="[map_web_imageurl]">
<!-- ROSA applet specific tags -->
<input type="hidden" name="imagewidth" value="[mapwidth]">
<input type="hidden" name="imageheight" value="[mapheight]">
<!-- Initialization of the parameters which can be set from the applet
-->
<input type="hidden" name="INPUT_TYPE" value="">
<input type="hidden" name="INPUT_COORD" value="">
<input type="hidden" name="lastButtonSelected" value="">
<table border="1" width="771" height="82" cellpadding="2">
<tr>
<td width="400" height="27" valign="top" align="left">
<table border="1" width="100%" height="83">
<tr>
<td width="13%" height="5">
<input type="checkbox" name="layer" value="states" [states_check]>
</td>
<td width="35%" height="5"> States</td>
<td width="52%" height="5"> </td>
</tr>
<tr>
<td width="13%" height="2">
<input type="checkbox" name="layer" value="water" [water_check]>
</td>
<td width="35%" height="2"> Water Features</td>
<td width="52%" height="2"> </td>
</tr>
<tr>
<td width="13%" height="29">
<input type=IMAGE src="rosa/userdoc/images/icon_redraw.gif"
width="19" height="19" name=redraw border=0></td>
<td width="87%" height="29" colspan="2"><font face="Arial"
size="3">Redraw
Map</font></td>
</tr>
</table>
</td>
<td width="507" height="363" valign="top" align="left"
bordercolor="#000080">
<INPUT NAME="img" TYPE="image" SRC="[img]" width=[mapwidth]
height=[mapheight] border=0>
</td>
</tr>
<tr>
<td width="400" height="43" valign="top" align="left"></td>
<td width="507" height="43"></td>
</tr>
</table>
<p>
<!-- Applet and Parameter -->
</p>
<p> </p>
</form>
</html>
------_=_NextPart_001_01C2B8C9.A5D847C3
Content-Type: text/html;
charset="iso-8859-1"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META content="MSHTML 5.50.4613.1700" name=GENERATOR>
<STYLE></STYLE>
</HEAD>
<BODY bgColor=#ffffff>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2>Steve,</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff size=2>I've
attached my checkbox legend. I think it will better accomplish what you
are trying to do. Using an html template legend avoids hard coding layers
like you've done. To use it, your map file needs to have:
</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003></SPAN><SPAN class=693584916-10012003><FONT
face=Arial color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2>TEMPLATE "../legendTemplates/checkBox_legend.html" </FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003></SPAN> </DIV>
<DIV><SPAN class=693584916-10012003></SPAN><SPAN class=693584916-10012003><FONT
face=Arial color=#0000ff size=2>within the LEGEND object. Then your client
should at some point use</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2><TD>[legend]</TD><BR></DIV></FONT></SPAN><SPAN
class=693584916-10012003><FONT face=Arial color=#0000ff size=2></FONT></SPAN>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2>Obviously it's meant to be nested within a table (it really won't
look good otherwise). If you don't want the checkbox to call a Javascript
function, you can change:</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2>onClick="submitMapserv();"</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2>to</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff
size=2></FONT> </DIV>
<DIV><SPAN class=693584916-10012003></SPAN><FONT face=Arial color=#0000ff
size=2>o<SPAN
class=693584916-10012003>nclick="document.mapserv.submit();"</SPAN></FONT></DIV>
<DIV><FONT face=Arial color=#0000ff size=2><SPAN
class=693584916-10012003></SPAN></FONT> </DIV>
<DIV><FONT face=Arial color=#0000ff size=2><SPAN class=693584916-10012003>where
"mapserv" is the name of your form.</SPAN></FONT></DIV>
<DIV><FONT face=Arial color=#0000ff size=2><SPAN
class=693584916-10012003></SPAN></FONT> </DIV>
<DIV><SPAN class=693584916-10012003></SPAN><SPAN class=693584916-10012003><FONT
face=Arial color=#0000ff size=2>If any of this doesn't make sense, let me
know.</FONT></SPAN></DIV>
<DIV><SPAN class=693584916-10012003><FONT face=Arial color=#0000ff size=2>-Dan
Martin</FONT></SPAN></SPAN></DIV>
<BLOCKQUOTE dir=ltr
style="PADDING-LEFT: 5px; MARGIN-LEFT: 5px; BORDER-LEFT: #0000ff 2px solid; MARGIN-RIGHT: 0px">
<DIV class=OutlookMessageHeader dir=ltr align=left><FONT face=Tahoma
size=2>-----Original Message-----<BR><B>From:</B> Steve McCrone
[mailto:mccrone at pc.jaring.my]<BR><B>Sent:</B> Tuesday, January 07, 2003 8:07
AM<BR><B>To:</B> mapserver-users at lists.gis.umn.edu<BR><B>Subject:</B>
[Mapserver-users] Checkboxes for layer control<BR><BR></FONT></DIV>
<DIV><FONT face=Arial size=2>I'm trying to implement check boxes to toggle
on/off layers. It looks pretty darn simple but I can't seem to get it
working. The checkboxes are to reflect what layers are loaded, but they
are not. I've tried for many hours but once again must resort to the
list. So I'm really hoping that someone can point out my
mistake(s).</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>My original had the rosa applet in it and it was
working great. But I took it out in the code below to see if that made a
difference, so there is some declarations in the template file that do not
currently apply.</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>I start with
index.html<BR>==============<BR><html><BR><head><BR><title>MapServer
3.5 Tutorial</title><BR></head><BR><body
bgcolor="#ffffff"><BR><form method=GET
action="/cgi-bin/mapserv.exe"></FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2><input type="hidden" name="map"
value="C:\Inetpub\wwwroot\s1ex1.map"><BR><input type="hidden"
name="zoomsize" value=2><BR><input type="hidden" name="program"
value="/cgi-bin/mapserv.exe"><BR><input type="hidden"
name="map_web_imagepath" value="C:\inetpub\wwwroot\tmp\"><BR><input
type="hidden" name="map_web_imageurl"
value="/tmp/"><BR><center><input type="submit"
value="Initialize"></center><BR></body><BR></html></FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>s1ex1.map<BR>=======<BR>NAME S1EX1<BR>EXTENT
-97.238976 41.619778 -82.122902 49.38562<BR>SIZE 500 400<BR>SHAPEPATH
"data"</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>WEB<BR> TEMPLATE s1ex1.html<BR>
IMAGEPATH "set in index.html"<BR> IMAGEURL "set in
index.html"<BR>END</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>LAYER # water<BR> NAME "water"<BR>
DATA hydrop_ugl<BR> STATUS DEFAULT<BR> TYPE POLYGON</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2> CLASS<BR> NAME
"water"<BR> COLOR 200 200 255<BR>
OUTLINECOLOR 255 0 0<BR> END # end of water features class<BR>END
# end of water features layer</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>LAYER # States<BR> NAME "states"<BR>
DATA states_ugl<BR> STATUS DEFAULT<BR> TYPE POLYGON</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2> CLASS # States class<BR>
NAME "States"<BR> EXPRESSION ('[CLASS]' =
'land')<BR> COLOR 240 240 240<BR>
OUTLINECOLOR 0 0 0<BR> END # end of States class object<BR>END # end of
layer object</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>END # end of map file</FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2>s1ex1.html<BR>========<BR><!DOCTYPE HTML
PUBLIC "-//IETF//DTD
HTML//EN"><BR><html><BR><head><BR><title>Part1, Example
1</title><BR></head><BR><h3>Section 1- Example
1</h3></FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2><form name="mapserver" method=get
action="/cgi-bin/mapserv.exe" onSubmit="zoomin()"></FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2><input type="hidden" name="mode"
value="browse"><BR><input type="hidden" name="zoomdir"
value="1"><BR><input type="hidden" name="zoomsize"
value="2"></FONT></DIV>
<DIV> </DIV>
<DIV><FONT face=Arial size=2><input type="hidden" name="map"
value="[map]"><BR><input type="hidden" name="imgext"
value="[mapext]"><BR><!-- <input type="hidden" name="imgxy"
value="250 200">--></FONT></DIV>
<DIV> </DIV><FONT face=Arial size=2>
<DIV><BR><input type="hidden" name="map_web_imagepath"
value="[map_web_imagepath]"><BR><input type="hidden"
name="map_web_imageurl" value="[map_web_imageurl]"></DIV>
<DIV> </DIV>
<DIV><BR> <!-- ROSA applet specific tags
--><BR> <input type="hidden" name="imagewidth"
value="[mapwidth]"><BR> <input type="hidden"
name="imageheight" value="[mapheight]"><BR> <!--
Initialization of the parameters which can be set from the applet
--><BR> <input type="hidden" name="INPUT_TYPE"
value=""><BR> <input type="hidden" name="INPUT_COORD"
value=""></DIV>
<DIV> </DIV>
<DIV> <input type="hidden" name="lastButtonSelected"
value=""> <BR><table border="1" width="771" height="82"
cellpadding="2"><BR> <tr><BR> <td
width="400" height="27" valign="top"
align="left"><BR> <table border="1"
width="100%" height="83"><BR>
<tr><BR> <td
width="13%"
height="5"><BR>
<input type="checkbox" name="layer" value="states"
[states_check]><BR>
</td><BR> <td
width="35%"
height="5"> States</td><BR>
<td width="52%"
height="5"> </td><BR>
</tr><BR>
<tr><BR> <td
width="13%"
height="2"><BR>
<input type="checkbox" name="layer" value="water"
[water_check]><BR>
</td><BR> <td
width="35%" height="2"> Water
Features</td><BR>
<td width="52%"
height="2"> </td><BR>
</tr><BR>
<tr><BR> <td
width="13%"
height="29"><BR>
<input type=IMAGE src="rosa/userdoc/images/icon_redraw.gif" width="19"
height="19" name=redraw
border=0></td><BR>
<td width="87%" height="29" colspan="2"><font face="Arial"
size="3">Redraw<BR>
Map</font></td><BR>
</tr><BR>
</table><BR> </td><BR> <td
width="507" height="363" valign="top" align="left"
bordercolor="#000080"><BR> <INPUT NAME="img"
TYPE="image" SRC="[img]" width=[mapwidth] height=[mapheight]
border=0><BR> </td><BR> </tr><BR>
<tr><BR> <td width="400" height="43" valign="top"
align="left"></td><BR> <td width="507"
height="43"></td><BR>
</tr><BR></table><BR><p><BR> <BR> <!--
Applet and Parameter
--><BR></p><BR><p> </p><BR></form><BR></html><BR></FONT></DIV></BLOCKQUOTE></BODY></HTML>
------_=_NextPart_001_01C2B8C9.A5D847C3--
------_=_NextPart_000_01C2B8C9.A5D847C3
Content-Type: text/html;
name="checkBox_legend.html"
Content-Transfer-Encoding: quoted-printable
Content-Disposition: attachment;
filename="checkBox_legend.html"
[leg_layer_html opt_flag=3D2 order_metadata=3Dlegend_order]
[if name=3Dlayer_status oper=3Dneq value=3D2]
<input title=3D"Click here to turn the [leg_layer_name] =
layer [if name=3Dlayer_status oper=3Dneq value=3D0]off[/if][if =
name=3Dlayer_status oper=3Deq value=3D0]on[/if]" type=3Dcheckbox =
name=3Dlayer value=3D"[leg_layer_name]" [if name=3Dlayer_status =
oper=3Dneq value=3D0]CHECKED[/if] onClick=3D"submitMapserv();">
[/if]
[/leg_layer_html]
[leg_class_html opt_flag=3D2] =20
</TD>
<TD>
<img src=3D"[leg_icon]" border=3D0>
</TD>
<td> </td>
<TD> =20
<font face=3D"arial" size=3D2>[leg_class_name]</font>
</TD>
</TR>
<TR><TD>
[/leg_class_html]
------_=_NextPart_000_01C2B8C9.A5D847C3--
More information about the MapServer-users
mailing list