クラスと個別のIDを持つグループ化されたsvgシェイプのセットがあります。これらの形状に onclick 関数を実装しました。これにより、キャンバス内の配列をフィルター処理する別の関数 (フィルター) が実行されます。ダブルクリックしてフィルター配列を元に戻すこともできます。
ただし、図形の 1 つをクリックすると、クリックしたばかりの図形をダブルクリックするまで、他の図形が無効になることを望みます。私は多くの例を見てきましたが、これまでのところうまくいかないようです:
function filter (d) {
if (d.s =='triangle')
{d3.selectAll(".nodes").filter(function(d) {return d.categ === 'High' || d.categ === 'Low'}).transition().style("opacity", 0).style("display", "none");
d3.selectAll("#High").on('click',function() { d3.event.stopPropagation(); } ); }
else if (d.s =='cross')
{return d3.selectAll(".nodes").filter(function(d) {return d.categ === 'Medium' || d.categ === 'Low'}).transition().style("opacity", 0).style("display", "none");}
else {return d3.selectAll(".nodes").filter(function(d) {return d.categ === 'Medium' || d.categ === 'High'}).transition().style("opacity", 0).style("display", "none");}
}
function antifilter (d) {
d3.selectAll(".nodes").transition().style("opacity", 1).style("display", "block")
}
私も使用しようとしました
.on('click',null)
と
document.getElementById("High").onclick = function() { return false; }
しかし、運がありません。どんな助けでも素晴らしいでしょう!ダブルクリックしたときにマウスクリックを再度開始する方法はありますか。私のフィルターをリセットするためのstopPropagationの反対を見つけることができません。