NetChart replaceData()显示为空。如何动态替换数据？

Question

我遵循了zoomcharts文档中的示例，了解了如何替换NetChart上的数据。当我在图表实例上调用replaceData()时，没有发生任何事情，没有显示任何内容，也没有显示任何错误。

但当我将数据设置为预加载时(如下所示)，网络就会出现。

chart = new zc.NetChart({
  data: [
     {
       preloaded: {
         nodes: [Array of nodes],
         links: [Array of links],
       },
     },
  ],
...
})

Answer 1

当我访问“替换数据”示例的文档时，我看到了它的JSFiddle。该示例使用"replaceData()“函数动态地更改数据，它似乎对我很有效。查看此处：https://jsfiddle.net/egd1kj9x/

也许您可以复制该示例，并从中找出示例与您要做的事情之间的不同之处？

下面是完整的示例：

var randomSeed = 10; // this can be changed to generate different data sets
function getRandomNumber() {
  var x = Math.sin(randomSeed++) * 10000;
  return x - Math.floor(x);
}

var nextNodeId = 0;
chart = null;

function buildData() {
  var nodes = [];
  var links = [];
  var i;
  var numNodes = 10;
  for (i = 0; i < numNodes; i++) {
    nodes.push({ "id": i, "loaded": true });
  }

  //make some random links
  for (i = 0; i < 10; i++) {
    var from = Math.floor(getRandomNumber() * numNodes);
    var to = Math.floor(getRandomNumber() * numNodes);
    links.push({ "id": i + "_" + from + "_" + to, "from": from, "to": to });
  }

  chart.replaceData({ "nodes": nodes, "links": links });
}

chart = new NetChart({
  style: { 
    node: { 
      display: "text",
      fillColor: "rgba(47,195,47,0.9)",
    },
    link: {
      fillColor: "rgba(86,185,247,0.4)"
    }

  },
  container: document.getElementById("demo"),
  area: { height: 350 }
});
buildData();
var intervalHandle = setInterval(buildData, 2400);
function disposeDemo() {
  window.clearInterval(intervalHandle);
  disposeDemo = null;
  intervalHandle = null;
}