var charts = null;
$(function () {
var seriesIds = [830];
// Create the chart
charts = new Highcharts.StockChart({
chart: {
renderTo: 'container',
borderWidth: 1 //边框宽度
},
exporting: {
enabled: true //是否能导出趋势图图片
},
title: {
text: "AAPL Stock Price(报名统计)", //图表标题
floating: true
},
xAxis: {
tickPixelInterval: 200,
labels: {
align: 'center'
},
dateTimeLabelFormats: {
second: '%Y-%m-%d-%H:%M:%S',
minute: '%Y-%m-%d-%H:%M',
hour: '%Y-%m-%d-%H:%M',
day: '%Y-%m-%d',
week: '%Y-%m-%d',
month: '%Y-%m',
year: '%Y'
}
},
yAxis: {
title: {
text: "Rate(个数)" //y轴上的标题
},
labels: {
//设置纵坐标值的样式
formatter: function () {
return this.value + "个";
}
}
},
rangeSelector: {
// 缩放选择按钮,是一个数组。
// 其中type可以是: 'millisecond', 'second', 'minute', 'day', 'week', 'month', 'ytd' (year to date), 'year' 和 'all'。
// 其中count是指多少个单位type。
// 其中text是配置显示在按钮上的文字
buttons: [{
type: 'month',
count: 1,
text: '1月'
}, {
type: 'month',
count: 3,
text: '季度'
}, {
type: 'year',
count: 1,
text: '1年'
}, {
type: 'all',
text: '全部'
}],
//表示以上定义button的index,从0开始
selected: 1,
//日期输入框中格式
inputDateFormat: '%Y-%m-%d'
},
tooltip: {
xDateFormat: '%Y-%m-%d, %A'//鼠标移动到趋势线上时显示的日期格式
},
series: [],
//底部滑轮控制
navigator: {
xAxis: {
tickPixelInterval: 200,
labels: {
align: 'right'
},
dateTimeLabelFormats: {
second: '%Y-%m-%d-%H:%M:%S',
minute: '%Y-%m-%d-%H:%M',
hour: '%Y-%m-%d-%H:%M',
day: '%Y-%m-%d',
week: '%Y-%m-%d',
month: '%Y-%m',
year: '%Y'
}
}
}
});
$.each(seriesIds, function (j, pid) {
$.ajax({
type: "post",
url: "retrunJsonStr.ashx",
async: false,
dataType: "text",
data: { pid: pid },
success: function (json) {
charts.addSeries({
name: pid,
type: 'spline',
data: eval('(' + json + ')')
}, false);
charts.redraw(); //刷新
}
});
});
});
function getChart(obj) {
var pid = $(obj).val();
var isCk = $(obj).attr("checked");
if (isCk) {
$.ajax({
type: "post",
url: "retrunJsonStr.ashx",
async: false,
dataType: "text",
data: { pid: pid },
success: function (json) {
charts.addSeries({
name: pid,
type: 'spline',
data: eval('(' + json + ')')
}, false);
charts.redraw();
}
});
} else {
for (var i = 0; i < charts.series.length; i++) {
if (charts.series.name == pid) {
charts.series.remove(false);
}
}
charts.redraw();
}
}