javascript - 在 URI 中存储 dc.js 过滤器并恢复它们

Question

在这里，我从每个图表中选择了 3 个过滤器 1，并将该编码的 url 粘贴到 url 参数中。但是当我按下 decode url 按钮时，它只重绘中间的图表过滤器而不是剩下的一次。我该怎么办？ 谢谢

function encodeFunction()
{
    var filters = [];

    for (var i = 0; i < dc.chartRegistry.list().length; i++)
    {

        var chart = dc.chartRegistry.list()[i];

        for (var j = 0; j < chart.filters().length; j++)
        {
            filters.push({ChartID: chart.chartID(), Filter: chart.filters()[j]});
        }
    }
    var urlParam =  encodeURIComponent(JSON.stringify(filters));
    alert(urlParam);
}
function decodeFunction()
{
    //encoded url here
    var urlParam="%5B%7B%22ChartID%22%3A1%2C%22Filter%22%3A2012%7D%2C%7B%22ChartID%22%3A2%2C%22Filter%22%3A%5B1.0454545454545454%2C4.045454545454545%5D%7D%2C%7B%22ChartID%22%3A3%2C%22Filter%22%3A%22Mr%20B%22%7D%5D ";

    var filterObjects = JSON.parse(decodeURIComponent(urlParam));

    for (var i = 0; i< filterObjects.length; i++)
    {
        dc.chartRegistry.list()[filterObjects[i].ChartID-1].filter(filterObjects[i].Filter);
    }

    // dc.renderAll();

    dc.redrawAll();
}

这是 fiddle :js fiddle link

Answer 1

看起来您的代码在一般情况下是正确的，但由于 dc.js 处理过滤器的方式有些怪癖，您不能仅从其序列化形式恢复范围过滤器。

我能够通过为数组添加一个特例来让它工作:

   for (var i = 0; i< filterObjects.length; i++)
   {
       var filter = filterObjects[i].Filter;
       if(filter instanceof Array) filter = dc.filters.RangedFilter(filter[0], filter[1]);
       dc.chartRegistry.list()[filterObjects[i].ChartID-1].filter(filter);
   }

这是我对你的 fiddle 的 fork :http://jsfiddle.net/gordonwoodhull/4dv93aht/10/

我认为不需要这种特殊情况，所以我在这里开了一个问题:https://github.com/dc-js/dc.js/issues/819