代码语言：javascript
复制var chart_data;
var pie_index;
//页面载入
$(function () {
chart_data = $.parseJSON($("#txtType0").val());
if(chart_data.length<1){
return 0;
}
pie_index = 0;
CreateDChart();
CreatePChart()
})
//画饼状图
function CreatePChart(index){
var data1 = {label:chart_data[pie_index]["NAME"] "-已完成",data:chart_data[pie_index]["VALUE"],color:"#3EB9FF"};
var data2 = {label:chart_data[pie_index]["NAME"] "-未完成",data:chart_data[pie_index]["VALUE1"],color:"#FFD33A"};
var pie = $.plot($("#pieChart"),[data1,data2],{series:{pie:{show:true}},legend:{show:false}});
}
//画柱状图
function CreateDChart(){
var options = {
series: { shadowSize: 0,bars: { show: true } },
grid: { hoverable: true,clickable: true},
yaxis: { min: 0, max: 0 },
xaxis: { min:0,max:0, ticks: [[0,""]] }
};
var data1 = [0,0];
var data2 = [1,0];
var flag = 5;
for(var i=0;i<chart_data.length;i ){
if(chart_data[i]["VALUE"]>options.yaxis.max-20){options.yaxis.max = chart_data[i]["VALUE"] 20}
if(chart_data[i]["VALUE1"]>options.yaxis.max-20){options.yaxis.max = chart_data[i]["VALUE1"] 20}
options.xaxis.ticks.push([i*flag flag,chart_data[i]["NAME"]]);
data1.push([i*flag flag,chart_data[i]["VALUE"]])
data2.push([i*flag flag-1,chart_data[i]["VALUE1"]])
}
options.xaxis.max = chart_data.length*flag flag
$.plot($("#dColumnChart"),[{label:"未完成",data:data2,color:"#FFD33A"},{label:"已完成",data:data1,color:"#3EB9FF"}],options)
bindEvent("dColumnChart");
}
//鼠标滑上显示提示信息
function showTooltip(x, y, contents) {
$('<div id="tooltip">' contents '</div>').css( {
position: 'absolute',
display: 'none',
top: y - 10,
left: x 10,
border: '1px solid #fdd',
padding: '2px',
'background-color': '#fee',
opacity: 0.80
}).appendTo("body").fadeIn(200);
}
//柱状图绑定事件
function bindEvent(placeId){
$("#" placeId).bind("plotclick", function (event, pos, item) {
if (item) {
var id = item.dataIndex-2;
if(id == pie_index){
return false;
}
pie_index = id;
CreatePChart();
}
});
$("#" placeId).bind("plothover", function (event, pos, item) {
if (item) {
var y = item.datapoint[1];
var sd = item.series.label ":" y "人";
if($("#tooltip").text() == sd){
if($("#tooltip").offset().left-10 == item.pageX){
return false;
}
}
$("#tooltip").remove();
showTooltip(item.pageX, item.pageY,sd);
}
else {
$("#tooltip").remove();
}
});
}
