私はハイチャートの棒グラフのコードを書きました。これは、静的データに対しては問題なく動作しています。今、私は5秒間隔で一連のデータを更新する方法を知りたいです。私は棒グラフを使用しています。また、私はどのように私はバーにラベルの値を追加することができます知りたい。バーのシリーズ値をハイチャートの時間間隔で更新するにはどうすればいいですか?
これはバーのHTMLコードです:
<html>
<head>
<title>Highcharts Tutorial</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
</head>
<body>
<div id="container" style="width: 450px; height: 360px; margin: 0 auto"></div>
<script language="JavaScript">
$(document).ready(function() {
var chart = {
type: 'bar'
};
var title = {
text: 'my Statistics'
};
var subtitle = {
text: 'Source: my data'
};
var xAxis = {
lineColor: 'black',
categories: ['User1', 'user2'],
title: {
text: null
}
};
var yAxis = {
gridLineDashStyle: 'shortdash',
min: 0,
max: 140,
tickInterval: 20,
title: {
text: 'Download ',
align: 'high'
},
labels: {
overflow: 'justify'
}
};
var tooltip = {
valueSuffix: ' MB'
};
var plotOptions = {
bar: {
dataLabels: {
enabled: true
},
},
series: {
pointPadding: 0,
pointWidth:40
}
};
var legend = {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: 12,
y: 10,
floating: true,
borderWidth: 1,
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
shadow: true
};
var credits = {
enabled: false
};
var series= [
{
name: 'New',
data: [34.4,31]
},
{
name: 'old',
data: [110, 100]
}
];
var json = {};
json.chart = chart;
json.title = title;
json.subtitle = subtitle;
json.tooltip = tooltip;
json.xAxis = xAxis;
json.yAxis = yAxis;
json.series = series;
json.plotOptions = plotOptions;
json.legend = legend;
json.credits = credits;
$('#container').highcharts(json);
});
</script>
</body>
</html>
と出力はどのように私はいくつかのランダムな値 で動的に系列値を更新することができ
- のように見ていますか?この棒グラフコードで可能ですか?
便利なリンクはありますか?
ここで、ラベルに34.4を追加します。 ラベルの前にはありません。出来ますか ?
提案がありますか?