javascript - 对于时间序列中的更多数据，highchart 计算平均值

Question

我的网站上有一个 Highcharts 时间序列。

当我尝试生成 1 个月的时间序列时，我得到了正确的值，如下所示(我在 2 月 27 日得到的 ch4 的正确值是 9.90)

当我尝试在同一时间生成 2 个月的时间序列时，它显示了不同的值(我在 2 月 27 日 00:00 到 2 月 27 日 02:59 之间得到了 ch4 的平均值)。

我需要的是显示 2 个月图表中 ch4 的最大值，而不是平均值。

(我需要将 9.90 显示为 2 月 27 日 00 点至 2 月 27 日 02 月 59 日期间 ch4 的值)

我怎样才能做到这一点？

以下是我正在使用的时间序列的属性:

options = {
	legend: { enabled: true },
	chart: { renderTo: 'container'/*, type: 'spline'*/ },
	tooltip: {
		shared: true,
		pointFormat: "<span style=\"color:{point.color}\">\u25CF</span> {series.name}: <b>{point.y:.2f}</b><br/>"
		//  xDateFormat: '%d-%b-%Y %H:%M',
	},

	xAxis: { type: 'datetime', dateTimeLabelFormats: { day: '%e.%b.%y', hour: '%H:%M', year: '%Y', month: '%b-%Y', } },
	yAxis:
			[{ // PressureAttributes yAxis --0
				title: { text: 'Pressure Attributes (m Bar)', style: {/*color: Highcharts.getOptions().colors[0]*/ } },
				labels: {
					formatter: function () { return this.value ; },
				rotation:-90},
				opposite: false,
				gridLineWidth: 0,
				offset: 120
			}, { //CH4,O2,CO2    yAxis --1
				title: { text: 'Gas Attribute (%v/v)', style: { /*color: Highcharts.getOptions().colors[0]*/ } },
				labels: {
					formatter: function () { return this.value  ; },
					rotation: -90
				},
				opposite: false,
				gridLineWidth: 0,
				offset: 40
			}, { // Temperature yAxis --3
				title: { text: 'Temperature ( °C )', style: {/*color: Highcharts.getOptions().colors[0]*/ } },
				labels: {
					formatter: function () { return this.value  ; },
					rotation: -270
				},
				opposite: true,
				gridLineWidth: 0,
				offset: 40
			}, { // PPM yAxis --4
				title: { text: 'Gas Attribute (PPM)', style: {/*color: Highcharts.getOptions().colors[0]*/ } },
				labels: {
					formatter: function () { return this.value ; },
					rotation: -270
				},
				opposite: true,
				gridLineWidth: 0,
				offset: 120
			}]
,
	navigator: { enabled: true, adaptToUpdatedData: false },
	title: { text: 'Reading Time Series' },
	scrollbar: { liveRedraw: false },
	rangeSelector:{inputEnabled: false},
	series: [
				   { name: 'VOC', data: [], yAxis: 3 },
				   { name: 'H2S', data: [], yAxis: 3 },
				   { name: 'CO', data: [], yAxis: 3 },
				   { name: 'O2', data: [], yAxis: 1 },
				   { name: 'CH4', data: [], yAxis: 1 },
				   { name: 'CO2', data: [], yAxis: 1 },
				   { name: 'BH Pressure', data: [], yAxis: 0 },
				   { name: 'ATM Pressure', data: [], yAxis: 0 },
				   { name: 'Temperature', data: [], yAxis: 2 },
				   { name: 'Battery', data: [], yAxis: 3 }
	]
};

 

我需要设置任何特殊属性来实现我的目标吗？

Answer 1

这是由dataGrouping引起的。在 Highcharts API 中我们可以看到:

plotOptions.line.dataGrouping

Data grouping is the concept of sampling the data values into larger blocks in order to ease readability and increase performance of the JavaScript charts. Highstock by default applies data grouping when the points become closer than a certain pixel value, determined by the groupPixelWidth option.

您可以通过以下方式禁用dataGrouping:

plotOptions: {
    series: {
        dataGrouping: {
            enabled: false
        }
    }
},

API引用:https://api.highcharts.com/highstock/plotOptions.line.dataGrouping