Changing the size of part of a svg

[reheer]

Hi,

 

I would like to change the size of part of a svg. This part (window6) is a group of 2 paths. I added a view box to the group based on the dimension in Inkscape.

        <g
          id="window6"
          class="window"
          transform="matrix(0.94471375,0,0,0.94471375,6.6607969,16.383778)"
          inkscape:label="window6"
          viewBox="73.400 300.987 176.533 314.540"
          style="display: inline"
        >

I tried using this code:

 

      tl2.to("#window6", {
        attr: { viewBox: "73.400 300.987 1000 1000" },
      })

but that doesn't seem to do anything.

 

Is this possible?

 

I understand that a codepen would be helpful but don't have time at this very moment to create one. If it is needed I'll create one tomorrow (CET time).

 

Thanks,

 

René 

 

 

 

[ZachSaucier]

Hey reheer. I've never hear of putting a viewbox on a group element before. Are you sure that that's valid?

 

Side notes:

• We also recommend that you set all transforms with GSAP, so we recommend not letting Inkscape export the transform attribute.
• Display on a group element makes no sense.

Maybe it'd be better if you described your end goal and we could help you get there. A demo would be helpful without a doubt.

[reheer]

Hi Zach,

 

Putting a viewbox on a group element is not valid. I read something about adding extra viewboxes and interpreted this incorrectly.

Your side notes are saved into my memory 🤓

 

My end goal was simulating a minimising window. And I think I already found the best way to do it (of course far simpler than my first attempt...)

 

See the Pen eYzoOWb by reheer (@reheer) on CodePen

 

Thanks for your guidance!