I try to use jqPlot in my jsp project. I need to draw pie chart. With pie chart everything is ok, it works fine.
Then I want to show tooltip with some data when cursor is over the slice. For these, I can use highlighter which is provide by jqPlot, but I don't know how to do this.
In .jsp file I include
<script language="JavaScript"src="../../common/jsc/plugins/jqplot.highlighter.min.js"></script>
My javascript code:
$(document).ready(function(){
var url = 'supplyCalendarDayDetailsCharts.jsp?date=' + getEl('date').value + '&action=COG';
$.ajax({
url: url,
type: "GET",
dataType: "json",
success: function(data) {
var dataTmp = [];
for (var i in data) {
var dataPush = [data[i].cp_code, parseInt(data[i].value)];
dataTmp.push(dataPush);
}
var plot1 = jQuery.jqplot('chartdiv', [dataTmp],
{
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percentage of the slice.
dataLabels: 'value',
showDataLabels: true
}
}
}
);
}
});
});
With AJAX I get json like this: [{"code":"CODE01","value":"1"},{"code":"CODE02","value":"3"}]
In pie chart I want to show value and when mouse is over slice I want to show code in tooltip.
Where shoud I use highlighter event? I tried in seriesDefaults body - after rendererOptions but maybe I use wrong options...
Please help me, and sorry for my english. Regards Łukasz
You need to add plug-ins:
You need to add settings: