SVGパスの消去または部分的な透明化

Question

最近SVGパスの作業を開始しました。 JavaScript SVGとキャンバスを使用して、マウスを使用して動的に描画することができます。

私の問題の1つは、ユーザーが既に存在するパスを描画しようとすると、それを乗り越えるのに時間がかかることです。これを行うには効率的でスムーズな方法があるのだろうかと思います。

私の他の問題は、すでに描画されたSVGパスの一部を消去することです。私は、別の色（ex.white）を使用してパスを上書きすることができますが、背景の画像が存在する場合は、背景の部分をマスクします。パスの一部を編集して透明部分にするか、部分を削除することがありますか？

キャンバスの背景色を取得し、その色を使用してパスを描画しようとしましたが、元の点の色しか得られません。

ありがとうございました。

Answer 1

私にとって現在働いている解決策は次のとおりです。

• javascriptファイルでは、配列が作成されます。またカウンター。

  var idArray = new Array();
var idCounter = 0;

• 経路はIDがアレイにプッシュされ作成されています。

  idArray.push(idCounter);

• は次いで"Name_of_path".attr('id',idCounter);を使用してパスのIDが設定されています。

• カウンタi,i < idArray.lengthを使用してIDをループすると、クリックされたパスを見つけることができます。 });
  

• var v = "name_of_paper".getById($(this).id);
$(this).remove();
$("#"+list[i]).click(function(){
  

  for(var i = 0;i<list.length;i++){
  

  また、スタイル内のidクラスを定義することによって、あなたは不透明度を変更することができます。

このソリューションは、パスを完全に削除するだけです。パスの一部を削除するソリューションはまだありません。ただの回避策。