Angular UI-网格和D3图形连续

Question

我想知道你们中是否有人有将图表注入 ui 网格的经验。我在做什么，我有一行定义如下：

  { name:'Column Name', cellTemplate: '<spark-line-chart values="grid.appScope.valuesStacked"></spark-line-chart>'}

spark-line-chart 指令负责创建 D3 图表（实际上，准确地说是 nvd3）。这将创建 svg 图形。

现在，每次我尝试对 table 进行排序时，table 中的所有值都会被排序，除了图表。到目前为止，我正在模拟数据，并为所有图表使用一组值。

有人遇到过类似的问题，并且知道这个问题的答案吗？

Answer 1

首先您使用的是 nvd3.js 的哪种 Angular 模块？

如果你使用angular-nvd3你可以检查这个例子：

请注意，在您的单元格模板中，您必须将 nvd3 图形包裹在 <DIV> 和 .ui-grid-cell-contents CSS class:

中

<div class="ui-grid-cell-contents">
  <nvd3 options="row.entity.spark.options" data="row.entity.spark.data"></nvd3>
</div>

Angular UI-Grid and D3 graph in a row