The initial graph in this case is produced by the function dograph(), which plots a pair
of axes and a hidden (transparent) point that will be used for the running coordinate position display.
A maximum of 50 points will be displayed.
The key parameters of interest in this case are Info.onmousedown="mousedown" and Info.onmousemove="mousemove",
which direct divgraph.js to send a call to mousedown() when the mouse is pressed
down and mousemove() when the mouse is moved.
In addition, to be compatible with Microsoft Interent Explorer, the <body> tag must contain
the following directives for the mousedown and mousemove events:
(Info.onmouseup is also an option that can be
used to track the dragging of objects.) The function
GRmouseevent() handles mousemove, mouseup, and
mousedown events, translating the coordinates provided by the browser, and creating the following
the number of the graph the click or move was in
the button pressed (left=1, middle=2, right=3)
the document-based x-coordinate
the document-based y-coordinate
the anchor-based x-coordinate
the anchor-based y-coordinate
the user-based x-coordinate
the user-based y-coordinate
This structure is passed on to the functions mousemove() and mousedown() along with
the event structure created by the browser (which in this case is ignored).
These functions in turn call showxy() and addtextpoint, which provide
the feedback shown here.
Thus, to intercept the user's mouse actions, you need to:
Indicate which mouse events you want to intercept in the Info structure,
along with the functions you are providing to handle the event information.
Add "onmouse...=GRmouseevent()" parameters to the <body> tag for compatibility with Microsoft Internet Explorer.
Provide functions to handle each desired event.
Once this is done, you can have full interaction with the user
in your coordinate system.
There are many applications other than graphing for which
this might be useful.
You could, for example, offer the user a GIF image and, displaying no
axes (using Info.doxaxis=Info.doyaxis=false), ask the user
to point to various places on the image, giving appropriate
feedback as they do. This could also be
done with imagemaps, but that is far more
cumbersome in terms of preparation time and translation of coordinates,
and isn't a solution for graphing done real-time.)
copyright 2001 Robert M. Hanson. All rights reserved. divgraph.js is freely distributable for noncomercial purposes, provided reference is made as "divgraph.js was developed at St. Olaf College by Robert M. Hanson (http://www.stolaf.edu/people/hansonr/divgraph)." Commercial licensing is available for specific purposes.