Estou construindo um painel para mostrar alguns dados. Eu tenho vários gráficos e uma tabela listando todos os dados. Estou tentando adicionar a funcionalidade de pesquisa para filtrar o gráfico. Eu tenho um monte de empresas e alguns dados sobre cada uma. Portanto, se eu procurar por "Appl", apenas as empresas que começam com "Appl" serão listadas na tabela de dados e os gráficos refletirão isso.

O único problema que tenho com a implementação atual é quando eu troco esse filtro ou o limpo. Os dados parecem bons, mas os gráficos são renderizados incorretamente. Eles não retornam às suas posições originais quando limpos ou adicionam dados extras de alguma forma. Qualquer dica seria apreciada.

 $("#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();  }});

código 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);

É isso, os gráficos estão apenas filtrando com diferentes dimensões no mesmo objeto de filtro cruzado.

Eu tentei fazer várias coisas na função text_filter, como,dim.filterAll(), dim.filter(null), dc.renderAll(). Quando inspeciono os dados na dimensão, eles estão corretos antes e depois de cada filtro, os outros gráficos simplesmente não parecem manipulá-los corretamente.

Tentei adicionar um filtro básico diretamente ao DC dataTable, mas não consigo fazê-lo funcionar com uma função de filtro personalizado. Então eu posso fazer algo comodashTable.filter(q) e funcionará, mas preciso fornecer o nome completo da empresa para que ele exiba qualquer coisa, mas os gráficos são renderizados corretamente quando eu o aplico e o removo. Eu tentei usardashTable.filterHandler() mas sempre retorna um erro, mas se você souber como fazer isso funcionar, eu ficaria curioso, porque não consegui fazê-lo funcionar mesmo com o exemplo na documentação do dc.js.

Qualquer ajuda seria muito apreciada.

EDITAR:

Aqui está um violino do código quase completo, juntei alguns códigos para fazê-lo funcionar.http://jsfiddle.net/rbristow/HW52d/1/

Para reproduzir o erro, digite uma letra na caixa de pesquisa, limpe-a e digite outra letra. Você pode ver o total não sendo redefinido corretamente.