3

私は中規模のプロジェクトに jsPlumb を使用しています。ドキュメンテーションは説明がしっかりしているという点では薄いですが、なんとかプロジェクトを完了し、配信する準備が整いました。

納車直前に、接続線を曲線ではなく真っ直ぐにしてほしいと頼まれました。これは、jsPlumb connect メソッドに次のようなキーワードを追加するのと同じくらい簡単だと思っていましたjsPlumb.connect({ connector: 'Straight'... })。だから問題は何ですか？

私が取り組んでいるこのプロジェクトでは、ユーザーが接続線を「選択」できるようにして、「削除」ボタンを押して選択した接続をクリアできるようにする必要があります。次のようにjsPlumb のsetPaintStyle()メソッドを呼び出して、ユーザーが接続を選択できるようにしました。

// Select/Deselect each connection on click
jsPlumb.bind('click', function (connection, e) {
   e.preventDefault();

   connection.setPaintStyle({ 
      strokeStyle: 'red'
   });
});

これは、線が曲がっている場合にのみ期待どおりに機能します ( jsPlumb デフォルト)。

ただし、メソッドのconnectorオプションが"Straight"connect()に変更された場合、垂直な接続線 (端点が互いに向かい合っている) は、クリックすると単純に消えます。端点が互いに直接向かい合っていない残りの直線には、この問題はありません。

コネクタ オプションを完全に削除するか、その値を「Bezier」に設定するかsetPaintStyle()、オプションが「Straight」に設定されているときにメソッドを呼び出さないと、クリックされた線は本来の位置に留まります。

以下は jsBin の例です: jsPlumb setPaintStyle() with Straight lines bug

最初は、これは私のアプリケーションのバグだと思っていましたが、多くの時間を費やした後、setPaintStyle() メソッドまで問題を突き止めました。これは jsPlumb のバグであると確信していますが、完全にはわかりません。この時点で非常にイライラします。なぜなら、プロジェクトの提供を妨げているのは、ストロークの色を赤に変更する機能だけだからです。この単純なタスクを直線で完了することができれば、前進できます。

私は自分で SVG パス ノードをターゲットにしてストロークの色を変更することを検討しましたが、jsPlumb は IE8 の VML を使用するため ( ie8 はこのプロジェクトの要件です)、それができるかどうかはわかりません。助言がありますか？

4

1 に答える 1

2

この苛立たしいjsPlumbバグに出くわすかもしれない他の人にとって。土曜日全体を使って修正を探した後、ようやくこれを回避する方法を見つけました。

setPaintStyle()このメソッドを使用してストロークの色を変更する代わりに、実際にはgetPaintStyle()とrepaint()メソッドを組み合わせて使用​​しました。修正されたjsBinの例を次に示します。http：//jsbin.com/ogekot/7/edit

jsPlumb.bind('click', function (connection, e) {
   e.preventDefault();

   connection.getPaintStyle().strokeStyle = '#CE322A';
   connection.repaint()
});
于 2013-03-16T22:13:55.493 に答える