2
votes

I was using flot pie chart(http://www.flotcharts.org/flot/examples/series-pie/index.html) example and succesfully drew the pie charts. While styling the pie chart, I was able to find the options for pie like colors and opacity and al. but I wanted to change the cursor styling on pie and I found that in the offcial flot page itself it is using ordinary cursor wehn we hover over pie slices. Instead i wanted to change it to cursor pointer styling.. when we give the creating canvas that property it will show pointer cursor for the whole canvas.. so if the canvas is big, it will be pointer cursor even if we hover outside pie graph. Ive also tried to giv the proeprty while at the time of creation,

   $.plot($("#canvas_" + key.split(" ").join("_")), pieChartData[key], {
        series: {
            pie: {
                show: true,
                radius: 1,
        innerRadius: 0.3,
        cursor : 'pointer',
                stroke: {
                    color: '#ffffff',
                    width: 2.0
                }
            },
        }
    });

This will not work.. is there any solution for this issue?

2

2 Answers

4
votes

Take a look at the 'hoverable' option, described under Customizing the Grid in the docs and demonstrated in the pie example.

Leave the cursor at default to begin with, then change it to the pointer when you receive a hover event over a pie slice. When you receive a hover event with no attached slice, set the cursor back to default.

0
votes

You could just target the pie chart and change the CSS class in your stylesheet:

.flot-overlay { cursor: pointer; }

It's not the most graceful way, but it will work!