Re: 3rd Call: HowTo make a 100% sheet with a hole in it that reveals a link

Hi Jonathan.

Jonathan Chetwynd:
> Hope everyone is enjoying SVG Open 2007.

Yes it was quite enjoyable.

> I've asked variations on this question a number of times, apologies.
> 
> This may merit an errata, hence my request for an answer.
> 
> The attached file contains a 100% sheet with a hole in it that  
> reveals a link.
> sheet, hole and link are all IDs in the file.
> 
> How can this be made to work?
> 
> the "donut" is defined in percentage but clip uses path, and mask  
> does not allow pointer events through the hole.

I’m not exactly sure what you want.  If you want a path that has a hole
in it, but whose size is given as a percentage, then you can use an
<svg> element to create a new viewport that has a given size, draw a
path in that coordinate space, and set width="" and height="" to give it
a percentage scaling.

For example:

  <svg xmlns="http://www.w3.org/2000/svg"
       xmlns:xlink="http://www.w3.org/1999/xlink"
       width="100%" height="100%" viewBox="0 0 400 400">
  
    <defs>
      <symbol id="link" viewBox="0 0 150 150">
        <circle cx="75" cy="75" r="75" />
      </symbol>
    </defs>
   
    <a xlink:href="http://www.peepo.co.uk">
      <use xlink:href="#link" x="30%" y="50%" width="30%" height="30%"
           fill="purple"/>
    </a>
   
    <svg viewBox="0 0 100 100">
      <path d="M0,0 h100 v100 h-100 z M25,50 A25,25,0,0,0,75,50
               25,25,0,0,0,25,50" fill="blue"/>
    </svg>
  </svg>  

Cameron

-- 
Cameron McCormack, http://mcc.id.au/
 xmpp:heycam@jabber.org  ▪  ICQ 26955922  ▪  MSN cam@mcc.id.au

Received on Friday, 7 September 2007 13:18:32 UTC