Question

我有一个AngularJS网络应用程序，它在ng-repeat中渲染多个D3线图。即使备份数据没有变化，图表也会重复重绘。我想要抑制所有重绘事件（或尽可能多的重写事件）。

重绘不仅是随机无限的。当页面上不相关的内容发生更改时，将触发重绘。支持图表的数据都没有改变，这让我很困惑。几乎看起来，只要DOM发生变化，图形就会重绘。

**编辑（添加代码片段）**

'use strict';

angular.module('alarmAggregator.controllers').controller('HomeCtrl', [
    '$scope',
    '$routeParams',
    '$log',
    'Source',
    'SaveParameters',
    'GetParameters',
    'IncidentSearch',
    'Waveforms',
    'ConfigItems',
    'usSpinnerService',
    'ImageHelper',
    '$http',
    '$timeout',
    function ($scope, $routeParams, $log, source, saveParameters, getParameters, incidentsSearch, waveforms, configItems, usSpinnerService, imageHelper, $http, $timeout) {

searchService.search($scope.parameters).then(function (result) {
   $scope.incidentsList = result.data;
}).finally(function () {
   $timeout(function () {
      $scope.triggerResizeEvent();
      usSpinnerService.stop('search_spinner');
   }, 1);
});

<div ng-repeat="inci in incidentsList track by inci.incidentId">
   <div ng-repeat="dist in inci.disturbances track by dist.uniqueId">
      <div data-ac-chart="'waveform'" data-ac-data="dist.waveforms"></div>
   </div>
</div>

Answer 1

我发现angular-chart.js有一个观察者设置来监视数据更改。我注释掉了这一行，页面现在闪电般快速。我不确定为什么数据认为它被改变了，但我的图表是静态的，所以没关系。

这是我注释掉的那一行：

scope.$watch('[acChart, acData, acConfig]', init, true);

阻止D3.js重绘

1 个答案: