Jump to content

swampthang last won the day on June 19 2016

swampthang had the most liked content!


  • Posts

  • Joined

  • Last visited

  • Days Won


swampthang last won the day on June 19 2016

swampthang had the most liked content!


112 Specialist

About swampthang

  • Birthday September 11

Profile Information

  • Gender
  • Location

Contact Methods

  • Skype

Recent Profile Visitors

3,129 profile views
  1. Just curious. Looking at this thread, though it is 2 years old, I wondered if you had changed your mind on possibly releasing it some time in the future... Sorry if I put you in an awkward spot.Certainly didn't intend to do that.
  2. Hey, @GreenSock, have there been any updates to PathEditor lately?
  3. Makes complete sense. I went ahead and changed the app to use a sequence of show/hide set pairs and it's working great. Thanks for the beta link, the thorough explanation of what's going on here and once again - for an awesome library!
  4. OSUBlake is right regarding setTimeout. Take a look at the last codepen i posted above and see if that might help. It's proving to be much more reliable.
  5. This seems to be working better... https://codepen.io/swampthang/pen/WBMWwM?editors=1010
  6. If you inspect the page and use the step button, it seems like I might not be calculating the frames correctly. Could that have something to do with it? Every once in awhile I see 2 visible images trigger at the same time or 2 hidden images trigger at the same time.
  7. Try reloading the page and then begin stepping through the animation without actually playing it.
  8. I'm not so sure. I'm experiencing the same issue in a PNG sequence that runs in an Electron app that loads images locally and won't run until all images have officially loaded. I'm not using base64 images either. The images are transparent PNG files (created from an MOV file) ranging in size from 8K to 276K so not huge files. I created a simple codepen that shows the same animation that hiccups in the app but seems to work fine in Chrome... https://codepen.io/swampthang/pen/LoQqyO In Chromium 69, the first time I ran the animation, I did notice a flicker right at the end. Also, if you don't play the animation initially, but just step through the frames, you'll more often see a misfire. Here's the thing though... In the app, once a flicker happens it seems to 'stick' to the animation because I can step through the animation one frame at a time and when I get to that point, the image visibility remains 'hidden'. So it seems like whatever causes it to skip that frame gets "remembered" by the timeline. I wondered if the _gs objects that get attached to elements sometimes get cached and work both ways. I'm probably making no sense - just trying to figure out what's up. I'll look in to creating a sprite but can't go to that at this point. Any insight into what might be happening would be greatly appreciated.
  9. Ahhh, ok. Yea, that actually did fix it. The only thing I'm concerned about though, is there are some pretty involved animations and can potentially be a bunch of them stacked together. Was wondering if there's a way to limit the scope of that. For example, we have SVG elements being drawn in on one layer that's not in a foreignObject, of course, but those show up in the stacking order. Can setting defaultForce3D: false on an element be changed to true later? In this CodePen, it seems to work to set it to false on each element right after restacking them and then setting it to true in the animation. https://codepen.io/swampthang/pen/gyZMRJ?editors=1010 What's crazy is older versions of Chromium didn't get confused like this.
  10. Let me start by saying that I know this is a Chrome/Chromium issue. The CodePen works as expected in Firefox. Also, I know Blake has warned about using foreignObjects but I'm stuck with using them because, in my app, I have to use foreignObjects to render image layers to canvas creating a stack of PNG sequences inside a master SVG. I'm also forced to be able to support Chrome/Chromium. Here's the deal. I've run into a stacking context issue which I thought I had resolved before by doing something subtle to the SVG container using TweenMax to force the browser to do a redraw. Here, though, the issue is a little different. I have to allow my users to shift the order of each foreignObject which I accomplish using a javascript insertBefore. But, as you can see in the CodePen, if you shift the animated element to the back of the stack and then re-run the animation the browser is rendering it on TOP of the stack for as long as the animation is running. Then, once the animation is completed, the browser renders the element to the back of the stack where it belongs. Forcing a redraw like I've done in the past is not working. Any help would be greatly appreciated.
  11. Ahhhh, ok. So trying to set an origin on a `<g>` element doesn't work?
  12. swampthang

    center groups

    I feel like an idiot asking this because I thought I knew how to do this. I'm trying to move all `<g>` elements to the center of an SVG. The first one seems to work but the other 2 barely move. I'm having a brain cramp. Probably not enough sleep..
  13. Spoke too soon. Strings containing letters, 'i', 'j', etc contain 2 paths. Gonna have to parse through each string and add to the number of paths based on that. Here's a better solution: That seems to have fixed it. Here's an MP4 that was output from the app using that same code: