Я строю приборную панель, чтобы показать некоторые данные. У меня есть несколько графиков и таблица со всеми данными. Я пытаюсь добавить функцию поиска для фильтрации графика. У меня есть куча компаний и некоторые данные о каждой. Поэтому, если я буду искать «Appl», в таблице данных будут перечислены только те компании, которые начинаются с «Appl», и диаграммы будут отражать это.

Единственная проблема, с которой я сталкиваюсь в текущей реализации, - это когда я меняю этот фильтр или очищаю его. Данные выглядят нормально, но графики отображаются неверно. Они не возвращаются к своим исходным позициям после очистки или как-то добавляют дополнительные данные. Любые советы будут оценены.

 $("#table-search").on('input',function(){
   text_filter(companyDimension,this.value);//companyDimension is the dimension for the data table

function text_filter(dim,q){
 dashTable.filterAll();
 var re = new RegExp(q,"i")
 if (q!='')
 {
    dim.filter(function(d){
        if (d.search(re)==0)
            return d;
    });
}
dc.redrawAll();
graphCustomizations();  }});

код dc.js

var ndx = crossfilter(resource_data);
//Dimensions 
companyDimension = ndx.dimension(function(d){
    return d["Company Name"]
});
dashTable.width(800).height(800)
    .dimension(companyDimension)
    .group(function(d){
        return "List of all Selected Companies";
    })
    .size(1774)
    .columns([
            function(d){return d["Company Name"]; },
            function(d){return d["Revenue Source"];},
            function(d){return d["Commodity"];},
            function(d){return "$"+parseFloat(d["Revenue"]).formatMoney(0,'.',',');}
        ])
    .sortBy(function(d){return d["Company Name"]})
    .order(d3.ascending);

Вот и все, диаграммы просто фильтруются с разными размерами на одном и том же объекте перекрестного фильтра.

Я попытался сделать несколько вещей с функцией text_filter, такие как,dim.filterAll(), dim.filter(null), dc.renderAll(), Когда я проверяю данные в измерении, они корректны до и после каждого фильтра, другие диаграммы просто не обрабатывают их правильно.

Я попытался добавить базовый фильтр в dc dataTable напрямую, но не могу заставить его работать с пользовательской функцией фильтра. Так что я могу сделать что-то вродеdashTable.filter(q) и это сработает, но я должен дать ему полное название компании, чтобы оно отображало что-либо, но диаграммы корректно отображаются, когда я его применяю и удаляю. Я пытался использоватьdashTable.filterHandler() но он всегда возвращает ошибку, но если вы знаете, как заставить это работать, мне было бы любопытно, потому что я не мог заставить его работать даже с примером в документации dc.js.

Любая помощь будет принята с благодарностью.

РЕДАКТИРОВАТЬ:

Вот скрипка в основном законченного кода, я смешал некоторый код, чтобы он заработал.http://jsfiddle.net/rbristow/HW52d/1/

Чтобы воспроизвести ошибку, введите букву в поле поиска, затем очистите ее и введите другую букву. Вы увидите, что общее количество сбрасывается неправильно.