更改图表上的某些内容时,例如myChart.addSeries(mySeriesObj)
或
myChart.get("myPointId').update(50);
默认行为是调用重绘函数。
现在,假设我在该图表上有3个系列(seriesA,seriesB,seriesC),我刚刚更新了seriesA中的 1分。它会非常快速地重绘所有图表(seriesA,seriesB,seriesC,axises,label等)吗?或者只是新点?
Highchart是否适用于图层,或者所有图标都在同一个“框架”中?
我问这个是因为我打算使用超过1000分的系列,我知道在Highchart上使用大数据时可能存在一些性能问题。(我已经看到,当启用 marker.states.hover 选项或工具提示选项)
答案 0 :(得分:2)
根据我的理解,Highcharts很可能只会重绘脏组件(在您的情况下,该点所属的系列)。
chart.redraw()
来源的一些零碎看起来像
// redraw affected series
each(series, function (serie) {
if (serie.isDirty && serie.visible &&
(!serie.isCartesian || serie.xAxis)) { // issue #153
serie.redraw();
}
});
当您拨打point.update()
时,只有该点所属的系列标记为脏。因此,在下一个chart.redraw()
调用时重新绘制,而其他未更新点的系列将不会重新绘制。
话虽如此,除了上述内容之外,chart.redraw()
还有其他一些代码。主要用于重绘轴和图例等东西。看起来大多数都是基于类似的isDirty
逻辑重新绘制的,因此不应该是性能威慑。但是,如果性能确实是一个关键因素,您可以使用第二个参数point.update()
调用false
,这将跳过隐式chart.redraw()
调用,因此内部的所有内容。然后,您可以明确地调用要更新的特定系列上的series.redraw()
方法(该点属于该系列)。
注意:这不会重绘轴(和其他东西),如果点的更新值超出当前轴的极值,则可能需要重新绘制这些轴。此外,文档中未列出series.redraw()
,可能表示不鼓励使用它,并可能产生意外结果。
我会在99%的情况下采用chart.redraw()
方式,因为大多数时候表现都是高度可接受的。
<强>参考文献:强>
point.update()
api reference
Demo @ JsFiddle
答案 1 :(得分:1)
来自源代码:
/**
* Redraw legend, axes or series based on updated data
*
* @param {Boolean|Object} animation Whether to apply animation, and optionally animation
* configuration
*/
redraw: function (animation) {
答案 2 :(得分:0)
我在使用Highchart性能加载方面遇到了一些问题&gt; 1000点健身数据系列(如心率,速度等)。我发现在情节Highcharts example中禁用标记会带来非常显着的性能提升。我也禁用了动画。
我在我的解决方案上运行了chrome profiler,发现在准备渲染时调用了highcharts.src.js中的每个函数。
this.each =
//Array.prototype.forEach ?
// function (arr, fn) { // modern browsers
// return Array.prototype.forEach.call(arr, fn);
// } :
function (arr, fn) { // legacy
var i = 0,
len = arr.length;
for (; i < len; i++) {
if (fn.call(arr[i], arr[i], i, arr) === false) {
return i;
}
}
};
我听说forEach比for循环慢,所以我已经注释掉了forEach的默认选择。在jsperf for vs foreach上进行测试,在我的机器环境中显示foreach比最快的反向循环慢85%
答案 3 :(得分:0)
您还可以使用point update()函数http://api.highcharts.com/highstock#Point.update()