C # trend chart (highcharts plug-in ),

C # trend chart (highcharts plug-in ),

<! -- Chart display --> <div class = "TUI-layout-center" style = "overflow: auto; "id =" appriseContent "> <div class =" ui-layout-center "> <div id =" listDiv "style =" overflow: auto; "class =" TUI-content TUI-h100 "> <! -- Class = "master_table_content_bg" --> <div runat = "server" id = "divData" class = "TUI-content TUI-h100 TUI-of-auto" style = "overflow: auto; "> </div> <div class =" ui-layout-east "id =" divEast "> <div id =" chart_combo "class = "chart_combo" style = "margin-top: 100px; "> </div> <! -- Display chart results -->

View Code

<Script type = "text/javascript"> var ajax = Topevery. DUM. web. ajaxFunction; $ (document ). ready (function () {TUILayout ("form"); createEastLayout (); $ ("td" ).css ("text-align", "center ");}) function createEastLayout () {var myLayout = $ ("# appriseContent "). layout ({fxName: "slide" // fxName form: Hide the animation effect, fxSpeed: "slow" // display time/speed of the fxSpeed animation effect, maskIframesOnResize: false // The maskIframesOnResize page contains an Iframe pair When the image is used, set it to true, closable: false // whether closable allows hiding the form, true to allow, east _ size: "100%" // west _ size is used to adjust the width of the form on the west Side. resizable: false // whether resizable allows you to adjust the height/width of the Form. true indicates yes. sretriable: false // scyclable: whether to allow the form to be hidden. you can slide the preview. north _ fxName: "slide" // north _ fxName indicates the hidden animation effect of the form. south _ fxName: "slide" // south _ fxName: the animation effect hidden in the south form. spacing_closed: 7 // spacing_closed: the height and width of the hidden interval bar. spacing_open: 7 // spacing_open display interval bar height and width, InitClosed: false // After the initClosed form is created, all forms are hidden by default. resizerTip: "Adjust content width" // resizerTip move the mouse up and adjust the text reminder displayed in the form bar. resizerDragOpacity: "0.8" // resizerDragOpacity adjust the transparency of the form bar, sliderTip: "Expand" // sliderTip move the cursor up and move the text reminder displayed in the form bar to hide the text reminder, togglerTip_open: "Hide" // togglerTip_open text reminder of the form button opened with the mouse move up, togglerTip_closed: "Expand" // togglerTip_closed text reminder of the form button closed with the mouse move up, onopen_end: function () {}, onresize_end: function (){} /*, Center _ showOverflowOnHover: true is commented by Aaron, and the drop-down box cannot be used normally in firefox. See http://layout.jquery-dev.com/documentation.cfm#Option_showOverflowOnHover */}); TUILayout ("# divEast"); showCharts1 ();} function showCharts1 () {ajax. getStatisticsHome3List (function (result) {if (result. value) {oneHighcharts (result. value. sbnumber, result. value. yxsbnumber, result. value. janumber) ;}} function oneHighcharts (sbnumber, yxsbnumber, janumber) {var chart; $ (function () {chart = new Highcharts. chart ({chart: {renderTo: 'chart _ combo '// associated page element div # id}, title: {// chart title text: 'month case statistics '}, xAxis: {// X axis categories: ["August", "August ", "August", "August"], // X axis category labels: {y: 18} // X axis label position: 18 pixels below the X axis}, yAxis: {// y axis title: {text: 'number of cases '}, // y axis title lineWidth: 2 // baseline width}, tooltip: {formatter: function () {// format the prompt box var s displayed when the mouse slides to the chart data point; if (this. point. name) {// pie chart s = '<B>' + this. point. name + '</B>: <br>' + this. y + '(' + twoDecimal (this. percentage) + '%)';} else {s = ''+ this. x + ':' + this. y + 'part';} return s ;}}, labels: {// chart tag items: [{html: '', style: {left: '270px ', top: '8px '}]}, exporting: {enabled: false // set the export button to unavailable}, credits: {enabled: false // disable copyright information}, series: [{// data column type: 'line', name: "Total Number of Reported Cases", data: [sbnumber [0], sbnumber [1], sbnumber [2], sbnumber [3], sbnumber [4], sbnumber [5], sbnumber [6], sbnumber [7], sbnumber [8], sbnumber [9], sbnumber [10], sbnumber [11]}, {// data column type: 'line', name: "Number of valid cases", data: [yxsbnumber [0], yxsbnumber [1], yxsbnumber [2], yxsbnumber [3], yxsbnumber [4], yxsbnumber [5], yxsbnumber [6], yxsbnumber [7], yxsbnumber [8], yxsbnumber [9], yxsbnumber [10], yxsbnumber [11]}, {// data column type: 'line', name: "number of cases closed", data: [janumber [0], janumber [1], janumber [2], janumber [3], janumber [4], janumber [5], janumber [6], janumber [7], janumber [8], janumber [9], janumber [10], janumber [11]}); // retain the two-digit decimal function twoDecimal (x) {var f_x = parseFloat (x); if (isNaN (f_x) {alert ('wrong parameter'); return false;} var f_x = Math. round (x * 100)/100; var s_x = f_x.toString (); var pos_decimal = s_x.indexOf ('. '); if (pos_decimal <0) {pos_decimal = s_x.length; s_x + = '. ';} while (s_x.length <= pos_decimal + 2) {s_x + = '0';} return s_x ;}</script>

View Code

 [AjaxPro.AjaxMethod(AjaxPro.HttpSessionStateRequirement.Read)]        public static ForecastData GetStatisticsHome3List()        {            ForecastData date = new ForecastData();                         DataTable dt= UmEventLogic.GetStatisticsHome3List().Tables[0];            for (int i = 0; i < 12; i++)            {                date.sbnumber[i] = Convert.ToInt32(dt.Rows[i]["c_sb_num"]);                date.yxsbnumber[i] = Convert.ToInt32(dt.Rows[i]["c_yxsb_num"]);                date.janumber[i] = Convert.ToInt32(dt.Rows[i]["c_ja_num"]);                            }            return date;        }

View Code