javascript - D3 动画(过渡)不适用于 Angular 应用程序

Question

我破解了一个指令，其中包含一个简单的饼图。这是 jsfiddle 中的确切示例这样可行。但是，当我尝试将其移动到我的网络应用程序时，我得到的图表是在上一个 session (覆盖)之上构建的，但没有动画。我没有收到控制台错误。当我记录数据时，数据正确传递。

这是我目前使用的软件: AngularJS v1.2.1， D3版本:“3.4.13”， 它由 Express 和 NodeJS 托管。

有关可能导致此错误的原因的任何建议。我不想每次获得新数据时都必须重置 SVG，我想要一个平滑的过渡。

var App = angular.module('App', ['ngRoute', 'ngCookies']);
App.directive('barsChart', function($parse) {
d3.edge = {};

d3.edge.donut = function module() {

    var width = 460,
        height = 300,
        radius = Math.min(width, height) / 2;

    var color = d3.scale.category20();
   .............//rest is the same as the js fiddle example

Answer 1

在 ang angularjs/D3js Web 应用程序上工作时，我发现我导入了一些导致 D3 转换崩溃的库。以下是导致 d3 动画崩溃的其他库的列表: -Bootstrap v2.0.4 -Bootstrap响应式v2.0.4 -Date.js(网站: http://www.datejs.com/ 或 http://www.coolite.com/datejs/ )。 一旦这些库被禁用。我能够看到并使用过渡。