问题
kindly help me to implement polling in below mentioned code.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
</head>
<body>
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto">Time series Highchart</div>
<script>
$(document).ready(function() {
var options = {
chart: {
renderTo: 'container',
type: 'spline'
},
series: [{}]
};
setInterval(function(){
$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function(data) {
options.series[0].data = data;
var chart = new Highcharts.Chart(options);
});
}, 60000);
});
</script>
</body>
</html>
This is the code which is hitting the rest api and giving the data on highchart. I want to implement the code so that it will show the data on highchart after polling for atleast 60 sec.
回答1:
Right now, with this code, you create a new chart every 60 seconds. If you want only to update data on a chart, use Series.setData() or Series.update() instead.
chart.series[0].setData(data);
API Reference:
http://api.highcharts.com/highcharts/Series.update
http://api.highcharts.com/highcharts/Series.setData
Example:
http://jsfiddle.net/1yfa9qkr/
回答2:
Use the setInterval function: $(document).ready(function() {
var options = {
chart: {
renderTo: 'container',
type: 'spline'
},
series: [{}]
};
var chart = new Highcharts.Chart(options);
setInterval(function(){
$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function(data) {
chart.series[0].setData(data);
});
}, 60000);
Edit: added chart update.
来源:https://stackoverflow.com/questions/45342699/how-to-implement-polling-in-below-mentioned-code-i-want-to-poll-data-every-60-s