Highcharts样条线问题未正确定位

时间:2018-05-08 10:32:54

标签: javascript highcharts

我遇到了Highcharts样条图表的问题,我基本上是在绘制CPU / RAM图表,从我的NAS API获取值。

这基本上就是图表。

enter image description here

正如您所看到的,这个值是正确的( 6 )。

enter image description here

这个不是, 3 当然低于 6 ,但显示高于 3

enter image description here

在这里你可以看到 1 值,大约是24%(RAM值)。

enter image description here

这是图表创建:

Highcharts.chart({
        title: {
            text: 'CPU and RAM'
        },
        chart: {
            renderTo: 'cpu-memory-chart',
            type: 'spline',
            animation: Highcharts.svg
        },
        plotOptions: {
            series: {
                stacking: 'normal',
                shadow: false,
                groupPadding: 0,
                pointPadding: 0.2,
                animation: 1000
            },
            spline: {
                marker: {
                    enabled: false
                }
            }
        },
        yAxis: {
            title: '%',
            max: 100,
            min: 0
        },
        xAxis: {
            type: 'datetime',
            tickInterval: 1000,
            labels: {
                /*style: {
                    color: '#aaa'
                }*/
                enabled: false
            }
        },
        exporting: {
            enabled: false
        },
        colors: ['#4CAF50', '#1F80ED'],
        series: [
            {
                name: "CPU",
                pointInterval: 1000,
                pointStart: (new Date()).getTime()
            },
            {
                name: "RAM",
                pointInterval: 1000,
                pointStart: (new Date()).getTime()
            }
        ]
    });
}

这就是我更新积分的方式:

(请注意,数据是API调用的结果, cpuRamSeries 是图表的系列)

if(points < 10){
                points++;
                cpuRamSeries[0].addPoint([(new Date()).getTime(), data.cpu]);
                cpuRamSeries[1].addPoint([(new Date()).getTime(), data.ram]);
            }else{
                cpuRamSeries[0].addPoint([(new Date()).getTime(), data.cpu], false, true);
                cpuRamSeries[1].addPoint([(new Date()).getTime(), data.ram], false, true);
                cpuRamChart.redraw();
            }

这是我第一次尝试使用Highcharts,所以我真的不知道问题出在哪里。任何建议表示赞赏:)

0 个答案:

没有答案