Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/25.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript nvd3图表类型错误:tickExit.call不是函数_Javascript_Angularjs_Nvd3.js - Fatal编程技术网

Javascript nvd3图表类型错误:tickExit.call不是函数

Javascript nvd3图表类型错误:tickExit.call不是函数,javascript,angularjs,nvd3.js,Javascript,Angularjs,Nvd3.js,我正在使用nvd3.js显示角度项目中的图表。 我创建了以下指令: .directive('lineChart', function($window) { return { restrict: 'E', scope: { // Bind the data to the directive scope. data: '=', // Allow the user to change the dimensions of the chart.

我正在使用nvd3.js显示角度项目中的图表。 我创建了以下指令:

.directive('lineChart', function($window) {
  return {
    restrict: 'E',
    scope: {
      // Bind the data to the directive scope.
      data: '=',
      // Allow the user to change the dimensions of the chart.
      height: '@',
      width: '@'
    },
    // The svg element is needed by D3.
    template: '<svg ng-attr-height="{{ height }}" ng-attr-width="{{ width }}"></svg>',
    link: function(scope, element) {
      var d3 = $window.d3;
      var nv = $window.nv;

      var svg = element.find('svg'),
      chart;

      // This function is called when the data is changed.
      var update = function() {
        d3.select(svg[0])
          .datum(scope.data)
          .call(chart);
      };

      // Render the chart every time the data changes.
      // The data is serialized in order to easily check for changes.
      scope.$watch(function() { return angular.toJson(scope.data); }, function() {
        // The chart may not have been initialized at this point so we need
        // to account for that.
        if (chart) {
          update();
        }
      });

      // The chart can not be rendered at once, since the chart
      // creation is asynchronous.
      scope.$on('chartinit', update);


      nv.addGraph(function() {
        chart = nv.models.linePlusBarChart()
          .margin({top: 30, right: 60, bottom: 50, left: 70})
          //We can set x data accessor to use index. Reason? So the bars all appear evenly spaced.
          .x(function(d,i) { return i; })
          .y(function(d,i) {return d[1]; })
          ;

        chart.xAxis.tickFormat(function(d) {
          var dx = scope.data[0].values[d] && scope.data[0].values[d][0] || 0;
          return d3.time.format('%x')(new Date(dx));
        });

        chart.y1Axis
          .tickFormat(d3.format(',f'));

        chart.y2Axis
          .tickFormat(function(d) { return '$' + d3.format(',f')(d); });

        chart.bars.forceY([0]);

        scope.$emit('chartinit');

        return chart;
      });
    }
  };
});
指令('lineChart',函数($window){ 返回{ 限制:'E', 范围:{ //将数据绑定到指令范围。 数据:'=', //允许用户更改图表的尺寸。 高度:“@”, 宽度:'@' }, //D3需要svg元素。 模板:“”, 链接:功能(范围、元素){ 变量d3=$window.d3; var nv=$window.nv; var svg=element.find('svg'), 图表; //此函数在数据更改时调用。 var update=函数(){ d3.选择(svg[0]) .基准(范围.数据) .电话(图表); }; //每次数据更改时都呈现图表。 //数据被序列化,以便轻松检查更改。 scope.$watch(function(){return angular.toJson(scope.data);},function(){ //此时图表可能尚未初始化,因此我们需要 //要解释这一点。 如果(图表){ 更新(); } }); //无法立即呈现该图表,因为该图表 //创建是异步的。 范围:$on('chartinit',更新); nv.addGraph(函数(){ chart=nv.models.linePlusBarChart() .margin({顶部:30,右侧:60,底部:50,左侧:70}) //我们可以将x数据访问器设置为使用索引。原因?因此,所有条都显示为等距排列。 .x(函数(d,i){返回i;}) .y(函数(d,i){返回d[1];}) ; chart.xAxis.tickFormat(函数(d){ var dx=scope.data[0]。值[d]和&scope.data[0]。值[d][0]|0; 返回d3.time.format(“%x”)(新日期(dx)); }); 图表1轴 .tickFormat(d3.format(',f')); 图表2轴 .tickFormat(函数(d){return'$'+d3.format(',f')(d);}); 图.条.力([0]); 范围$emit('chartinit'); 收益表; }); } }; }); 这会引发以下错误:

TypeError:tickExit.call不是函数
在SVGGElement。(d3.js:8673)
在d3.js:8561
在d3处选择每个(d3.js:890)
at Array.d3_transitionPrototype.each(d3.js:8559)
在Array.axis(d3.js:8643)
at Array.d3_selectionPrototype.call(d3.js:897)
在SVGGElement。(nv.d3.js:1086)
d3.js:884
在d3处选择每个(d3.js:890)
at Array.d3_selectionPrototype.each(d3.js:883)

我之前发现隐藏轴解决了问题,但我需要显示它们。

我自己回答,因为我找到了适用于d3.js的修复程序 在函数d3.svg.axis中,我更改了

tickExit = d3.transition(tick.exit()).style("opacity", ε).remove()


不确定为什么这个错误没有在更多的地方出现。

我自己回答,因为我找到了适用于d3.js的修复程序 在函数d3.svg.axis中,我更改了

tickExit = d3.transition(tick.exit()).style("opacity", ε).remove()


不确定为什么这个错误没有在更多的地方出现。

您使用的是哪一版本的d3和nvd3?我使用的版本是d3 3.4.13和nvd3 1.1.15-Beta在阅读您的评论后,我检查并发现我没有使用最新版本。我现在已经安装了d3 3.5.14和nvd3 1.8.2,但问题仍然存在……您使用的是d3和nvd3的哪个版本?我使用的版本是d3 3.4.13和nvd3 1.1.15-beta在阅读您的评论后,我检查并发现我没有使用最新版本。我现在已经安装了D33.5.14和NVD31.8.2,但问题仍然存在。。。