Highcharts.setOptions({global:{useUTC : false}});    
$(function(){      
    //声明报表对象      
    var chart = new Highcharts.Chart({      
        chart: {    
        renderTo: 'container', // 报表显示在 页面位置 container 为 div 定义的属性    
        defaultSeriesType: 'spline', // 定义报表类型 例如：line ，spline ，colume    
        events: {    
                load:  getForm  //调用js 方法    
            }    
        },    
        title:{    
            text:'实时监测曲线图" //定义曲线报表 名称    
        },    
        xAxis: {    
            type: 'datetime', // 定义时间轴的 类型    
            maxPadding : 0.05,    
            minPadding : 0.05,    
            tickWidth:1,//刻度的宽度    
            lineWidth :1,//自定义x轴宽度    
            gridLineWidth :1,//默认是0，即在图上没有纵轴间隔线    
            lineColor : '#990000'       
        },    
        yAxis: {    
                max:12, // 定义Y轴 最大值    
                min:0, // 定义最小值    
                minPadding: 0.2,     
                maxPadding: 0.2,    
                tickInterval:1, // 刻度值    
                title: {    
                    text: 'PH值'    
                },    
                // plotLines 表示为定义曲线报表中的 （刻度线）或者叫做（定义的区间范围）    
// 一下为2条表示线    
                plotLines: [{     
                            value: 6,    
                            color: 'green',    
                            dashStyle: 'shortdash',    
                            width: 2,    
                            label: {    
                                text: '正常'    
                            }    
                        },{    
                            value: 8,    
                            color: 'green',    
                            dashStyle: 'shortdash',    
                            width: 2,    
                            label: {    
                                text: '正常'    
                            }    
                        }    
                }]    
        },    
        tooltip: {  // 表示为 鼠标放在报表图中数据点上显示的数据信息    
            formatter: function() {    
                  return '<b>'+'日期:' +'</b>'    
+Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+    
                   '<b>'+'<%=lbname%>:' +'</b>'+ this.y+'  <%=shll%>';    
            }    
        },    
        series: [{    
            name: 'PH',    
            data: [] // 此处存放数据值 用,分开 例如：1.8,8.9,null,9.2,   如果在某一点数据为空      
//可以用null 来表示     
            //如果是想动态扶植  这个位置 应该为空 即：data: []    
        }]    
    });      
    // 与后台进行数据交互    
    function getForm(){      
        jQuery.getJSON("test!test.do?id=123456", null, function(data) {       
            //为图表设置值       
            chart.series[0].setData(data);       
        });         
    }      
    //定时刷新 列表数据    
   $(document).ready(function() {      
       //每隔3秒自动调用方法，实现图表的实时更新      
       window.setInterval(getForm,50000);       
   });      
});    
    
//定义 曲线报表图 的样式    
    Highcharts.theme = {    
       colors: ['#058DC7', '#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655',    
 '#FFF263', '#6AF9C4'],    
       chart: {    
          backgroundColor: {    
             linearGradient: [0, 0, 500, 500],    
             stops: [    
                [0, 'rgb(255, 255, 255)'],    
                [1, 'rgb(240, 240, 255)']    
             ]    
          },    
          borderWidth: 2,    
          plotBackgroundColor: 'rgba(255, 255, 255, .9)',    
          plotShadow: true,    
          plotBorderWidth: 1    
       },    
       title: {    
          style: {     
             color: '#000',    
             font: 'bold 16px "Trebuchet MS", Verdana, sans-serif'    
          }    
       },    
       subtitle: {    
          style: {     
             color: '#666666',    
             font: 'bold 12px "Trebuchet MS", Verdana, sans-serif'    
          }    
       },    
       xAxis: {    
          gridLineWidth: 1,    
          lineColor: '#000',    
          tickColor: '#000',    
          labels: {    
             style: {    
                color: '#000',    
                font: '11px Trebuchet MS, Verdana, sans-serif'    
             }    
          },    
          title: {    
             style: {    
                color: '#333',    
                fontWeight: 'bold',    
                fontSize: '12px',    
                fontFamily: 'Trebuchet MS, Verdana, sans-serif'    
    
             }                
          }    
       },    
       yAxis: {    
          //minorTickInterval: 'auto'  // 此处会在Y轴坐标2点之前出现小格  所以就没有使用。    
       },    
       legend: {    
          itemStyle: {             
             font: '9pt Trebuchet MS, Verdana, sans-serif',    
             color: 'black'    
          },    
          itemHoverStyle: {    
             color: '#039'    
          },    
          itemHiddenStyle: {    
             color: 'gray'    
          }    
       },    
       labels: {    
          style: {    
             color: '#99b'    
          }    
       }    
    };    
    var highchartsOptions = Highcharts.setOptions(Highcharts.theme);