4 Replies Latest reply on Aug 11, 2014 11:08 PM by Vinod Menon@Adobe

    SVGs graphics in Edge crashes iPad and iOS devices

    EnthusiastOfTheMind

      I've just encountered some serious issues when using SVG content graphics on an iOS device.

       

      I'm using a iPad mini v6.1.3

       

      When you pinch to zoom into an Edge project which uses SVG graphics Safari on the iOS crashes nearly everytime, particualrly when reaching max zoom.

      Only seems to do this in an Edge project. If I load the SVG directly into the iOS web browser I can zoom right into maxamum zoom without fault.

       

      Has anyone experienced this?

       

      Can the issue be fixed? Otherwise it looks like we can use SVGs in our projects.

       

       

        • 1. Re: SVGs graphics in Edge crashes iPad and iOS devices
          lyanrocke

          I have been having the same issue. All my graphics were created in illustrator and rendered as standard svg files. It's a large project but  runs flawlessly on PC and Mac. The iPhone and I pad were both crashing. Disabling the users zoom features on load was the only solution I found aside from changing all the files to web optimized pngs. Disabling zoom wasn an option though as it renders most of the text unreadable on smaller screens.

          • 2. Re: SVGs graphics in Edge crashes iPad and iOS devices
            Lord-ton Level 1

            same issue here.

            dev team, please take it into account!

            • 3. Re: SVGs graphics in Edge crashes iPad and iOS devices
              TomGregory-ovo

              Me too...

              Just been doing a little testing using 2 SVG's in a simple animation (scale and rotate)to test rendering on various bowsers and devices.

              Every time I pinch to zoom in on my iPhone 4 (iOS7.12) using Safari the browser crashes.

              Plus the animation doesn't really play, it twitches a little.

              Same kind of playback as I get in Firefox.

              Renders fine in Safari on my MacBook.

              • 4. Re: SVGs graphics in Edge crashes iPad and iOS devices
                Vinod Menon@Adobe Adobe Employee

                Have you tried applying Edge Animate patch which was released on August 4th. Please get the details on this patch from the team blog below. We have also made specific fix related SVG in this patch, even though it is not mentioned in the blog.

                 

                Adobe Edge Animate Team Blog

                 

                Explanation on why this issue could be happening.

                 

                In Edge Animate CC 2014 we have introduced a preference setting called "SVGAntiScaleFactor". The reason why we introduced this parameter “SVGAntiScaleFactor” is that we have observed the SVG pixilation issue which happens on browsers when any SVG content is animated with “scale up” transform. To solve this problem we are scaling up the container div by a factor of 10 (which is by default the SVGAntiScale value) and then using image filtering to reduce the resolution based on the inverse scale. Property panel will show this inverse transform scale (i.e for scale factor of 10 , the transform scaleX(0.1) and transform ScaleY(0.1)) since that is the transform scale applied to the svg element. The scale factor value can range between 0 to 100 including floating point values.

                 

                Because the default value in CC 2014 is 10, it possible that SVG image which is rasterized by browser is too big and using up memory which leads to a crash. This could happen in certain devices based on the memory available. In the patch mentioned above we have changed the default value to 1. You can change this value if required. Please follow the steps below for the same.

                 

                @This scale factor can be changed from:
                1. Close Animate
                2. Open the preference folder:
                a. Windows: C:\Users\{username}\AppData\Roaming\Adobe\Edge Animate\4.0.0\
                b. Mac: /Users/{username}/Library/Prefrences/Adobe/EdgeAnimate/4.0.0/
                3. Open the AppPrefs.xml file in a text editor.
                4. Search for the Current line in AppPrefs.xml:
                <key>SvgAntiScaleFactor</key>
                <float>1</float>

                 

                If you want to change the value to 5 (for example)
                <key>SvgAntiScaleFactor</key>
                <float>5</float>
                5. Launch Animate.

                 

                Let me know if you have any questions.

                 

                Regards
                Vinod

                1 person found this helpful