Question

更新 2018年9月25日

为了为这个问题创建一个更简单的演示（在此处发布：http://jsfiddle.net/bLgj4vc7/3/），我终于发现了问题的根本原因。我也设法解决了该问题，并将其发布为答案。

我在Web应用程序中使用独立的bokehjs。我的问题是渲染器没有使用更新的数据源来更新其线字形（或者至少这就是我所想的问题）。

此jsfiddle：http://jsfiddle.net/uwnqcotg/8/演示了该问题。请忽略其中任何不良的编码约定；它是一个快速的一次性演示。

在小提琴中，情节加载了呈现精美且花哨的数据系列。该图可以通过两种方式更新：

Update Plot Once By Overwriting CDS.data Object一次覆盖ColumnDataSource.data对象，因此秉承了保持相同列长的bokeh原则。
Start Stream With CDS.stream使用ColumnDataSource.stream（）并使用随机生成的增量数据序列定期更新图。

在第一种方法中，字形似乎正在更新-确定的轴是根据控制台中打印的数据系列供参考更新的。但是，绘制的字形和数据序列显示不匹配。对我来说，它看起来像是在初始化绘图时将其重新调整为新轴时绘制的字形，尽管我不确定。

在第二种方法中，再次更新了轴，但字形没有更新。同样，最初绘制的字形似乎已重新调整为新的轴范围。而且，rollover attr似乎被忽略了，因为渲染器只是不断地累积数据。

总体而言，我的观察是初始化期间提供给渲染器的任何数据均已正确绘制，但随后进行的任何流更新甚至覆盖均未正确绘制。虽然我可能在这里错了。

另一方面，在我和背景虚化之间，我倾向于认为自己做错了什么或缺少了什么。那是什么？

Answer 1

问题中的最新内容是，为了在此处http://jsfiddle.net/bLgj4vc7/3/发布一个更简单的演示，我遇到了此问题的根本原因：

好像bokehjs有一个错误，即渲染器一旦用一定长度的数据集初始化后，即使对于随后的数据集更新，也坚持该长度。换句话说，

如果使用空数据集{x:[], y:[]}初始化渲染器，则即使稍后使用填充的数据集更新renderer.data_source，渲染器也将保持为零长度，并且在绘图上未绘制任何内容。
对于长度为5的初始数据集，任何后续更新仅会读取前5个点，并且字形也会相应更新。其余要点未得到确认。

我不知道问题是渲染器读取的内容是否超出初始长度，或者是否读取但无法在绘图上重新绘制字形。 ColumnDataSource确定已正确更新。

此答案中链接的小提琴最能说明问题所在。

那么解决方案是什么？目前，此解决方法是：使用填充NaN的数据集初始化渲染器，该数据集的长度等于或大于您要为单个数据系列绘制的最大数据点数。

因此，如果在一行字形中，我希望绘制最多100个数据点，则：

const plot = Bokeh.Plotting.figure()

const maxDataPoints = 100 // maximum number of points I want for this glyph
const emptyData = Array().fill().map(_ => NaN)
const cds = new Bokeh.ColumnDataSource({x: emptyData, y: emptyData})  
const renderer = plot.line({field: 'x'}, {field: 'y'}, {source: cds, line_width: 2})

// now any subsequent updates to datasource of renderer will update its glyph on the plot.
renderer.data_source.data = {
  x: dataLengthLessOrEqualToMaxDataPoints.x,
  y: dataLengthLessOrEqualToMaxDataPoints.y
}

当然，我认为bokehjs的这种行为是一个错误，或者我缺少初始化中未记录的步骤。无论哪种方式，值得在github上创建一个问题：https://github.com/bokeh/bokeh/issues/8277

渲染器不更新bokeh.js中情节上的字形

1 个答案: