Dygraph：永久突出显示特定数据点

Question

我想在系列数据图中突出显示特定数据点（如绿色圆圈）。它应该是一个 static/permanent 高亮点，独立于鼠标悬停。例如，需要突出显示图形中所有数据点的峰值点。我期待一种使用 x、y 坐标来通知 dygraph 突出显示特定数据点的方法。

Answer 1

您可以为此使用 underlayCallback 选项，它允许您在图表的基础 canvas 上绘图。

下面的例子是从我有的一个更复杂的例子中快速提取出来的——希望它足够接近工作给你的想法：

突出重点x = 5, y = 17

graph_options.underlayCallback = function(canvas, area, g) {

  // Convert data co-ordinates to canvas co-ordinates
  var xPoint = g.toDomXCoord(5);
  var yPoint = g.toDomYCoord(17);

  // Draw a red circle
  canvas.fillStyle = 'rgba(255, 0, 0, 1)';
  canvas.beginPath();
  canvas.arc(xPoint, yPoint, 20, 0, 2 * Math.PI, false);
  canvas.fill();
}

上面的代码会在所需的数据点处绘制一个红色的大圆圈（半径为 20），而 "real" 数据点会绘制在其上方，其行为与其他任何点一样。这种技术的工作速度足够快，可以有许多突出显示的点，但不会特别慢。

Dygraph：永久突出显示特定数据点

Dygraph: Highlight specific data point permanently

dygraphs