2017-06-01 82 views
1

我有一種情況,並排顯示兩行圖。我需要實現用組最高值對圖進行排序,這可以通過chart.order()來實現。 場景: -dc.js行圖默認視圖排序,而不是重新排序,而點擊

1. The initial load of the chart with sorted values. 
2. on Click of the chart, Don't need the sorting or reordering of the bar. 
Filter can apply the chart without reordering the bar position 

是否有解決方案可用?

jsFiddle

+0

你肯定是正確的JSF iddle? – davcs86

+0

我不得不做出一些改變才能使其工作。 [http://fiddle.jshell.net/davcs86/ameh3qbt/3/](http://fiddle.jshell.net/davcs86/ameh3qbt/3/) – davcs86

+0

@ davcs86對不起,我已經更新了jsFiddle:d http:/ /fiddle.jshell.net/caravinden/a7jdw5ds/ –

回答

1

有趣的問題。我認爲最簡單的方法就是在第一次渲染之後拍攝這些值的快照,然後將其用於隨後的重繪。

我們將會把這個成爲postRender事件創建一個事件處理程序的可重複使用的功能:

function save_first_order() { 
    var original_value = {}; // 1 
    return function(chart) { 
     chart.group().all().forEach(function(kv) { // 2 
      original_value[kv.key] = kv.value; 
     }); 
     chart.ordering(function(kv) { // 3 
      return -original_value[kv.key]; 
     }); 
    }; 
} 

postRender事件僅在第一次圖表呈現(畫)後被解僱。此功能

  1. 保持其自身價值的地圖在封閉:地圖上只能由它應用到
  2. 圖表的影響,當渲染髮生,它會保留當前 `組中的所有值。所有()在地圖上,並
  3. 的排序變化功能在地圖中使用的值,而不是當前值

這是假設,當然,沒有新的值出現後來的,但我認爲這是你問題中隱含的假設。

我把它放在了一項功能,它可以重複使用的內部,並將其應用到兩個圖表,像這樣:

rowChart 
    // ... 
    .on('postRender', save_first_order()); 

(請注意,可重複使用的函數被調用,以創建關閉,並返回一個函數,它是實際的事件處理程序)

row chart not reordered

叉的小提琴:http://jsfiddle.net/gordonwoodhull/04fcvgvu/5/

+0

非常感謝...這真的很感謝。這就像魅力一樣。:d –