1

非常に基本的な SVG ファイルを編集できるようにする必要があるプロジェクト用に、カスタマイズされたバージョンのSVG-editを実装しています。これらの SVG ファイルのテキストは編集可能である必要がありますが、画像は編集可能ではありません。

したがって、これらのファイルの 1 つの一般的な例では、上部にテキスト要素があり、その下に画像要素があります。ユーザーが画像要素を変更できないようにするために、画像要素に追加できる属性、およびその結果、javascriptエディター自体で作成できる構成はありますか?

(明らかに、SVG 編集を使用せずにこれを実現できます。つまり、ユーザーの入力用に TextBox を用意し、SVG のテキスト要素をその値に置き換えるだけですが、それは見苦しいです。)

どんな助けでも大歓迎です..

4

1 に答える 1

4

SVG Edit では、すべての SVG DOM が編集可能であり、SVG Edit などの属性があったとしても、readonly自分で実装しない限り無視されます。

私もSVG Edit の独自の実装を持っていますが、たまたまあなた自身と同様のユースケースに出くわしました。私がしたことは、レイヤーパネルを非表示にして、編集可能なコンテンツを最上位レイヤーに配置することでした. この方法では、ユーザーは下層のレイヤーにアクセスできません。SVG ファイルを次のように変更する必要があります...

<svg xmlns="http://www.w3.org/2000/svg">
    <g>
      <title>Layer 1</title>
      <!-- NON EDITABLE CONTENT -->
    </g>
    <g>
      <title>Layer 2</title>
      <!-- YOUR TEXT ELEMENTS -->
    <g>
</svg>

次に、いくつかのCSSでレイヤーパネルを非表示にします

#svg_editor #sidepanels {
  display: none;
}

http://tinyurl.com/9q9s7d9

(URL は SVG Edit のトランク ビルドにリンクしていますが、エンコードされた SVG 文字列を読み込むため短縮されています)

于 2012-09-26T09:32:06.770 に答える