1

私は D3 と jQWidgets の両方をほとんど一緒に使用していますが、jQWidgets が D3 ブラシに干渉しているため、マウスアップ イベントに応答しません。

この単純化された例では、jqxDragDrop が使用されるたびにブラッシングがブラッシング状態で停止することがわかります。

ここにコード：

var scale = d3.scale.linear().range([0, 100]);
var brush = d3.svg.brush()
    .x(scale)
    .y(scale)
;    
d3.select("#brush").append("g")
    .call(brush)
;
$("#draggable").jqxDragDrop({});  // Remove me to fix brush
#brush {
    width: 100px;
    height: 100px;
    background-color: yellow;
}
#draggable {
    width: 100px;
    height: 100px;
    background-color: gray;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css" rel="stylesheet"/>
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<svg id="brush"></svg>
<div id="draggable"></div>

興味深いことに、Chrome でタッチ エミュレーションを使用すると問題なく動作するようです。

私は JavaScript のイベント デバッグの経験があまりないので、どのように進めたらよいのか少し戸惑っています。ライブラリを変更せずに修正することは可能ですか? これを理解するためにどのようにアプローチすればよいですか？

4

0 に答える 0