<% @ Page Language = " C# " AutoEventWireup = " true " CodeFile = " WorkDoneChartByCenter.aspx.cs " Inherits = " WorkDoneChartByCenter " %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html xmlns ="http://www.w3.org/1999/xhtml" >

< head runat ="server" >

< title > 工作量统计 - 奥鹏 </ title >

< script type ="text/javascript" src ="JScript/jquery.min.js" ></ script >

< script src ="JScript/highcharts.js" type ="text/javascript" ></ script >

< script src ="JScript/modules/exporting.js" type ="text/javascript" ></ script >

</ head >

< body >

< form id ="form1" runat ="server" >

< script type ="text/javascript" >

var chart;

       $(document).ready( function () {

            chart = new Highcharts.Chart({

               chart: {

                   renderTo: ' container ' ,           // 放置图表的容器

                   defaultSeriesType: ' column ' ,     // 图表类型line, spline, area, areaspline, column, bar, pie , scatter

// zoomType: 'x',                  //放大

                   inverted: false // 左右显示，默认上下正向

               },

               title: {                            

                   text: ' ITOMS工作量统计 ' ,         // 图标的标题

                   style:{}                         // 标题样式

               },

               subtitle: {                        

                   text: ' 按中心统计 ' // 图标的副标题

               },

               xAxis: {                            

                   categories: <%= xAxisCategories %> , // X轴的坐标值

                   labels: {

                       rotation: - 45 ,

                       align: ' right ' ,

                       style: {font: ' normal 13px 宋体 ' }

                   }

               },

               yAxis: {

                   min: 0 ,

                   title: {text: ' 数量（小时/个数） ' }   // Y轴坐标标题  labels:纵柱标尺

               },

               legend: {                               // 【图例】位置样式

                   layout: ' horizontal ' ,               // 【图例】显示的样式：水平（horizontal）/垂直（vertical）

                   backgroundColor: ' #FFFFFF ' ,

                   borderColor: ' #CCC ' ,

                   borderWidth: 1 ,

                   align: ' center ' ,

                   verticalAlign: ' top ' ,

                   enabled: true ,

// x: 100,

                   y: 50 ,

// floating: true,

                   shadow: true

               },

// loading: {  需要配合chart.showLoading();使用

//    hideDuration: 10000,

//    showDuration: 10000

// },

               tooltip: {

                   formatter: function () {                 // 当鼠标悬置数据点时的格式化提示

return ' <b> ' + this .x + ' </b><br/> ' + this .series.name + ' : ' + Highcharts.numberFormat( this .y, 1 );

                   }

               },

               credits: {

                   enabled: false

               },

               plotOptions: {

                   column: {

                       pointPadding: 0.2 ,   // 图表柱形的

                       borderWidth: 0 // 图表柱形的粗细                    },bar: {

                       dataLabels: {

                           enabled: false

                       }

                   }

               },

               series: <%= returnValue %>

           });

// chart.showLoading();

       });

</ script >

< div id ="container" style ="min-width: 800px; height: 500px; margin: 0 2em" ></ div >

< div class ="result" ></ div >

</ form >

</ body >

</ html >

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

public partial class WorkDoneChartByCenter : System.Web.UI.Page

{

public string returnValue = " [{name: '任务单数量',data: [370.0,162.0,13,13,370.0,162.0,13,13]}, {name: '计划工时（小时）',data: [120,23,25,2,370.0,162.0,13,13]}, {name: '实际人数',data: [60,43,65,20,30.0,12.0,13,103]}, {name: '实际工时（小时）',data: [89,57,114,26,32,52.0,43,63]}] " ;

public string xAxisCategories = " ['IT中心部门', '创前万博考试', '电大服务中心', '考试服务中心','财务部','学生服务中心','职教中心','总经办'] " ;

protected void Page_Load( object sender, EventArgs e)

   {

   }

}