Thomas Graf: SVG

hallo *,

ich möchte ein in ein svg integriertes jpg mit linkbereichen belegen, ähnlich einer imagemap. geht das? wenn ja, wie?

vielen dank schon mal.

gruß, tom

  1. Hallo,

    ich möchte ein in ein svg integriertes jpg mit linkbereichen belegen, ähnlich einer imagemap. geht das? wenn ja, wie?

    Lege ungefuellte Grafikobjekte mit passenden Koordinaten ueber das Bild (ueber bedeutet, dass die Elemente nach dem Rasterbild stehen) und verlinke diese (Setzen von pointer-events bei fill="none" beachten):

    
    <!-- das Rasterbild -->
    <image xlink:href="name.jpg" x="..." y="..." width="..." height="..."/>
    
    <!-- Linkbereich mit Rechteck, analog fuer andere Grundformen -->
    <a xlink:href="...">
      <rect x="..." y="..." width="..." height="..." fill="none" pointer-events="all"/>
    </a>
    

    MfG, Thomas

    1. Hallo nochmal,

      es wird tatsächlich ein link angezeigt, der auch funktioniert, allerdings nur ganz am rand der rastergrafik. obwohl die abmessungen des rechtecks eigentlich passen müssten. vermutung: das rechteck liegt unter dem jpg, das im übrigen animiert ist, d.h. erst nach einer gewissen zeit im svg zu sehen ist.

      gruß, tom

      Hallo,

      ich möchte ein in ein svg integriertes jpg mit linkbereichen belegen, ähnlich einer imagemap. geht das? wenn ja, wie?

      Lege ungefuellte Grafikobjekte mit passenden Koordinaten ueber das Bild (ueber bedeutet, dass die Elemente nach dem Rasterbild stehen) und verlinke diese (Setzen von pointer-events bei fill="none" beachten):

      
      
      > <!-- das Rasterbild -->
      > <image xlink:href="name.jpg" x="..." y="..." width="..." height="..."/>
      > 
      > <!-- Linkbereich mit Rechteck, analog fuer andere Grundformen -->
      > <a xlink:href="...">
      >   <rect x="..." y="..." width="..." height="..." fill="none" pointer-events="all"/>
      > </a>
      
      

      MfG, Thomas

      1. Hallo,

        vermutung: das rechteck liegt unter dem jpg, das im übrigen animiert ist, d.h. erst nach einer gewissen zeit im svg zu sehen ist.

        Lege das (unsichtbare) Rechteck ueber die Grafik. Wenn das Rechteck erst nach der Animation anklickbar sein soll, dann setze dessen Eigenschaft display vorher auf none und beim Beenden der Animation auf block.

        MfG, Thomas

        1. ok, das problem ist als folgendes erkannt. im browser(ie6) wird kein rechteck, sondern nur ein strich angezeigt.

          <rect x="200" y="50" width="120" heigth="100" fill="none" stroke="blue" pointer-events="all"/>

          ich weiß nicht, was falsch sein könnte.

          Vielen dank für die mühe!

          gruß, tom

          Hallo,

          vermutung: das rechteck liegt unter dem jpg, das im übrigen animiert ist, d.h. erst nach einer gewissen zeit im svg zu sehen ist.

          Lege das (unsichtbare) Rechteck ueber die Grafik. Wenn das Rechteck erst nach der Animation anklickbar sein soll, dann setze dessen Eigenschaft display vorher auf none und beim Beenden der Animation auf block.

          MfG, Thomas

          1. Schreibfehler bei height!!!

            sorry!!

            trotzdem vielen dank nochmal!!

            ok, das problem ist als folgendes erkannt. im browser(ie6) wird kein rechteck, sondern nur ein strich angezeigt.

            <rect x="200" y="50" width="120" heigth="100" fill="none" stroke="blue" pointer-events="all"/>

            ich weiß nicht, was falsch sein könnte.

            Vielen dank für die mühe!

            gruß, tom

          2. Hallo,

            <rect x="200" y="50" width="120" heigth="100" fill="none" stroke="blue" pointer-events="all"/>

            ich weiß nicht, was falsch sein könnte.

            heigth --> height

            MfG, Thomas