Пузырьковая диаграмма NVD3 исчезает, когда все данные отфильтрованы - PullRequest
Новая
       12

Пузырьковая диаграмма NVD3 исчезает, когда все данные отфильтрованы

0 голосов
/ 29 мая 2018

У меня есть фильтр, который фильтрует данные для пузырьковой диаграммы NVD3.

Когда никакие данные или некоторые данные не фильтруются, диаграмма работает отлично.

Однако, когда я отфильтровываю все данные из диаграммы, диаграмма полностью исчезает.Когда это происходит, даже фильтрация результатов не приводит к повторному появлению диаграммы.Я должен обновить страницу, чтобы она появилась снова.

Есть ли способ убедиться, что на странице всегда есть пустая ось, даже если данных нет?Или, в качестве альтернативы, другое исправление?

РЕДАКТИРОВАТЬ: когда я получаю эту ошибку в консоли, она говорит: «Ошибка типа: уменьшение пустого массива без начального значения» и указывает на этот блок кода: 

    d3.select(idChartBubble_Tab3 + ' svg')
        .datum(dataBubble3)
        .call(chartBubble_Tab3);

    //nv.utils.windowResize(chart_tab3_bubble.update);

    return chartBubble_Tab3;

Я приложил приведенный ниже код (я не уверен, насколько это актуально, но это не мой проект, и я раньше не работал с NVD3): 

 nv.addGraph(function () {
    chartBubble_Tab4 = nv.models.multiChartSP2()
        .showLabelDots(true)
        .idChart(idChartBubble_Tab4)
        .useVoronoi(true)
        .showLegend(false)
        .First_length(dataBubble4.length)
        .margin({top: 30, right: 30, bottom: 50, left: 75})
    ;

    chartBubble_Tab4.scatters1
        .pointRange([1000 * Math.PI / 2, 10000 * Math.PI / 2]);
    chartBubble_Tab4.scatters2
        .pointRange([1000 * Math.PI / 2, 10000 * Math.PI / 2]);

    chartBubble_Tab4.xAxis
        .axisLabel('Click Effectiveness')
        .tickFormat(function (d) {
            return numeral(d).format("0,0.00%");
        });

    chartBubble_Tab4.yAxis1
        .axisLabel('Fractional CPA')
        .tickFormat(function (d) {
            return numeral(d).format("$0,0.00a");
        });

    chartBubble_Tab4.scatters1.dispatch.on('elementClick', mouseclick_scatter_bb4);

    chartBubble_Tab4.tooltip.contentGenerator(function (data) {
        var str = '<table><tbody>';
        if(data.series[0].all.type == "line"){
            str = str + '<tr><td class="key">' + 'Average:' + '</td><td class="value">' +  numeral(data.point.x).format("0,0.00%") + '</td></tr>';
        }else {
            str = str + '<tr><td class="key">' + 'Site:' + '</td><td class="value">' + data.series[0].all.st_ + '</td></tr>';
            str = str + '<tr><td class="key">' + 'Channel:' + '</td><td class="value">' + data.series[0].all.ch_ + '</td></tr>';
            str = str + '<tr><td class="key">' + 'Tactic:' + '</td><td class="value">' + data.point.name + '</td></tr>';
            str = str + '<tr><td class="key">' + 'Fractional Conversions:' + '</td><td class="value">' + numeral(data.point.size).format("0,0.0") + '</td></tr>';
            str = str + '<tr><td class="key">' + 'Fractional CPA:' + '</td><td class="value">' + numeral(data.point.y).format("$0,0.00") + '</td></tr>';
            str = str + '<tr><td class="key">' + 'Click Effectiveness:' + '</td><td class="value">' + numeral(data.point.x).format("0,0.00%") + '</td></tr>';
        }
        str = str + '</tbody></table>';
        return str;
    });

    d3.select(idChartBubble_Tab4 + ' svg')
        .datum(dataBubble4)
        .call(chartBubble_Tab4);

    //nv.utils.windowResize(chart_tab3_bubble.update);

    return chartBubble_Tab4;
});

Также добавилифункция фильтра (это одна из 4 в проекте, но все они довольно похожи 

 $scope.change_state_son = function(idx_father, idx_son){
    $scope.filtering[idx_father].sons[idx_son].selected = !$scope.filtering[idx_father].sons[idx_son].selected;
    //Re-Draw
    generateDataTab4($scope.filtering);
    resizeTab4();
    if ($scope.expandTab5) {
        draw_Bubble_Tab3();
    } else {
        draw_Bubble_Tab4();
    }
};
...