4

GIMP を使用して、 http: //upload.wikimedia.org/wikipedia/commons/9/95/Continents.svgで各大陸のパスを取得しましたが、この SVG ファイルを次のようなものに変換する方法がわかりません ( https://github.com/thomaspeklak/raphaeljs-worldmapから選択):

SVG パスを Raphael Path に変換する方法を教えてください。

africa.push(W.path("M13728 10231 c-34 -19 -84 -21 -109 -5 -6 4 -15 1 -19 -5 -5 -9 -14 -9 -35 1 -22 10 -29 10 -33 0 -2 -6 -11 -12 -21 -12 -9 0 -23 -6 -29 -12 -10 -10 -17 -10 -32 0 -27 16 -55 15 -190 -7 -113 -19 -180 -42 -180 -63 0 -5 -7 -8 -15 -5 -8 4 -17 2 -20 -3 -4 -6 -13 -10 -21 -10 -8 0 -26 -11 -40 -25 -14 -14 -30 -25 -37 -26 -25 -2 -62 3 -70 10 -4 4 -33 4 -65 0 -63 -9 -100 6 -109 42 -6 20 -20 24 -39 11 -6 -4 -22 -32 -35 -62 -34 -81 -57 -108 -119 -137 -60 -29 -120 -82 -120 -107 0 -9 -10 -31 -22 -47 -18 -24 -23 -44 -23 -94 0 -38 -5 -69 -12 -76 -7 -7 -13 -18 -13 -24 0 -5 -16 -24 -36 -40 -20 -17 -45 -38 -56 -48 -23 -21 -80 -47 -103 -47 -22 0 -36 -16 -62 -72 -13 -27 -27 -48 -31 -48 -27 0 -82 -82 -82 -123 0 -24 ")
  )
  .attr(attr)
  .scale(0.016963, -0.016963, 0,0)
  .translate(0,-15000);

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

4

1 に答える 1

7

まず第一に、ベクトルで作業しているので、gimp (「オープンソースの Adob​​e Photoshop」) よりもinkscape (「オープンソースの Adob​​e Illustrator」) でより良い結果が得られる可能性があります。

適切な最初のステップは、それを Inkscape にインポートすることです。Inkscape で Illustrator のパス単純化ツールに相当するものを使用します (ほとんどのウィキペディア SVG マップでは、非常に高レベルの詳細よりもファイル サイズが小さいことが重要であると仮定して、破損しないように注意してください)。国境)、SVG としてエクスポートします。後で時間を節約するために、まだ ID を持っていない場合は、Inkscape 内で各国の図形に適切な ID (国名や国コードなど) を指定することもできます。

それを Raphael ロジックに変換するには、次の 3 つのオプションがあります。

  1. 無料の SVG からラファエルへのコンバータWeb サービスであるReady Set Raphael (rsr)を使用します。私がこれを書いてから rsr が更新されていない限り、結果のコードを整理したくなるでしょう:

    • paper.setStart();パスのブロックの前後に配置することにより、機能するセットにすべてを配置しvar world = paper.setFinish();ます (使用しているものを置き換えることを忘れないでくださいpaper)。
    • .attr()そのセット ID を除くすべての複製された をすべて置き換えてattr()から、個々の要素ではなく、塗りつぶしやストロークなどの をセットに適用します。
    • 名前で簡単にアクセスできるように、パスをオブジェクトに保存します。ラファエルとの作業がとても簡単になります。

  2. 他の SVG から Raphael へのコンバーターまたはインポーター (例: this one )を使用します。これらが良いかどうかはわかりませんが、個人的にはレディセット ラファエルの方が良い経験をしています.

  3. 手でやってください。d="lots of co-ordinates"これは、各 SVG パスからの文字列をコピーして のようなものに貼り付けるのと同じくらい簡単var someCountry = paper.path("lots of co-ordinates"); someSet.push(someCountry);です。非常に多くの国 (170 程度) があるため、時間がかかりますが、追加の制御により、長期的には時間を節約できる可能性があります。

そして、例から学ぶことを忘れないでください。

于 2012-05-07T12:28:25.710 に答える