Welcome to TalkGraphics.com
Page 2 of 2 FirstFirst 12
Results 11 to 20 of 20

Thread: animated svg

  1. #11
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    Finally got it to work!

    <object type="image/svg+xml" data="index_htm_files/egg_animated.svg" width="450" height="325" class="start"></object>
    DEMO
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  2. #12
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    It works okay in my example but not on larger svg files. I suspect it needs to ensure the file is loaded before rendering. Any ideas how to do this?
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  3. #13
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,706

    Default Re: animated svg

    Quote Originally Posted by Egg Bramhill View Post
    It works okay in my example but not on larger svg files. I suspect it needs to ensure the file is loaded before rendering. Any ideas how to do this?
    Egg, I need a larger SVG to test with.

    I still have no problems with <img src="index_htm_files/egg_animated TG.svg" width="100%" height="100%">
    It loaded in Chrome in 12mS so I do not suspect it is any different with a larger file.

    It should be possible to add the trigger class (start) to the svg after the DOM has loaded.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  4. #14
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    Hi Acorn, I don't think it's larger svg's causing the issue now. I believe it's the animated svg that's downloaded. For some reason it mainly refuses to play along. I used the same code as in my other demo but for scores of attempts couldn't get this one to load for hours !!!

    I'll attach an .xar file that I used to create an animated svg in vivus-instant.

    Thanks for your help. Egg.
    Attached Files Attached Files
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  5. #15
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,706

    Default Re: animated svg

    Egg, I assume I have to save the XAR file crest as SVG and then animate?

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  6. #16
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    Sorry for the delay Acorn.
    Export the xar file as an svg.
    Open vivus-instant and drag & drop that svg file
    Adjust as required.
    Update
    Download
    In Xara, import the ANIMATED file you just downloaded.
    Include the following to load the animation.
    <object type="image/svg+xml" data="index_htm_files/filename_animated.svg" width="450" height="325" class="start"></object>
    At least that's the way it's supposed to work
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  7. #17
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,706

    Default Re: animated svg

    Egg, I chose autstart and Repeat, all with defaults. I chose <img src="index_htm_files/Lpool_animated.svg" /> and yours.
    All work except in Preview and <object> fails in IE but <image> works. All other browsers were fine.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  8. #18
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    That sounds promising Acorn. Could you attach a zip file?
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  9. #19
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,706

    Info Re: animated svg

    Quote Originally Posted by Egg Bramhill View Post
    That sounds promising Acorn. Could you attach a zip file?
    Egg, a XAR file OK: Animated SVG.xar.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  10. #20
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,886

    Default Re: animated svg

    Cheers Acorn, I'll need to look at this more closely but it looks promising
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •