📄 ch12.htm
字号:
read in is<BR>
# a rect or an ellipse descriptor and $x,$y lies within that shape
<BR>
#<BR>
if ($line[0] eq 'rect') {<BR>
if (&check_rect($line[1],$line[2],$line[3],$x,$y))
{<BR>
$this_rect
= 1;<BR>
last;<BR>
}<BR>
}<BR>
if ($line[0] eq 'ellipse') {<BR>
if (&check_ellipse($line[1],$line[2],$line[3],$x,$y))
{<BR>
$this_ellipse
= 1;<BR>
last;<BR>
}<BR>
}<BR>
<BR>
#<BR>
# build an array of points and their corresponding URLs<BR>
#<BR>
if ($line[0] eq 'point') {<BR>
$points[$c++] = join($;,$line[1],$line[2]);
<BR>
}<BR>
<BR>
#<BR>
# makes a running list of 'default' URLs to be randomly chosen
from should<BR>
# the $x,$y click not fall within a defined shape and no 'point'
has<BR>
# been defined<BR>
#<BR>
if ( $line[0] eq 'default' ) {<BR>
$default .= join(' ',@line[1..$#line]);
<BR>
}<BR>
}<BR>
close(IMAP);<BR>
<BR>
#<BR>
# output a Location randomly chosen from the list of URLs supplied
<BR>
# following the co-ord info, should the $x,$y match with a rect
or ellipse<BR>
#<BR>
if ( $this_rect || $this_ellipse ) {<BR>
splice(@line,0,4); #
remove the first 4 elements from @line<BR>
$i = int(rand($#line+1));<BR>
print "Location: $line[$i]\n\n";<BR>
} elsif ( defined(@points) ) {<BR>
$matchingkey = &nearest_point($x,$y,@points);
<BR>
($discard,$keep) = split(/$;/,$points[$matchingkey]);
<BR>
print "Location: $keep\n\n";<BR>
}<BR>
#<BR>
# If the $x,$y doesn't fall inside any shape and no 'point's are
defined,<BR>
# then randomly chose a default URL from the list. If
no default URLs<BR>
# are provided via the .imap file, return to the page which contains
<BR>
# the imagemap<BR>
#<BR>
elsif ( $default ne '' ) {<BR>
$urls = split(/ /,$default);<BR>
$i = int(rand($#urls+1));<BR>
print "Location: $urls[$i]\n\n";<BR>
} else {<BR>
print "Location: $ENV{HTTP_REFERER}\n\n";
<BR>
}<BR>
<BR>
exit 0;<BR>
<BR>
sub not_there {<BR>
print "Content-type: text/html\n\n";
<BR>
print "IM, Richard's imagemap handler,
couldn't find the .imap file ",<BR>
"specified by the path info supplied in
the URL. Sorry!";<BR>
exit 1;<BR>
}<BR>
<BR>
sub check_rect {<BR>
<BR>
local($upleftx);<BR>
local($uplefty);<BR>
local($xmax);<BR>
local($ymax);<BR>
local($getx);<BR>
local($gety);<BR>
local($returnval);<BR>
<BR>
$returnval = 0;<BR>
($upleftx,$xmax,$ymax,$getx,$gety) = @_;<BR>
($upleftx,$uplefty) = split(/,/,$upleftx);<BR>
<BR>
if ( (($getx-$upleftx) >= 0) && (($getx-$upleftx)
<= $xmax) ) {<BR>
if ( (($gety-$uplefty) >=
0) && (($gety-$uplefty) <= $ymax) ) {<BR>
$returnval
= 1;<BR>
}<BR>
}<BR>
<BR>
return $returnval;<BR>
}<BR>
<BR>
sub check_ellipse {<BR>
<BR>
local($centx);<BR>
local($centy);<BR>
local($a);<BR>
local($b);<BR>
local($getx);<BR>
local($gety);<BR>
local($returnval);<BR>
<BR>
$returnval = 0;<BR>
($centx,$a,$b,$getx,$gety) = @_;<BR>
($centx,$centy) = split(/,/,$centx);<BR>
<BR>
if ( ( (($getx-$centx)/$a)**2 + (($gety-$centy)/$b)**2
) <= 1.0 ) {<BR>
$returnval = 1;<BR>
}<BR>
<BR>
return $returnval;<BR>
}<BR>
<BR>
sub nearest_point {<BR>
<BR>
local ($min_key, $mindist, $i);<BR>
local ($getx, $gety);<BR>
<BR>
local(@pt);<BR>
($getx,$gety,@pt) = @_;<BR>
<BR>
$min_key = 0;<BR>
$mindist = 1000000000; # no image will be this
large! (I hope)<BR>
<BR>
for $i (0..$#pt) {<BR>
($a,$b) = split(/$;/,$pt[$i]);
<BR>
($a,$b) = split(/,/,$a);<BR>
if ( ( ($a-$getx)**2 + ($b-$gety)**2
) < $mindist ) {<BR>
$min_key
= $i;<BR>
$mindist
= ($a-$getx)**2 + ($b-$gety)**2;<BR>
}<BR>
}<BR>
<BR>
return $min_key;<BR>
}</FONT></TT>
</BLOCKQUOTE>
<HR>
<P>
<CENTER><TABLE BORDERCOLOR=#000000 BORDER=1 WIDTH=80%>
<TR><TD><B>Caution</B></TD></TR>
<TR><TD>
<BLOCKQUOTE>
So, smarty, you think you can crash my code? Of course you can! im.cgi assumes that you give it a correct .imap file. Want to see what happens when you give it a rect with no following URL or a negative xsize? That's up to you. However, if you feed it
bizarre input, you can expect it to choke or barf. Such is the way of all computer programs.</BLOCKQUOTE>
</TD></TR>
</TABLE></CENTER>
<P>
<H2><A NAME="CreativeImagemapProgrammingBreakingt"><FONT SIZE=5 COLOR=#FF0000>Creative
Imagemap Programming-Breaking the Paradigm with Glorglox</FONT></A>
</H2>
<P>
Throughout this chapter, I've been an advocate of thinking for
oneself when creating imagemap code. The im.cgi code I wrote departs
from the standard imagemap code, but not very much. It still follows
the same basic principle of click-on-a-shape-and-we'll-take-you-there.
That doesn't have to be the only way to deal with imagemaps, though.
<P>
Shape-based imagemap handlers are very good at describing shapes
that can be described through simple analytic geometry but very
bad at describing arbitrary curvy shapes, such as what one might
find on an isometric (contour) map. And what useful maps these
are! For the next few days, try keeping you eyes peeled for examples
of contour maps in your everyday life. I think you'll be surprised
with how many you see.
<P>
In addition to isometric maps, text isn't processed very well
by shape-based imagemap handlers. It's possible to plot out the
various cusps of a nice Geoslab font, I suppose, but it wouldn't
be desirable. And brush script... forget it! You'll need every
one of those 100 vertices you've got to play with in your poly
method and more.
<P>
How could an imagemap handler be constructed to deal with these
sorts of situations? Glorglox presents us with one possible answer.
<P>
Glorglox is an advanced imagemapping program written by Tom Rathborne,
a University of Waterloo mathematics and computer science student.
He came up with an elegant solution to the problems I discussed
earlier. The key is to essentially forget about geometry. Imagemaps
are images, period. Forget about the shapes we artificially impose
on them and consider their basic property: color. Figure 12.6
shows the Glorglox home page and, in my opinion, immediately gives
away its methodology.
<P>
<A HREF="f12-6.gif" ><B>Figure 12.6:</B> <I>The Gloralox home page.</I></A>
<P>
The Glorglox Home Page contains two images that show what Glorglox
is all about: <TT><FONT FACE="Courier"><A HREF="http://www.uunet.ca/~tomr/glorglox/demo/">http://www.uunet.ca/~tomr/glorglox/demo/</A></FONT></TT>.
<P>
The HTML used to invoke Glorglox is structurally identical to
the HTML used to invoke imagemap.cgi. An example is
<BLOCKQUOTE>
<TT><FONT FACE="Courier"><A HREF="/cgi-bin/glorglox/glorglox-demo"><IMG
SRC="demo.gif" ALT="[glorglox demo<BR>
image]" ISMAP WIDTH="512" HEIGHT="128"
BORDER="0"></A></FONT></TT>
</BLOCKQUOTE>
<P>
When an x,y coordinate pair is provided to the Glorglox through
<TT><FONT FACE="Courier">QUERY_STRING</FONT></TT>, a .gmap file
is referenced. This referencing is done through <TT><FONT FACE="Courier">PATH_INFO</FONT></TT>
and can be done either directly or through an alias found in the
glorglox.conf file. The preceding HTML shows the alias method
in use, and the glorglox.conf file is identical in form to the
standard imagemap.conf file:
<BLOCKQUOTE>
<TT><FONT FACE="Courier">glorglox-demo : /u/tomr/www/glorglox/demo/demo.gmap</FONT></TT>
</BLOCKQUOTE>
<P>
A Glorglox .gmap file is used to provide glorglox.cgi with information
regarding what to do with its x,y pairs. Glorglox operates through
pairs of image files: the one that is output to the Web and an
auxiliary .gif file. When a click is registered on the viewable
image, Glorglox determines the color of the pixel at that location
in the auxiliary .gif file. The .gmap file is a look-up table
of colors and URLs. Here is an example of a .gmap file:
<BLOCKQUOTE>
<TT><FONT FACE="Courier">/www/staff/tomr/glorglox/demo/demo-map.gif
<BR>
#<BR>
# The auxiliary image _must_ be on the first line.<BR>
#<BR>
# everything else is: [value|"default"]<whitespace>[URL]
<BR>
#<BR>
default <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/error.html">http://www.uunet.ca/~tomr/glorglox/demo/error.html</A><BR>
0 NOWHERE<BR>
1 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/gg-bord.html">http://www.uunet.ca/~tomr/glorglox/demo/gg-bord.html</A><BR>
2 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/imap.html">http://www.uunet.ca/~tomr/glorglox/demo/imap.html</A><BR>
3 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/gg-in.html">http://www.uunet.ca/~tomr/glorglox/demo/gg-in.html</A><BR>
4 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/gg-out.html">http://www.uunet.ca/~tomr/glorglox/demo/gg-out.html</A><BR>
5 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/box.html">http://www.uunet.ca/~tomr/glorglox/demo/box.html</A><BR>
6 <A HREF="http://www.uunet.ca/~tomr/glorglox/demo/adv.html">http://www.uunet.ca/~tomr/glorglox/demo/adv.html</A><BR>
#<BR>
# For example, if you were to click on the words "image mapper",
<BR>
# glorglox would send you to imap.html, because the pixel value
there<BR>
# is 2 (red) in the auxiliary image.<BR>
#<BR>
# The new nifty NOWHERE URL sends the user back to th⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -