Question

我使用高级图表来创建实时图表，其中包含从各种网站获取的信息，我想知道是否可以使用chart.js执行相同操作由于我无法访问系统

，因此将在稍后上传高级图表代码

Answer 1

Chart.js主页http://www.chartjs.org/上有一个实时图表示例。这是相关代码，但您可以从该页面复制完整的工作示例。

for (var i = barsCount - 1; i >= 0; i--) {
    data.push(Math.round(Math.random() * 100));
};
new Chart($id('hero-bar').getContext('2d')).Bar({
    labels : labels,
    datasets : [{
        fillColor : '#2B303B',
        data : data
    }]
},{
    showScale : false,
    barShowStroke : false,
    barValueSpacing: 1,
    showTooltips : false,
    onAnimationComplete : function(){
        // Get scope of the hero chart during updates
        var heroChart = this,
            timeout;
        // Stop this running every time the update is fired
        this.options.onAnimationComplete = randomUpdate;

        this.options.animationEasing = 'easeOutQuint';

        randomUpdate();

        function randomUpdate(){
            heroChart.stop();
            clearTimeout(timeout);
            // Get a random bar
            timeout = setTimeout(function(){
                var randomNumberOfBars = Math.floor(Math.random() * barsCount),
                    i;
                for (i = randomNumberOfBars - 1; i >= 0; i--) {
                    heroChart.datasets[0].bars[Math.floor(Math.random() * barsCount)].value = Math.round(Math.random() * 100);
                };
                heroChart.update();
            },Math.random() * updateDelayMax);
        };
    }
});

使用chart.js的实时图表

1 个答案: