无法重设焦点顺序条形图 [英] Unable to reset the focus ordinal bar chart

问题描述

在选择了一些个人酒吧之后，我尝试重置.

index.html:(第62行)

 < span>< a href ="javascript:focus.filterAll(); dc.redrawAll();"class ="reset"> reset</a></span> 

这似乎行不通.我能够重设所有图形饼图，折线图等，但不能重设此图.

在 index.js 中创建这两个有序图，如下所示:

  var focus = new dc.barChart('#focus');var range = new dc.barChart('#range'); 

解决方案

此示例使用其自己的顺序选择实现替换了条形图的内置过滤功能，因为该图具有线性刻度.

该示例使用全局变量 focusFilter 来存储当前选择.我们需要清空它，还需要像原始的 filterAll 一样更新尺寸过滤器，将代码从点击处理程序中拉出:

  focus.applyFilter = function(){//非标准方法如果(focusFilter.length)this.dimension().filterFunction(function(k){返回focusFilter.includes(k);});否则this.dimension().filter(null);};focus.filterAll = function(){focusFilter = [];this.applyFilter();}; 

这还将允许 dc.filterAll()正常工作，以获得全部重置"链接.

街区的叉子.

由于某些原因，我无法获得原始照片

 < a href ="javascript:focus.filterAll(); dc.redrawAll()">重置</a> 

链接在此块中完全起作用，因此我用等效的D3点击处理程序替换了它们:

  d3.select('#reset-focus').on('click'，()=> {focus.filterAll();dc.redrawAll();})d3.select('#reset-all').on('click'，()=> {dc.filterAll();dc.redrawAll();}) 

我还更新了焦点序号栏示例.请注意，自动隐藏/显示重置链接无效，因为该图表内部仍具有不相关的范围过滤器.

I am trying to reset after choosing some of the individual's bar.

index.html: (line no. 62)

<span>
  <a href="javascript:focus.filterAll(); dc.redrawAll();"  class="reset">reset</a>
</span>

This seems not to work. I was able to reset all the graphs pie chart, line chart, etc but not this one.

Those two ordinal graphs are created in index.js like this:

var focus = new dc.barChart('#focus');
var range = new dc.barChart('#range');

https://blockbuilder.org/ninjakx/483fd69328694c6b6125bb43b9f7f8a7

Update: It looks weird now Coz it's showing a single bar and all the bar have got invisible but I want them to be visible (in gray colour) but not clickable.

解决方案

This example replaces the built-in filtering functionality of the bar chart with its own implementation of ordinal selection, because the chart has a linear scale.

The example uses a global variable focusFilter to store the current selection. We need to empty this out and we also need to update the dimension filter as the original filterAll would do, pulling that code out of the click handler:

    focus.applyFilter = function() { // non-standard method
        if(focusFilter.length)
            this.dimension().filterFunction(function(k) {
                return focusFilter.includes(k);
            });
        else this.dimension().filter(null);
    };
    focus.filterAll = function() {
        focusFilter = [];
        this.applyFilter();
    };

This will also allow dc.filterAll() to work, for a "reset all" link.

Fork of your block.

For some reason, I could not get the original

<a href="javascript:focus.filterAll(); dc.redrawAll()">reset</a>

links to work at all in this block, so I replaced them with the equivalent D3 click handlers:

    d3.select('#reset-focus').on('click', () => {
      focus.filterAll();
      dc.redrawAll();
    })
    d3.select('#reset-all').on('click', () => {
      dc.filterAll();
      dc.redrawAll();
    })

I also updated the focus ordinal bar example. Note that automatic hiding/showing of the reset link doesn't work because the chart still has an irrelevant range filter inside of it.

这篇关于无法重设焦点顺序条形图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！