所以我的目标是绘制一些存储在骨干集合中的实时指标。我有一个存储指标的主干集合，当我轮询后端服务器时，它每秒都会更新。我的集合有一系列历史指标和一个“最新数据”字段，这是来自后端的最新数据。每一秒，“最近的数据”都会更新为不同的值。我将骨干集合的引用传递给创建立体主义度量的函数。
当包含 Cubism.js 视图的视图被渲染时，它应该将存储在集合中的所有数据点历史加载到地平线图。这是我取得成功的部分。但是，当度量函数执行回调时，它不会从每秒更新的“最新数据”字段中绘制新的/正确的点。
这是我与 DOM 交互的代码（我不相信这部分会导致问题）：
var context = cubism.context()
.serverDelay(0)
.clientDelay(0)
.step(250)
.size(1116);
//Getting the metrics from the backbone collection
var models = this.dataSet.models;
console.log('models in metric view',models);
//aggregate 'metrics'. Each component has a 'metric' which contains its stats over time
for(model in models){
var attributes = models[model].attributes;
if(!attributes['name'] || attributes['type']== "FLOW" || attributes['type'] == "SERVER"){
continue;
}
if(attributes['name'] == null){
continue;
}
var name = attributes['name'];
var type = attributes['type'];
var serverName = attributes['serverName'];
var metName = name.concat(serverName);
console.log(metName);
//Getting the cubism metric for each stat in the backbone collection
//Passing in a reference to the current model in the backbone collection (this.dataSet.models[model])
var curContext = getMetric(metName, this.dataSet.models[model]);
statsList.push(curContext);
}
d3.select(this.loc).selectAll(".axis")
.data(["top", "bottom"])
.enter().append("div")
.attr("class", function(d) { return d + " axis"; })
.each(function(d) { d3.select(this).call(context.axis().ticks(12).orient(d)); });
//create rule
d3.select(this.loc).append("div")
.style("position", "fixed")
.style("top", 0)
.style("bottom", 0)
.style("width", "1px")
.style("pointer-events", "none")
.call(context.rule());
d3.select(this.loc).selectAll(".horizon")
.data(statsList)
.enter().insert("div", ".bottom")
.attr("class", "horizon")
.call(context.horizon().height(35));
它本质上是遍历主干集合中的所有统计信息，然后调用“getMetric”传递对主干集合中当前统计信息的引用。'getMetric' 返回立体主义度量。
这是处理每个指标的代码（可能导致问题）：
/* Keep a map of intialized metrics
When the visualization is initialized, we load the historical data which is in the
'attributes' field of the model. The model is an individual set metrics */
var initializedMetrics = {};
function getMetric(name, model){
var format = d3.time.format("%I-%M-%S");
return context.metric(function(start, stop, step, callback){
var statValues = [];
if(initializedMetrics[name]){
/* If the metric has already been initialized and we loaded the historical data
from 'attributes' field, plot the newest data which is stored in 'most-recent-data'
This field should be updated every second on every API call to the server */
while(start<stop){
start+=step;
console.log(model.attributes['most-recent-data']['rate']);
statValues.push(model.attributes['most-recent-data']['rate']);
}
} else{
/* Metric has not been initalized, so we load all the historical data in 'all-data'
for this stat and plot it over time*/
initializedMetrics[name]=true;
var lookup = {},
i = start.getTime();
//console.log('startTime', i);
var curStat = null;
var metricData = model.attributes['all-data']
for(stat in metricData){
curStat = metricData[stat];
//console.log(name, curStat);
var curDate = new Date(curStat['timeStamp']);
curDate = format(curDate);
lookup[curDate] = curStat;
}
var lastValue;
while((i+=step) < stop){
start+=step;
var key = format(new Date(i));
if(key in lookup){
lastValue = lookup[key]['valueLong'];
}
var curVal = key in lookup ? lookup[key]['valueLong'] : lastValue;
//console.log(name,curVal);
statValues.push(curVal);
}
}
/* Callback with statValues*/
callback(null,statValues);
}, name);
}
我已成功加载所有历史数据（else 括号内的所有数据）。但是，当一个指标被初始化时，我会尝试加载存储“最新数据”的新数据。该字段每秒都会通过 API 调用更新，但每次回调时，它只会绘制存储在“最新数据”中的初始数据。我可以确认最近的数据确实在骨干集合本身中更新，但是传递给立体主义的引用并没有在每次回调时更新。当我在立体主义代码中记录“最新数据”时，它永远不会更新为最新值。
这是关闭问题吗？我是否缺少一些用于轮询新数据的立体主义语法？或者我是否需要以不同的方式传递主干集合引用？任何提示都会非常有帮助。谢谢你。