Stacked Chart, Animating On A Click Event

[psionic001]

Hi, is it possible to add click events to stacked bar charts?

 

For example

I'd like to animate the bar to 100% height to represent a whole group. (lets say light blue)

 

Then, I'd like to click and have the stacked bar in a different colour animate to say 96% to represent a portion of the group. (say dark blue)

 

So it would look like a stacked bar after all animations with the bottom 96% covered light blue, and the remaining 4% in dark blue.

 

Is this possible with on-click events? Or does the whole lot need to animate at once per the standard animation default?

 

See attached image.

 

Cheers

 

Matt

Edited November 16, 2011 by psionic001

[Guest Angshu]

Hi,

 

Welcome to FusionCharts Forum!

 

I am afraid, FusionCharts JavaScript API does not support click event, as of now.

 

You would need to create your own code in order to suffice your requirement.

 

Hope this helps.

[Shweta Sharma]

Hi,

 

Is there any way to handle selection of individual stack items in a stacked bar chart.

For eg., -> I wish to perform certain calculations on click of a particular stack item and display a grid on click of another stack item.

So can I capture the click event in FusionCharts by any means?

 

Thanks in Advance,

Shweta Sharma

[Guest Sumedh]

Hi,

 

Is there any way to handle selection of individual stack items in a stacked bar chart.

For eg., -> I wish to perform certain calculations on click of a particular stack item and display a grid on click of another stack item.

So can I capture the click event in FusionCharts by any means?

 

Thanks in Advance,

Shweta Sharma

 

Hi Shweta,

 

You can capture events by clicking on particular data plot. You would need to use link attribute in the set element of chart.

 

Step 1: Define link attribute in your XML code with javascript function as a value of link attribute.

Ref. Code:

<chart ...>

< set ... link='j-myJS'>

 

Step 2: You would need to write a javascript function in your HTML file which will be called in the link attribute of the XML.

You can write your implementation in the function such that if you click on the data plot, it will re-direct or open a new page or anything you want to achieve.

 

FusionCharts provides JavaScript class API which provides a number of events. Please refer here : http://docs.fusionch...API/Events.html

 

You can use linkedItemOpened event for your requirement.

 

For more information, please refer these links:

http://docs.fusionch...ntOverview.html

http://docs.fusionch...JavaScript.html

[Shweta Sharma]

Hi Shweta,

 

You can capture events by clicking on particular data plot. You would need to use link attribute in the set element of chart.

 

Step 1: Define link attribute in your XML code with javascript function as a value of link attribute.

Ref. Code:

<chart ...>

< set ... link='j-myJS'>

 

Step 2: You would need to write a javascript function in your HTML file which will be called in the link attribute of the XML.

You can write your implementation in the function such that if you click on the data plot, it will re-direct or open a new page or anything you want to achieve.

 

FusionCharts provides JavaScript class API which provides a number of events. Please refer here : http://docs.fusionch...API/Events.html

 

You can use linkedItemOpened event for your requirement.

 

For more information, please refer these links:

http://docs.fusionch...ntOverview.html

http://docs.fusionch...JavaScript.html

 

 

 

 

Hi Sumedha,

 

Thanks a lot.

It did worked with javascript function call from link attribute in set tag in XML.

 

Thanks Again,

Shweta Sharma

[Guest Sumedh]

Hi Sumedha,

 

Thanks a lot.

It did worked with javascript function call from link attribute in set tag in XML.

 

Thanks Again,

Shweta Sharma

 

Glad to know that solution worked.