Mouse over event on a node of Drag Node chart

[Rama Rao]

Hi,

  I am using a drag node chart. I just want to open a pop up (designed by html) when user clicks on a node. I could do that by triggering

javascript event. But I want to open that pop up at the position of a source node. Meaning, I must able to get the mouse x, y positions where the event is triggered and set pop up's left, top positions to those x, y position.

 

Can we get x, y mouse positions on mouse click/mouse over event on the node of the drag node chart?

 

Thanks,

Rama Rao

 

 

[Guest Sashibhusan]

Hi Rama,

 

Yes, you would get the node position (x and y values) of a Drag Node chart, by clicking of a node. (But on louse over, this can not be achieved)

 

This can be done by calling your own custom JavaScript function in the "link" attribute of the <set> element of chart XML and inside function definition call "getNodeAttribute()" method as per the below sample code.

function getNode_position(Node_id)
{
	var ourChart = FusionCharts("myFirst"); //Provide the chart id to get the chart object instance
	var node_x = ourChart.getNodeAttribute(Node_id).x; //Get the node X position for the clicked node
	var node_y = ourChart.getNodeAttribute(Node_id).y; //Get the node Y position for the clicked node
	alert ("Node Position (x,y)" + node_x + "," + node_y);
}

/*
This function can be called from the XML data as below:
<chart>
...
<set x='12' y='79' width='70' height='56' name='Node 1 with a long label' color='FE3233' id='1' link='JavaScript: getNode_position("1")'/>
...
</chart>
*/

Hope this helps!

 

Looking forward to your valuable response.