Jump to content

Create svg and animate on scroll


Recommended Posts

That's a generated mesh. Look at this demo: http://pixijs.github.io/examples/#/demos/strip-demo.js , its based on Rope: https://github.com/pixijs/pixi.js/blob/dev/src/mesh/Rope.js , you can make your own generated mesh that'll be a ribbon and not the rope.

In any case, you have to clone pixijs github repo to have better access to pixi sources. 

Also, if my PR https://github.com/pixijs/pixi.js/pull/3820 will be accepted, it'll simplify the creation of generated meshes.

Link to comment
Share on other sites

You have to clone it just to understand how it works. Docs are good, but PIXI is not a black box, its better to see actual sources, especially if you are going to copy some of them to make your own generated mesh. That doesn't affect the way you are referencing pixi in the project.

PR is collaborative commit, I have my own pixijs branch and I'm asking core team to check it and merge into master branch. If that thing will be accepted, it will be easier to make your own generated meshes.

Link to comment
Share on other sites

  • 4 weeks later...

I'm having trouble with creating the ribbon. I've started of with a straight line, similar to rope but can't workout the maths to plot the points to generate the ribbon shape. Any resources on this?

Also in the example  http://beta.rallyinteractive.com/ they have a shadow effect at certain points of the ribbon, would this be added to the graphic or do this with pixi?

Only have a local version so no demo but hopefully will get one up soon

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...