.ai
いくつかのファイルをとして保存したとしましょう.svg
。ここで、すべてのベクターをこのファイルからRaphaelに移動して、JavaScriptを使用してそれらを操作したいと思います。
どうすればいいですか?この目標を達成するための可能な方法は何ですか?また、賛否両論を書いてください。そうすれば、ユーザーは自分の意見で最良のものを選ぶことができます。
.ai
いくつかのファイルをとして保存したとしましょう.svg
。ここで、すべてのベクターをこのファイルからRaphaelに移動して、JavaScriptを使用してそれらを操作したいと思います。
どうすればいいですか?この目標を達成するための可能な方法は何ですか?また、賛否両論を書いてください。そうすれば、ユーザーは自分の意見で最良のものを選ぶことができます。
私は数ヶ月前にまったく同じことをしなければなりませんでした。ラッパーを使いました
コマンドラインからノードを使用して変換を行い、ファイルに保存しました
node rappar.js test.svg >test.js
test.jsにベクターが含まれるようになりました。私が見つけた唯一のことは、ラッパーの537行目です。
var files = process.ARGV.slice(0);
する必要があります
var files = process.argv.slice(0);
それ以外はおやつでした。
SVGのノードをループして、Raphaëlオブジェクトに1つずつ書き込むこともできますが、非標準の要素タイプ/属性を扱っている場合を除いて、SVGのインポートを1行のコマンドにするRaphaëlプラグインの1つを使用することをお勧めします。 。そのような:
ここで簡単なコンバーターを見つけました。
長所:
それは本当にシンプルで簡単です-ファイルをアップロードして、生成されたコードを取得します。あなたもそれのプレビューを見ることができます。本当にシンプル.svg
にロードすると、完璧に機能し、コードを簡単に編集できますが...
短所:
しかし、それの最大の問題は、コードが少し乱雑であるということです。したがって、より大きなファイルをロードする場合(100以上のベクトル、またはそれ以上。テスト目的でsthを約1000ロードしました)。また、その名前と構造はレイヤーの分割に対応していません。一部のレイヤー(プレビューで確認できます)の順序が正しくない場合があるため、まったく同じ「画像」を表示する場合は、コードを参照して、.svg
ファイル内のどのオブジェクトに対応するパスを確認する必要があります。
とにかくそれは私が見つけた唯一のものであり、最終的に(いくつかの作業の後)あなたはあなたが望むものを達成することができます。面倒なコードのフラッドを避けるために、.svgを部分ごとにアップロードするのが最善の方法です。
これは私にとって本当にうまくいきましたhttp://roomandboard.github.com/vectron/https://github.com/DmitryBaranovskiy/rappar でrappar依存関係をインストールするとき、それを機能させるためにNode.jsコードを削除する必要があります。
長所:必要なコードはそれほど多くありません。
短所:SVGが大きい場合は少し遅くなる可能性があります。次回の読み込みを高速化するために、別のRaphaelプラグインを使用してJSONに保存することを検討することをお勧めします。
すべてのベクトルがファイルに含まれているため、これらのパスを変数文字列に配置すると、Raphaelはそれを使用します。