Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for an inView callbaack #20

Open
mloit opened this issue Jul 29, 2021 · 1 comment
Open

Add support for an inView callbaack #20

mloit opened this issue Jul 29, 2021 · 1 comment

Comments

@mloit
Copy link

mloit commented Jul 29, 2021

I have a need to be able to set a state var once the chart is in view and the animation has started. Unfortunately I cannot rely solely on the events from the chart, I am using onComplete, but in adding this plugin, onComplete is immediately fired on startup, even if the chart isn't in view, which causes problems for me. I have yet to determine why onComplete is firing. Long story short, it would be helpful to have a callback/event like inView that fires once the chart scrolls into view. This would allow me to ignore the onComplete events until after this callback event happens.

@LeeLenaleee
Copy link
Contributor

LeeLenaleee commented Feb 6, 2022

As soon as the new version releases for chart.js V3 you can use the initial property on the context you get to see if the chart is in view.

The initial prop only gets set to true when the chart scolls in to vieuw:

options: {
  animation: {
    onComplete: (ctx) => {
      if (!ctx.initial) {
        return;
      }

      console.log('Chart in view')
    }
  }
}

https://codepen.io/leelenaleee/pen/vYWyRYw

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants