为什么我的 angular-nvd3 multiChat 图表没有在此处呈现？

Question

正在工作的原始 Plunkr： http://plnkr.co/edit/nHSMF2?p=preview

我的分叉 Plunkr： http://plnkr.co/edit/4Ecqif?p=preview

我正在玩 Angular-nvd3 charting lib. Here is their original multiChart example 几个折线图和面积图。我将它分叉并将图表减少到只有 3 个（2 个区域，1 条线），正如您在顶部看到的 link.

在他们最初的例子中，他们使用了一个函数来随机生成数据点，在我定制的 fork 中，我删除了那个函数并对图形对象进行了硬编码。我没有看到任何错误，所以不确定为什么我的图表没有被渲染。

有什么想法吗？

本文中使用了我的硬编码图形对象 broken Plunkr:

vs.area1 = {
  key: 'Area1',
  color: '#7DD0FA',
  type: 'area',
  values: [
    {
      key: "Area1",
      index: 0,
      series: 0,
      x: 0,
      y: 0.1562513777302181
    },
    {
      key: "Area1",
      index: 1,
      series: 0,
      x: 1,
      y: 0.11389363298669228
    },
    {
      key: "Area1",
      index: 2,
      series: 0,
      x: 2,
      y: 0.15284344328948302
    }
  ]
}

vs.area2 = {
  key: 'Area2',
  color: '#FDE18D',
  type: 'area',
  values: [
    {
      key: "Area2",
      index: 0,
      series: 0,
      x: 0,
      y: 0.3968682840613851
    },
    {
      key: "Area2",
      index: 1,
      series: 0,
      x: 1,
      y: 1.090475660012667
    },
    {
      key: "Area2",
      index: 2,
      series: 1,
      x: 2,
      y: 2.5868011025351163
    }
  ]
}

vs.line1 = {
  key: 'Line1',
  color: '#4C73FF',
  type: 'line',
  values: [
    {
      series: 0,
      x: 0,
      y: 0.10572488375599604
    },
    {
      series: 0,
      x: 1,
      y: 0.10572488375599604
    },
    {
      series: 0,
      x: 2,
      y: 0.11166720592377402
    }
  ]
}

var myData = [];
    myData.push(vs.area1);
    myData.push(vs.area2);
    myData.push(vs.line1);

vs.data = generateData();
// vs.data = myData;
console.log('vs.data',vs.data);

我检查了我的数据并将其与动态数据仔细比较。并逐键匹配，但我的图表仍然没有显示:(

左边是我硬编码的版本 |右边是工作动态数据：

Answer 1

我的对象中缺少 yAxis 键，这是缺少的魔法：

http://plnkr.co/edit/9HdNop?p=preview

vs.area1 = {
  key: 'Area1', yAxis: 1, color: '#7DD0FA', type: 'area',
  values: [...

vs.area2 = {
  key: 'Area2', yAxis: 1, color: '#FDE18D', type: 'area',
  values: [...

vs.line1 = {
  key: 'Line1',
  yAxis: 2,
  ...

为什么我的 angular-nvd3 multiChat 图表没有在此处呈现？

Why is my angular-nvd3 multiChat chart not rendering here?

javascript

angularjs

d3.js

nvd3.js

angular-nvd3