在名为

Question

在xAxis上将图形的极值设置为dataMin和dataMax之后，仍显示带有showFull false的xAxis滚动条。

我们如何进入这种状态的背景： 我们有一个图表，该图表每30秒获取一次更新的数据，而不是重绘，而是使用chart.update w / series属性并重绘为false。 这将更新轴的dataMin dataMax属性，但不会更新min / max属性（控制视图中的窗口）

使用逻辑来确定是否要中断用户的工作流程，从而确定是否需要调用setExtremes w / redraw true -注意：这主要是必需的，因为否则图形min可能位于轴的dataMin之下（导致空格） 使用floor和setExtremes我可以通过将窗口推到更新的时间范围并使用floor防止它们向后滚动来部分解决该问题（这是低于标准的，因为空白显然仍然存在并且可以“看到”在滚动条样式中）

甚至连setExtremes dataMin dataMax滚动条仍然显示

预期：以更新的最新实时数据更新图表，视图中的时间范围窗口已更新为IFF，否则最小值将小于新的dataMin，滚动条现在应将“ universe”视为newDataMin-newDataMax（！oldDataMin -似乎是newDataMax）

实际：使用最近的数据更新图形，时间窗口不会自动更新，不再由查询覆盖的时间现在由丑陋的空白表示

编辑：

void handleLiveUpdate(List agentSeries, int rangeStartTime) {
  // Needed to decide down the line if we should redraw graph
  var xAxisExtremesPreUpdate = chart["xAxis"][0].callMethod("getExtremes");

  // Updates the chart's data w/o forcing the graph to redraw itself
  // Updates the XAxis dataMin && dataMax attributes BUT NOT the min max attributes
  // (where the min/max attributes determine the window of time in view for the chart)
  chart.callMethod("update", [new js.JsObject.jsify({
    'series': agentSeries
  })]);

  // Decide if redrawing the graph would be disruptive or if it is required
  var xAxisExtremesPostUpdate = chart["xAxis"][0].callMethod("getExtremes");
  if (xAxisExtremesPreUpdate['max'] == xAxisExtremesPreUpdate['dataMax']
      && xAxisExtremesPreUpdate['min'] == xAxisExtremesPreUpdate['dataMin']) { /* Full View Case */
    // Keep entire TimeRange in view as window moves
    chart["xAxis"][0].callMethod("setExtremes", [xAxisExtremesPostUpdate['dataMin'], xAxisExtremesPostUpdate['dataMax'], true, true]);
//TODO scrollbar still visible.. why ? 
  } else { /* Partial View Case */
    // Gather data on current extremes after updating the series.data
    var min = xAxisExtremesPostUpdate['min'];
    var max = xAxisExtremesPostUpdate['max'];
    var range = max - min;
    // Determine which partial view case we are in
    // 'Left Aligned' the min value before change was the dataMin before change
    // 'Right Aligned' the max value before change was the dataMax before change
    // 'Not Aligned' the min/max values do not correlate to the dataMin/dataMax values - indicates user had scrolled to some custom portion of time range
    if (xAxisExtremesPostUpdate['min'] < xAxisExtremesPostUpdate['dataMin']) { /* Partial View - Left Aligned (Ex looking at first hour of last 8 hours) */
      min = xAxisExtremesPostUpdate['dataMin'];
      max = min + range;
      chart["xAxis"][0].callMethod("setExtremes", [min, max, true, true]);
    } else if (xAxisExtremesPostUpdate['max'] == xAxisExtremesPreUpdate['dataMax']) { /* Partial View - Right Aligned (Ex looking at most recent week of last month) */
      max = xAxisExtremesPostUpdate['dataMax'];
      chart["xAxis"][0].callMethod("setExtremes", [max - range, max, true, true]);
    } else { /* Partial View - Not Aligned (Extremes do not touch dataMin dataMax => no need to redraw as window moves s*/
      // NO-OP: no need to redraw since moving window has no impact on window in view
    }
  }

  // Always update the floor attribute, prevents long lived charts from scrolling back to a time they no longer have data in hand for
  chart["xAxis"][0].callMethod("update", [new js.JsObject.jsify({
    'floor': rangeStartTime
  }), true]);
}

编辑2：用于说明的屏幕截图

W /当前解决方案

已将解决方案注释掉

JSFiddle注意：更新似乎像我期望的那样更新了xAxis。

Answer 1

应该使用setExtremes和min属性更新轴，而不是使用max方法：

chart.xAxis[0].update({
    min: chart.xAxis[0].dataMin,
    max: chart.xAxis[0].dataMax
});

实时演示： https://jsfiddle.net/BlackLabel/y150hupz/

API参考： https://api.highcharts.com/class-reference/Highcharts.Axis#update