HighStock如何动态添加数据组
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();
}
}
HighStock如何动态添加数据组的更多相关文章
- 【javascript 动态添加数据到 HTML 页面】
今天简单的学习了一下有关对象字面量的定义和 javascript 如何取出对象字面量的值的知识,javascript 动态添加数据到 HTML 页面的问题. [学习目标]有如下的一组数据通过 Ajax ...
- 关于devexpress报表XtraReport,动态修改报表样式(.repx格式),动态添加数据并使用的理解
一.基本概念: XtraReports 中的每个报表都由 XtraRepot 类的一个实例表示,或者由该类的子类来表示(这种情况更常见). 因此,每个报表都作为带区的容器使用,而每个带区中都包含报表控 ...
- js表单动态添加数据并提交
情景1:已经存在form对象了,动态为form增加对象并提交 function formAppendSubmit(){ var myform=$('#newArticleForm'); //得到for ...
- 第27讲 UI组件之 ScrollView与底部动态添加数据
第27讲 UI组件之 ScrollView与底部动态添加数据 1. ScrollView(滚动视图) ScrollView(滚动视图)是实现滚动的一个控件,只需要将需要滚动的控件添加到ScrollVi ...
- Android之ListView动态添加数据(SQLiteOpenHelper类添加数据)
一.SQLiteOpenHelper类: 这次我们通过sqlite来动态添加数据,接下来我们创建一个openHelper.java,在前面sqlite博客中我们已经详细的讲了SQLite的创建及使用等 ...
- Jquery+Ajax实现Select动态添加数据
https://blog.csdn.net/zhengxiangwen/article/details/46480687 最近在工作中,遇到了一个关于select的问题.一般情况下,select下拉框 ...
- ASP.NET网页动态添加数据行
一看到这标题<ASP.NET网页动态添加数据行>,想起来似乎有点难实现.因为网页的周期性原因,往往在PostBack之后,状态难于有所保留.但Insus.NET又想实现这样的效果,用户点击 ...
- silverlight RadGridView 动态添加数据列
public void BindFaultGridInfo(IList<HealthStatusApp.Web.Models.FaultMajorModel> list) { rg_Fau ...
- Layui表格之动态添加数据(表格多选解决方案)
前言: Layui已经给出了多选记录的解决方案,是在每条数据的前面加上CheckBox,每次选择都有监听.效果是这样: 实现监听的代码如下,这是一种解决选择多条数据的方案: table.on('edi ...
随机推荐
- 检测Sql Server服务器SQL语句执行情况
1.查找目前SQL Server所执行的SQL语法,并展示资源情况: SQL code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ...
- jQuery实现锚点跳转(就一行代码)
/* 锚点跳转 */ function anchor(p,fn) { $("html,body").animate({ scrollTop: $("#" + p ...
- php随机生成汉字实现方法
GB 2312-80 是中国国家标准简体中文字符集,全称<信息交换用汉字编码字符集·基本集>,由中国国家标准总局发布,1981年5月1日实施.GB2312 编码通行于中国大陆:新加坡等地也 ...
- 【Kafka】Kafka-分区数-备份数-如何设置-怎么确定-怎么修改
Kafka-分区数-备份数-如何设置-怎么确定-怎么修改 kafka partition 数量 更新_百度搜索 kafka重新分配partition - - CSDN博客 如何为Kafka集群选择合适 ...
- Android面试题收集
Android是一种基于Linux的自由及开放源码的操作系统,主要使用于移动设备.如智能手机和平板电脑.由Google公司和开放手机联盟领导及开发.这里会不断收集和更新Android基础相关的面试题, ...
- [Functional Programming] Running though a serial number prediction functions for tagging, pairing the result into object
Let's we have some prediction functions, for each prediction function has a corresponding tag: const ...
- Dijkstra和Floyd_warshall
import java.util.Arrays; import java.util.Scanner; /*题目描写叙述: 有n个城市.城市间有m条道路.每条道路都有长度d.给你起点城市s终点终点t.要 ...
- [Canvas]RPG游戏雏形 (地图加载,英雄出现并移动)
源码请点此下载并用浏览器打开index.html观看 图例: 代码: <!DOCTYPE html> <html lang="utf-8"> <met ...
- iOS社交app技术合伙人笔试题
理想状况当然是找到有管理能力且还在写代码的架构师了,然而假设有这种人,他自己能发起项目了.你要拉上他还真难.满足一定条件就可以了,别追求完美. 还有比这更完美的吗?请生产这种机器人: 性格开朗(开朗≠ ...
- Android 多语言支持
本文内容 字符串本地化原理 环境 创建项目 测试其他语言 Android 本地化语言 ISO 编码 参考资料 使用 Android 的人越来越多,每天都在增加.因此,当你想把你的应用成功地全球化时,通 ...