Sign in to follow this  
pntran1

Problems updating Angular Gauge with AJAX

Recommended Posts

I tried do do the same using AJAX instead. The gauge did get updated with the correct values. However, I noticed

 

a couple problems:

 

 

 

1) The inner circle flickers every time the gauge is updated.

 

2) The needle always returns to 0 before going to next value.

 

 

 

I still would like to see the animation effect so the the user can see a smooth transition from one value to another without jumping or flickering. I would also like to avoid to return the needle back to zero.

 

 

 

Please let me know if you know of a solution. Thanks so much!

Edited by Guest

Share this post


Link to post
Share on other sites

Hi, 

I hope you might be using setDataURL/setDataXML to change the chart value which rerenders he chart. Instead, could you please try using setData() JavaSript API of the chart which would produce the desired effect. This would require you to fetch only the pointer value of the chart through AJAX and set this value using JavaScript. Please refer to a JavaScript Online Demo for more on this.

http://www.fusioncharts.com/widgets/Demos/Rating/Index.html

(http://www.fusioncharts.com/widgets/LiveDemos.asp)

Share this post


Link to post
Share on other sites

Hello,

Thank you so much for your help.  The sample that you mentioned has exactly what I need. setData method is so simple to use.  I found info about setDataXML and setDataURL, but I was not able to find info on setData method in the doc.  I noticed one small problem is that the upper limit is not automatically adjusted with setData if new value falls outside of the range.

1) What do I need to do so that the upper limit will be automatically adjusted when using setData and the value is greater than the upper limit?

2) If I have more than one dials, how would I update both of them? 

3) Can I use setData to change other attributes of the gauge: lower/upper limit, annotation text, etc?  Please provide some examples. 

4) What are all the values that can be changed directly from the client side using Java script?

Forgive me for asking too many questions.  I am quite a newbie, but I like FusionWidget so so much.  Thanks you very much!!!

Edited by Guest

Share this post


Link to post
Share on other sites

1) What do I need to do so that the upper limit will be automatically adjusted when using setData and the value is greater than the upper limit?

 

You cannot change the limit of chart unless you update the entire XML of the chart.

 

 

 

2) If I have more than one dials, how would I update both of them?

 

Using the index - the setData() method allows you to specify index (or ID) of dial to be updated.

 

 

 

3) Can I use setData to change other attributes of the gauge: lower/upper limit, annotation text, etc? Please provide some examples.

 

No.

 

 

 

4) What are all the values that can be changed directly from the client side using Java script?

 

Just the values.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this