为highcharts中的缺失数据设置为零

时间:2017-09-08 08:16:51

标签: javascript highcharts

如何为highcharts中的缺失数据设置零,这里我得到3天的值,天数之间没有数据。因此,那些日子我需要设置零

seriesData = [{
    "name": "Questions",
    "data": [
      [1503273600000,1],
      [1504656000000,1],
      [1504742400000,1]
    ]
  }]

Jsfiddle

谢谢...

2 个答案:

答案 0 :(得分:1)

你可以这样做

var data = [[1.5032736E12,1.0],[1.504656E12,1.0],[1.5047424E12,1.0]];
        var startDay = data[0][0],
            endDay = data[data.length-1][0]
            isLastDay = startDay == endDay,
            dayTick = 1000 * 60 * 60 * 24,
            temp = [];

        //Create new array with 0 values for each day
        temp.push([startDay, 0])
        while(!isLastDay) {
            startDay += dayTick;
            temp.push([startDay, 0])

            isLastDay = startDay >= endDay;
        }

        //Override all values with existing days
        for (var i = 0; i < data.length; i++)
        for(var j = 0; j < temp.length; j++) {
            if (temp[j][0] == data[i][0]) {
                temp[j][1] = data[i][1];
                break;
            }
        }

    data = temp;

Highcharts.chart('container', {
chart: {
            type: 'line'
        },
   title: {
            text: 'Survey'
        },
        yAxis: {
            title: {
                text: 'Responses'
            }
        },
        xAxis: [{
            type: "datetime",
            title: {
                text: null
            },
            dateTimeLabelFormats: {
                month: "%e.%b<br/>%a"
            }
        }],
           plotOptions: {
            series: {
                marker: {
                    enabled: false
                }
            },
            series: {
                connectNulls: true
            }
        },

    series:[{"name":"Questions","data":data}]

});

通过这种方式,您将创建一个新的临时数组,该数组的第一天和最后一天之间的所有天数均为0,之后您只需将现有值放在临时数组中。

以下是更新后的jsfiddle

答案 1 :(得分:1)

高图没有为此提供的功能。您需要先将缺失的点推入阵列,然后再进行绘制。

您可以像这样使用简单的功能。给定的功能是用 打字稿 编写的,您可以根据自己的需要进行模制。

generateDataSet(data: number[][]): number[][] {
    const temp: number[][] = [];
    data.forEach((d: number[], index) => {
        d[0] *= 1000;
        if (index !=0) {
            if (d[0] - dayTick === data[index - 1][0]) {
                temp.push(d);
            } else {
                let lb = data[index - 1][0];
                const ub = d[0];
                while (lb != ub) {
                    lb += dayTick;
                    temp.push([lb, 0]);
                }
            }
        } else {
            temp.push(d);
        }
    });
    return temp;
}

您肯定可以改善答案,因为总有改进的余地。然后一直保持编码。

这是一个正在运行的演示highcharts-jsfiddle-example