Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I would strongly recommend using Raphael's <a href="http://raphaeljs.com/reference.html#Element.data" rel="nofollow">Element.data</a> method to associate your private, circle-specific data with each item, and then acting on or against that data in a hover handler (manually detecting intersection with getElementByPoint may be expensive in a mouseover handler). You can store anything with <code>data</code>:</p> <pre><code>var circle = paper.circle( ... ); circle.data( 'name', "My name is Jonas." ); // store a string! circle.data( 'dataset', { ... } ); // store an object literal! circle.data( 'click_handler', function() { console.log("Store a handler function!" ); } ); </code></pre> <p>At this point, the game becomes very easy. Whether you use Raphael's built in hover handling...</p> <pre><code>circle.hover( function() { console.log("Just moved over '" + this.data("name") + "'" ); }, function() { console.log("Just moved out of '" + this.data("name") + "'" ); } ); </code></pre> <p>...or a mouseover event powered, for instance, by jQuery...</p> <pre><code>// Don't forget to translate page coordinates relative to the paper! var element = paper.getElementByPoint( x, y ); if ( element &amp;&amp; element.data("name") == "c" ) { // bah, humbug } </code></pre> <p>...the logic is the same. Simply query the application data you've associated with your elements and do your thing.</p> <p>I happened to already have a terrible little script that animates circles at random locations, and I <a href="http://voidblossom.com/tests/circleHover.php" rel="nofollow">retrofitted it</a> to accommodate your scenario.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload