Show cursor on mouse over of chart image

[abcParticipant]

Hi,

I want to show hand pointer instead of arrow cursor on mouse over of chart image,

i tried it with css,

e.g :  $(‘#jqxChart’).css( ‘cursor’, ‘pointer’ );

but it is showing that cursor on mouse over of whole div,i want it for the image only,

any solution?

[DimitarParticipant]

Hello abcd,

Here is how to achieve this:

// get the series groups of an existing chart
var groups = $('#jqxChart').jqxChart('seriesGroups');
// add a mouseover event handler function to the 1st group    
if (groups.length > 0) {
    groups[0].mouseover = function (e) {
        $('#jqxChart').css('cursor', 'pointer');
    };
    groups[0].mouseout = function (e) {
        $('#jqxChart').css('cursor', 'default');
    };
    // update the group
    $('#jqxChart').jqxChart({ seriesGroups: groups });
};

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[abcParticipant]

Hi Dimitar,
Thank you so much. its nice .

[Florian AuerParticipant]

Hello Dimitar

I recently updated my charts to version 3.9 of the library.
As for now, the event to set the cursor is still being fired, but I cannot see any effect in visualization.
Did here change something?

my code:

		var groups = $(fSettings.anchor).jqxChart('seriesGroups');
		if (groups.length > 0) {
			groups.forEach(function(element, index, array){
				element.click = function(e){
					/*....*/
				};
				//FIXME: no longer working in 3.9.0
				element.mouseover = function(e){
					$(fSettings.anchor).css('cursor', 'pointer');
				};
				element.mouseout = function(e){
					$(fSettings.anchor).css('cursor', 'default');
				};
			});
		}
		$(fSettings.anchor).jqxChart({seriesGroups: groups});

[DimitarParticipant]

Hello DesMas,

A lot of changes have been introduced to jqxChart’s API in the last two years. The demo Chart Events shows how to correctly bind to events in version 3.9.0.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts