对应的js代码
?
//动态创建时间图(date:2012-01-09,author:lwc)
//参数具体见api（highchart）
function getsmsLogpro(paths,proname,objs)
{
???? var nows=new Date();
???? var options = {
????
?????????? chart: {
?????????????? renderTo: 'container'
????????????????? },
???????????? lang:{
??????????????????????? months: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
??????????????????????? shortMonths: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一', '十二'],
??????????????????????? weekdays: ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
??????????????????????? exportButtonTitle:'导出PDF',
??????????????????????? printButtonTitle:'打印报表'
?????????????????? },???
??????????? title:{
??????????????????????? text: '短信日志分析图'
????????????????? },
??????????? rangeSelector: {
??????????????????????? // 缩放选择按钮，是一个数组。
??????????????????????? // 其中type可以是： 'millisecond', 'second', 'minute', 'day', 'week', 'month', 'ytd' (year to date), 'year' 和 'all'。
??????????????????????? // 其中count是指多少个单位type。
??????????????????????? // 其中text是配置显示在按钮上的文字
??????????????????????? buttons: [
??????{type: 'day',
?????????????????? count: 3,
???????????????? text: '3d'
?????????????????? },
??????{
??????????????????????????????? type: 'month',
??????????????????????????????? count: 1,
??????????????????????????????? text: '1月'
??????????????????????????? }, {
??????????????????????????????? type: 'month',
??????????????????????????????? count: 3,
??????????????????????????????? text: '3月'
??????????????????????????? }, {
??????????????????????????????? type: 'month',
??????????????????????????????? count: 6,
??????????????????????????????? text: '6月'
??????????????????????????? }, {
??????????????????????????????? type: 'year',
??????????????????????????????? count: 1,
??????????????????????????????? text: '1年'
??????????????????????????? },{
??????????????????????????????? type: 'year',
??????????????????????????????? count: 3,
??????????????????????????????? text: '3年'
??????????????????????????? }, {
??????????????????????????????? type: 'all',
??????????????????????????????? text: '所有'
??????????????????????????? }],
??????????????????????? // 默认选择域：0（缩放按钮中的第一个）、1（缩放按钮中的第二个）……
??????????????????????? selected: 0
??????????????????????? // 是否允许input标签选框
?????????????????????? // inputEnabled: false
??????????????????? },
?????????????? tooltip:{
?????????????????????? // 日期时间格式化
??????????????????? xDateFormat: '%Y-%m-%d ',
??????????????????? backgroundColor: '#FCFFC5',
??????????????????? valueSuffix: ' 分钟'
????????????????????
????????????????????
??????????????? },??????
?????????????? xAxis:{
??????????????????? tickPixelInterval: 250,
??????????????????????? // 如果X轴刻度是日期或时间，该配置是格式化日期及时间显示格式
??????????????????????? dateTimeLabelFormats: {
??????????????????????????? second: '%Y-%m-%d<br/>%H:%M:%S',
??????????????????????????? minute: '%Y-%m-%d<br/>%H:%M',
??????????????????????????? hour: '%Y-%m-%d<br/>%H:%M',
??????????????????????????? day: '%Y<br/>%m-%d',
??????????????????????????? week: '%Y<br/>%m-%d',
??????????????????????????? month: '%Y-%m',
??????????????????????????? year: '%Y'
??????????????????????? }
??????????????????? },
?????????????????? yAxis: {
??????????????? title: {
??????????????????? text: '时间 (分钟)'
??????????????????????? },
??????????????? plotLines: [{
??????????????????? value: 0,
??????????????????? width: 1,
??????????????????? color: '#808080'
??????????????? }]
??????????? },
????????????????? series: []
??????????????????
??????????????????
??????? };
???
??????? var series = { data: []? };
???????
??????? $.ajax({
????? url:paths+'test/smsLogAnalyJsonAction_sendStock.action',
????? data:'proName='+proname,
????? dataType: 'json',
?????? beforeSend:function(XMLHttpRequest)
???????? {
??????
????????????? objs.html("<img src='images/js/loading.gif'/>");
?????????
???????? },
????????? success:function(datas,textStatus)
?????????? {
???????????
??????????? // alert('开始回调，状态文本值：'+textStatus+' 返回数据：'+datas);
????????????? objs.empty();
????????????? series.name='存储过程:'+datas.entitylist[0].proName;
????
????????????? $.each(datas.entitylist,function(ids,item){
??????????
???????????? var counttimes=item.timsMinutes;
???????????? series.data.push([Date.UTC(item.sysDate.substring(0,4),item.sysDate.substring(4,6)-1,item.sysDate.substring(6,8)),counttimes]);
???
?????????????
???????????? });
???????????? options.series.push(series);
???????????? var chart = new Highcharts.StockChart(options);????????????????????????????????????
?????????? }
????? });
?????
???????
???????
???????
???????
?
??
??
}
?
?
?
?
?
对应的界面：
?
$(function() {
???? $(document).ready(function() {
???? var paths='<%=basePath%>';
???? var proname=document.getElementById("proName").value;
???? var protype=document.getElementById("types").value;
???? if(protype==1)
???? {
???? //频率图形
????? getsmsrates(paths,proname)
???? }
???? else
???? {
????? //时间图
????? // getsmsLogpro(paths,proname);
?????
?????
????? //请求
????
????
????? var objs=$("#loading");
?? getsmsLogpro(paths,proname,objs);
??????
???? }
?????
?????
?????
?????
?????
?????
???? });
?<div id="loading"></div>
?
?
需要案例发信息我
?