38 lines
4.0 KiB
HTML
38 lines
4.0 KiB
HTML
|
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Specifying targets for image map plots</title><link rel="stylesheet" type="text/css" href="manual.css"><meta name="generator" content="DocBook XSL Stylesheets V1.76.0"><link rel="home" href="index.html" title="JpGraph Manual"><link rel="up" href="ch10.html" title="Chapter 10. Using CSIM (Client side image maps)"></head><body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF"><div class="navheader"><table width="100%" summary="Navigation header"><tr><th colspan="3" align="center">Specifying targets for image map plots</th></tr><tr><td width="20%" align="left"> </td><th width="60%" align="center">Chapter 10. Using CSIM (Client side image maps)</th><td width="20%" align="right"> </td></tr></table><hr></div><div class="sect1" title="Specifying targets for image map plots"><div class="titlepage"><div><div><h2 class="title" style="clear: both"><a name="id2535910"></a>Specifying targets for image map plots</h2></div></div></div>
|
|||
|
|
|
|||
|
|
<p>To turn a standard image script into a CSIM script the first thing needed to do is
|
|||
|
|
to supply the appropriate URL targets for the hotspots in the image. What the
|
|||
|
|
hotspots represent depends on the type of plot. CSIM is supported by all graph
|
|||
|
|
types. </p>
|
|||
|
|
<p>To specify a URI link for each hotspot the <code class="code">SetCSIMTargets()</code> method is
|
|||
|
|
used on the graph object that should be given a hotspot.</p>
|
|||
|
|
<p>There are two arguments to this method</p>
|
|||
|
|
<p>
|
|||
|
|
</p><div class="orderedlist"><ol class="orderedlist" type="1"><li class="listitem">
|
|||
|
|
<p><code class="code">$aTargets</code>, an array of valid URL targets. One URL per hot
|
|||
|
|
spot, for example if you have a 10 values bar plot you need 10 URLs. If
|
|||
|
|
the <code class="code">SetCSIMTarget()</code> is applied to, for example, a text then
|
|||
|
|
only one URL target should be specified.</p>
|
|||
|
|
</li><li class="listitem">
|
|||
|
|
<p><code class="code">$aAlts</code>, an array of valid alt-texts. Many browsers (but
|
|||
|
|
not all) will show this text string if the mouse hovers over a
|
|||
|
|
hotspot.</p>
|
|||
|
|
</li></ol></div><p>
|
|||
|
|
</p>
|
|||
|
|
<div class="sect2" title="Creating popup-windows as targets for CSIM"><div class="titlepage"><div><div><h3 class="title"><a name="id2535974"></a>Creating popup-windows as targets for CSIM</h3></div></div></div>
|
|||
|
|
|
|||
|
|
<p>URL targets specified will be opened by the browser as usual, i.e. it will
|
|||
|
|
replace the current HTML page. Another common usage pattern is to opena popup
|
|||
|
|
window, perhaps with a zoomed version of a graph. This can be done by adding
|
|||
|
|
some javascript in the target URL. If the URL, for example, is specified
|
|||
|
|
as</p>
|
|||
|
|
<p>
|
|||
|
|
</p><pre class="screen">$target = "...";
|
|||
|
|
$targetURL = "javascript:window.open('$target?id=%d','_new','width=500,height=300');void(0)"</pre><p>
|
|||
|
|
</p>
|
|||
|
|
<p>clicking on a target will now open a separate window with the specified width
|
|||
|
|
and height. The <code class="code">$target</code> variable must be set to the wanted
|
|||
|
|
URL.</p>
|
|||
|
|
</div>
|
|||
|
|
</div><div class="navfooter"><hr><table width="100%" summary="Navigation footer"><tr><td width="40%" align="left"> </td><td width="20%" align="center"><a accesskey="u" href="ch10.html">Up</a></td><td width="40%" align="right"> </td></tr><tr><td width="40%" align="left" valign="top"> </td><td width="20%" align="center"><a accesskey="h" href="index.html">Home</a></td><td width="40%" align="right" valign="top"> </td></tr></table></div></body></html>
|