Angular-nvD3 изменяет размер графика при изменении данных

0

Я использую Angular-nvD3. У меня простая диаграмма, которая выглядит так:

HTML:

<nvd3 options="options" data="data"></nvd3>

JS:

$scope.options = {
        chart: {
            type: 'pieChart',
            height: 450,
            x: function (d) { return d.key; },
            y: function (d) { return d.y; },
            showLabels: true,
            duration: 1100,
            showLegend: false
        }
    };

Мой объект данных - это просто массив объектов с ключевыми и y свойствами. В некоторых случаях DOM я обновляю данные с сервера и изменяю объект данных. Когда я это сделаю, моя диаграмма будет изменена.

Почему это происходит и как я могу это предотвратить?

Изображение 174551

Обновить:

// This is the function that is called on the DOM event.
var loadAllData = function () {
    var result = getData();

    result.$promise.then(function (returnedAmounts) {
        loadChartsData(returnedAmounts.expenses, $scope.data);
    }, function (error) {
        // Error.
    });
}

var loadChartsData = function (group, chartsData) {
    // Iterate over the group
    for (var i = 0; i < group.length; i++) {
        chartsData[i] = {
            key: group[i].name || group[i].key,
            y: group[i].amount
        };
    }
}
  • 0
    Странно, вы можете проверить этот пример
  • 0
    Это на самом деле не повторяет мою ситуацию. Я обновлю свой вопрос, чтобы вы могли его понять.
Показать ещё 1 комментарий
Теги:
d3.js
nvd3.js
angular-nvd3

1 ответ

0

попробуйте установить config.deepWatchData = false, таким образом диаграмма будет обновляться только после того, как вы сообщите об этом. (с помощью api.refresh)

Изображение 174551

Ещё вопросы

Сообщество Overcoder
Наверх
Меню