d3.js：從同步畫筆選擇中獲取數據

Question

在我的項目中，我得到了多個動態（在本例中為三個）渲染圖表。

當您在一張圖表中進行選擇時，對多個圖表的同步選擇是關鍵功能之一。

在一張圖表中進行選擇后，是否有可能從所有 3 個選擇中獲取所選數據？ 在最好的情況下，它應該使用不同的選定數據點console.log()三個不同的數組。

我在 jsfiddle 中添加了一個工作示例。

我已經嘗試過console.log(event)的.on("end", ...)中的selectBrush但只給我回一個圖表的評選活動。

這是整個selectBrush代碼：

 var selectBrush = d3
  .brushX()
  .extent([
    [0, 0],
    [width, height],
  ])
  .on("brush", selectBrushed)
  .on("end", function (event) {
    if (event.selection == null) {
      resetSelection();
    }
  });

謝謝

Answer 1

您在這里有 2 個選擇：

1. 在每個畫筆事件后返回 x 比例的選定域。 為所有 3 個圖表全局緩存數據，並針對選定的域范圍過濾每個圖表並輸出它。

2. 在每次畫筆事件后從線元素的 __data__ 屬性中提取數據並返回。 只需控制台記錄線元素的 d3 選擇並查看 _groups 屬性樹。 您將找到 __data__ 屬性。