㈠ highcharts绘图，怎么从后台数据库中获取数据
先用ajax jquery 访问 一般处理程序.然后一般处理程序 用三层架构 获取数据库数据，比如是数据集(或表格) 然后在逻辑处理层 转换为json 格式的。
然后 返回到一般处理程序 ，将转换后的json数据 respon.write，然后 在ajax 的success 获取date 然后 json循环到 highcharts 里的字段
㈡ highcharts 怎么使用 oracle 数据库的值，来生成动态图表
你试试finereport，它是可以做动态图的，而且还可以再图表上做超链接什么的，点一下图片的一个位置，可以调到更细的图表
㈢ 如何将数据库的数据放到highcharts动态显示
引用来自“李照全”的答案 highcharts API你没问题吧，即用假数据可以生产图表不?如果没问题，用Ajax请求后台数据库，然后把数据替上就行了。
㈣ 用highcharts加载图像之后动态改变图像
js代码：
$(function() { $(document).ready(function() { Highcharts.setOptions({ global: { useUTC: false } }); var chart; chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'spline', animation: Highcharts.svg, // don't animate in old IE marginRight: 10, events: { load: function() {} } }, title: { text: 'Live random data' }, xAxis: { type: 'datetime', tickPixelInterval: 150 }, yAxis: [{ title: { text: 'Value' }, plotLines: [{ value: 0, width: 1, color: '#808080' }] }, { title: { text: 'Name' }, plotLines: [{ value: 0, width: 1, color: '#808080' }] }], tooltip: { formatter: function() { return '<b>' + this.series.name + '</b><br/>' + Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' + Highcharts.numberFormat(this.y, 2); } }, legend: { enabled: false }, exporting: { enabled: false }, series: [{ name: 'Random data', data: (function() { // generate an array of random data var data = [], time = (new Date()).getTime(), i; for (i = -19; i <= 0; i++) { data.push({ x: time + i * 1000, y: Math.random() }); } return data; })() }, { name: 'Random data', data: (function() { // generate an array of random data var data = [], time = (new Date()).getTime(), i; for (i = -19; i <= 0; i++) { data.push({ x: time + i * 1000, y: Math.random() }); } return data; })() }] }); // set up the updating of the chart each second var series = chart.series[0]; var series1 = chart.series[1]; setInterval(function() { var x = (new Date()).getTime(), // current time y = Math.random(); series.addPoint([x, y + 1], true, true); series1.addPoint([x, y - 1], true, true); }, 1000); }); });
html代码：
<head> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/highcharts.js"></script> <script type="text/javascript" src="js/exporting.js"></script> <script> //左侧Javascript代码 </script> </head> <body> <div id="container" style="min-width:700px;height:400px"></div> </body>
以上这篇Highcharts 多个Y轴动态刷新数据的实现代码 就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
㈤ web程序，架构是springmvc（controller等），前台是jquery，如何利用highcharts动态从数据库中查找数据。
前台接到的,用@ResponseBody可以转换为java对象,不需要在parseJSON
如ret,可以直接ret.propName获取属性值
以下一个简单例子,没有实现
java:
@Controller
@RequestMapping("/beanName")
publicclassNameController{
@ResponseBody
@RequestMapping("/beanMethod")
//params的类型只是举个栗子
publicReturnBeanmethodName(@RequestBodyMap<String,Object>params){
//...loaddata
//...covertdata2ReturnBean,mayreturnList<ReturnBean>orelse
returnreturnBean;//(instance)
}
}
jquery:
[]及其中内容替换
$.ajax({
url:[ApplicationContext+/beanName/methodName],//eg:/webapp/beanName/meghotName
type:"POST",
contentType:'application/json',
//data为传入后端参数,为json数据,mvc自己转换成@RequestBody后指定的类型
//parseeg:
//if($.isPlainObject(data)||typeofdata!="string"){
//data=$.toJSON(data);
//}
data:[mayaobject,mvcautoconvert],
success:function(retBean){
//makehighchartserias
//ifhighchartinit$('#chartDomId').highcharts().series[0].setData([highchartserias])
//
//highchart的serias可以有很多种构造,可以是
//series:[{
// type:'column',
// name:'seriesName',
// data:[['column1',1],['column2',2]]
//}]
//也可以是
//series:[{
// type:'column',
// name:'seriesName',
// data:[{id:1,y:1},{id:2,y:2}]
//}]
//根据需要自行拼接
},
error:function(XMLHttpRequest,textStatus,errorThrown){
//doonerror
},
});
㈥ highcharts如何实现动态刷新
highcharts如何实现动态刷新
实现的是折线图。目前已经实现了从数据库中加载数据，但是定时刷新数据不知道怎么实现。
使用chart.series[0].setData(data);每次刷新后表数据就没有了，不知道是不是data的格式写错了，
想问下参数data的数据格式的例子。
function getForm(){
//使用JQuery从后台获取JSON格式的数据
$.ajax({
type: "POST",
url: "chart.ashx",
success: function(data){
chart.series[0].setData(data);
},
error:function(msg)
{
alert("通信错误!");
}
});
$(document).ready(function() {
//每隔1秒自动调用方法，实现图表的实时更新
window.setInterval(getForm,10000);
});
㈦ highcharts中的data如何循环添加多条数据
使用一个全局变量遍历数据获取到存起来比如我用的叫line_list 然后放到容器里面就好
series:line_list 然后就Ok了
㈧ Highcharts如何动态加载双y轴的数据谢谢！
这个例子有点复杂，给你说个思路，其实Y轴一个的时候，它也是一个数组[0]当两个Y那么你在里面在加同样Y[1]主要是里面你需要加一个分组的属性stack。然后下面series[{
这里面也需要放一个分组的属性stack:'1'值随便定。和上面y的分组名称对应就行。希望能帮到你}]
㈨ Highcharts动态显示多条实时曲线，怎么初始化数据
$(function () {
$(document).ready(function () {
Highcharts.setOptions({
global: {
useUTC: false
}
});
var chart;
$('#container').highcharts({
chart: {
type: 'spline',
animation: Highcharts.svg, // don't animate in old IE
marginRight: 10,
events: {
load: function () {
// set up the updating of the chart each second
var series = this.series[0];
var series1 = this.series[1];
setInterval(function () {
var x = (new Date()).getTime(), // current time
y = Math.random();
y2 = Math.random();
series.addPoint([x, y], true, true);
series1.addPoint([x, y2], true, true);
}, 1000);
}
}
},
title: {
text: 'demo（样例）'
},
xAxis: {
type: 'datetime',
tickPixelInterval: 150
},
yAxis: {
title: {
text: 'Value'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
Highcharts.numberFormat(this.y, 2);
}
},
legend: {
enabled: false
},
exporting: {
enabled: false
},
series: [{
name: 'Random data',
data: (function () {
// generate an array of random data
var data = [],
time = (new Date()).getTime(),
i;
for (i = -19; i <= 0; i++) {
data.push({
x: time + i * 1000,
y: Math.random()
});
}
return data;
})()
}, {
name: 'Random data1',
data: (function () {
// generate an array of random data
var data = [],
time = (new Date()).getTime(),
i;
for (i = -19; i <= 0; i++) {
data.push({
x: time + i * 1000,
y: Math.random()
});
}
return data;
})()
}]
});
});
});
㈩ 如何让highcharts折线图读取数据库json格式数据并在图表上显示
Highcharts与Ajax结合实现实时刷新图表——PHP版
参考网址：网页链接
参考官网：网页链接
一、环境及sql
开发语言：php+Jquery
数据库：mysql
数据表结构：