We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

animate on scroll

Thread ID:





123638 Apr 5,2016 11:39 PM UTC Apr 6,2016 02:46 PM UTC JavaScript 1
Tags: ejChart
Asked On April 5, 2016 11:39 PM UTC

is there any example that showcase chart animation on scrolling ?

i want to make a page with several donuts charts , some of them are not visible until i scroll the page .
so i want to run the initial donut animation only when the user scroll to .

is that possible please?

thanks and good day .

Saravana Kumar Kanagavel [Syncfusion]
Replied On April 6, 2016 02:46 PM UTC

Hi Issam,
Thanks for using syncfusion products. We have analyzed your query and prepared sample based on your requirement. In the sample we are having two charts and for the second chart we have set ”initSeriesRender” property as false. So initially series for the second chart is not rendered. Please find the below code snippet.


        initSeriesRender: false

We have subscribed the onscroll event for the window and written the below code.


function testScroll(evt) { //Trigger the scroll event

        if (window.pageYOffset > 300) {

            var chartCalObj = $("#container1").data("ejChart");



window.onscroll = testScroll

In the above code, if the pageOffset is more than 300, then we have called chart’s seriesRender() method. So while scrolling the page, series for the second chart is created. In the below link we have attached sample for your reference.

Sample link: http://www.syncfusion.com/downloads/support/forum/123638/ze/Sample1158000935
Please let us know if you have any concern.

Saravana Kumar K


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon