<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="../../js/my/highcharts.js"></script>
<script src="../../css2/jquery-1.10.2.min.js"></script>
</head>
<body>
<div class="piecleft" id="chart" style="height:350px; width: 350px;">
</div>
<script type="text/javascript" charset="utf-8">
$.ajax({
url: "/handler/hbtongji.ashx",
type: "GET",
data: {},
success: function (data) { var obj = eval('(' + data + ')');
transfer = parseInt(obj["state"][]["transfer"]);
transferNO = parseInt(obj["state"][]["transferNO"]);
var dataset = [transfer, transferNO];
var chart;
$(document).ready(function () {
chart = new Highcharts.Chart({
chart: {
renderTo: 'chart'
},
title: {
text: '划拨土地饼状图统计'
},
plotArea: {
shadow: null,
borderWidth: null,
backgroundColor: null
},
tooltip: {
formatter: function () {
return '<b>' + this.point.name + '</b>: ' + Highcharts.numberFormat(this.percentage, ) + '% (' +
Highcharts.numberFormat(this.y, , ',') + ' 个)';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
formatter: function () {
if (this.percentage >) return this.point.name;
},
color: 'white',
style: {
font: '13px Trebuchet MS, Verdana, sans-serif'
}
}
}
},
legend: {
backgroundColor: '#FFFFFF',
x: ,
y: -
},
credits: {
enabled: false
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
['未划拨地块', transfer],
['已划拨地块', transferNO]
]
}]
});
});
}
}) </script>
</body>
</html>
html页面
<%@ WebHandler Language="C#" Class="hbtongji" %> using System;
using System.Web;
using System.Data;
using System.Text;
using System.Runtime.Serialization.Json;
using System.Web.Script.Serialization;
using KangHui.BaseClass;
using KangHui.Common; public class hbtongji : IHttpHandler { public void ProcessRequest (HttpContext context) {
string con = ConfigHelper.GetConnectionString("DBConnection");
//这是一个显示的数据（未出让地块的数量）
string sql = "SELECT COUNT(*) as sum FROM Mhuabo WHERE stateID=4";
//这是一个显示的数据（已出让地块的数量）
string sql1 = "SELECT COUNT(*) as sum FROM Mhuabo WHERE stateID=5";
DataSet ds = DbHelperSQL.Query(sql,con);
DataSet ds1 = DbHelperSQL.Query(sql1,con); StringBuilder str = new StringBuilder();
str.Append("{\"state\":[{\"transfer\":\"" + ds.Tables[].Rows[]["sum"] + "\"},{\"transferNO\":\"" + ds1.Tables[].Rows[]["sum"] + "\"}]");
str.Append("}");
context.Response.Write(str.ToString());
} public bool IsReusable {
get {
return false;
}
} }
一般处理程序页面
公司项目要做统计，饼状图必不可少，闲手之余，写下这篇博客，希望能帮助新手的你。
-----------------------------------------未点饼状图之前
-----------------------------------------点击饼状图的时候