D3刷自定義句柄空選擇可見性

Question

我想弄清楚如何讓自定義畫筆句柄突出顯示數據範圍等於單個值，這似乎導致空選擇。

在這裏，我在邁克·博斯托克的例子之一上重新創建了普朗克。它在Angular 2/ionic中，所以如果這是一個問題，請到這裏查看他的例子的純javascript。我編輯的主要內容是在隱藏自定義句柄的位置時，註明出現null選擇的位置。

if (s == null) { 
    //handle.attr("display", "none"); 
    //circle.classed("active", false); 
} 

http://plnkr.co/edit/tRyhlJ

https://bl.ocks.org/mbostock/4349545

如果您在plunkr例子看，你可以看到，如果你點擊並放手刷仍然是一個完美的球體，與您單擊的線。相反，如果消失，我想刷柄保持...並且不會導致錯誤，當您單擊以展開柄時。

我目前得到，似乎並不能找到解決方法的錯誤，是這樣的：

如何優雅地忽略這個內部D3錯誤，並繼續讓我的選擇擴大？

我已經嘗試了各種各樣的事情，如當它處於此狀態時關閉指針事件，並手動取消隱藏/調整默認句柄，無濟於事。每次，當我點擊手柄時，我得到這個錯誤。

Answer 1

據我所知，沒有「乾淨」的方式來處理它。原因是一次單擊就會定義一個大小爲0的範圍，刷子將其視爲一個空範圍（請參見source），因此它會故意使選擇無效（請參閱source）。

這一切都意味着，除非你創建自己的d3-brush版本來做你想做的事情，否則沒有辦法讓一個空選擇不爲空，也不能爲一個空選擇渲染一個筆刷。

還有一個解決辦法，我能想到的：當你發現一個空的選擇（其中s == null）使用brush.move來選擇設置爲東西。那東西將不得不是一個範圍的大小不是0（因爲如果你使它0，那麼d3，會再次認爲這是一個空的選擇，並廢除它）。要做一個非零的選擇看起來像一個零大小的選擇（它必須是，因爲它是由一個單一的點擊事件定義的），你必須做一個很小的選擇，例如[123, 123.0001]。您需要知道點擊的鼠標位置，而不是123，您可以使用d3.mouse。把它放在一起，它看起來像這樣：

if (s == null) { 
    var mousex = d3.mouse(this)[0] 
    gBrush.call(brush.move, [mousex, mousex+.001]); 
}