CMYK SVGを読み取り、インポート、または変換できるものはありますか?


11

短い質問:SVG仕様に従って指定された、CMYK色のSVGファイルがあります。これをデザインプログラム(すべてのデザインプログラム)に組み込んで、デザインを完成させ、印刷する準備をします。ただし、実際にはSVGのCMYK色に注意を払うものは何も見つかりません(とにかく、IllustratorやInkscapeではありません)。

色は複雑で、簡単に変換するのは簡単ではありません。ブランドガイドラインで指定されたCMYKの色合いやブレンドが適切でなければならないため、動的に生成される数百のシェードを想像してください。


背景: javascriptとSVGを使用してデータから生成されるデータ駆動型グラフィックを設計し、JavaScriptとSVGを使用して、たとえばD3を介して(またはRaphael / D34Raphaelを介してIEをサポートして)Web用に1つのバリアントを公開することが一般的になりつつあります。次に、同じコードを使用して、印刷用のバリアントを生成します。これは、Illustrator(またはInkscape)で終了し、プリンターまたはレイアウト担当者にPDFとして送信されます。

これは、ニューヨークタイムズのグラフィックブログの例で、このワークフローについて説明しています。以下のグラフィックはWeb用にコード化されており、SVGがブラウザーからIllustratorにコピーされ、印刷グラフィックとして完成しました(色は単純なので、問題はなく、RGBから変換するだけです)。 :

ここに画像の説明を入力してください

SVG CMYK色指定できます(SVGコーダーの場合、構文は次のようになります:)<circle fill="#CD853F device-cmyk(0.11, 0.48, 0.83, 0.00)"/>。しかし、ほとんどの設計ソフトウェアはこれを無視します。InkscapeコミュニティでCMYK SVGのサポートやScribusに関する複雑な問題(「オープンソースのInDesign」)についての話を見てきましたが、どちらもうまく機能できませんでした(Scribusを誤解している可能性があります)。 - 編集: この記事は、ICCカラープロファイルとして定義されている場合、ScribusがCMYK SVGをインポートできることを示唆しています ...まだ十分に理解されていませんが、有望に見えます)。


したがって、「Webモード」でRGB SVGの視覚化を生成し、「印刷モード」でCMYK SVGを生成するコードを作成して、適切な色を動的に生成できます。問題は、これらのCMYK SVGファイルでは何もできない-IllustratorとInkscapeがそれらを黒として処理することです。

任意のグラフィックプログラムは、そこにあるプラグインまたはCMYKの形でSVG画像を撮影し、それが任意のベクトル形式に変換することができます方法(aipdfeps...)ここで、設計ソフトウェアは、CMYKの色に耳を傾けるだろうか?


以下は、CMYKで色が指定されたテキストを含む単純なSVGファイルです。コピーして貼り付け、.svgファイルとして保存するだけです。

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" 
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="176.18px"
     height="111.59px" viewBox="0 0 176.18 111.59" enable-background="new 0 0 176.18 111.59" xml:space="preserve">
<switch>
    <g>
        <text transform="matrix(1 0 0 1 31.5986 34.522)" fill="#dddddd device-cmyk(0.00, 0.00, 0.00, 0.60)" font-family="'MyriadPro-Regular'" font-size="12">TEST FILE...</text>
        <text transform="matrix(1 0 0 1 31.5986 59.3633)" fill="#dddddd device-cmyk(0.00, 0.85, 0.65, 0.00)" font-family="'MyriadPro-Regular'" font-size="12">This should be red</text>
        <text transform="matrix(1 0 0 1 31.5986 84.2041)" fill="#dddddd device-cmyk(0.90, 0.55, 0.00, 0.00)" font-family="'MyriadPro-Regular'" font-size="12">This should be blue</text>
    </g>
</switch>
</svg>

テストファイルをお持ちですか?
スコット

@スコット私は質問に単純なものを編集しました
user56reinstatemonica8

SVGのコードについては何でも変更できます。また、この記事-libregraphicsworld.org/blog/entry/…-が定義されている場合、ScribusがCMYK SVGをインポートできる可能性があるようです。まだそれをクラックしていません。
user56reinstatemonica8 2013年

さて、私は色を引っ張っているものはここには何もありません。
スコット

1
これは、あなたが参照しているSVG 1.2標準ドラフトであることに注意してください。SVG 1.2はSVG 2を支持して委員会から放棄されました。SVG2は標準化されるまでに数年かかるでしょう。
John Smith

回答:


6

これはうまくいくようです:

  • オープンソースのindesignの代替Scribus、Mac、およびWindowsをインストールします(sourceforgeには、インストールを必要としない、Windows用公式のポータブルバージョンもあります)。警告:そのインターフェースは非常に混乱します...しかし、それは無料であり、この特定の仕事を行います。それを使用する必要があるのは1つだけです。
  • それを開いて、File > Document Setup次に進み、Colour ManagementCMYKに関連するすべてを設定しますGeneric CMYK profile-色、立体形状、印刷の3つの場所である必要があります。
  • SVGファイルがCMYKカラーを次のように指定していることを確認してください:fill="#ffffff icc-color(Generic-CMYK-profile, 1.00, 0.50, 0.00, 0.25)"(1.00 = 100%)

    • SVGがブラウザーで生成される場合、ブラウザーはこのようなスタイルデータの設定を嫌います。最初にfill属性を直接設定してみてください。それがうまくいかない場合は、カスタムSVG属性を使用してみてください。たとえばdata-fill="#223fa3 icc-color..."、テキストファイルで検索置換してください。
    • ブラウザーですべてが黒く表示されても心配しないでください。これは、塗りつぶしデータがあることを示していますが、ブラウザーはそれを理解していません-通常。要素を検査して確認してください。
    • SVGはラファエルによって生成されている場合は、同じようにそれを設定element.node.setAttribute( 'fill', '#223fa3 icc-color...' );-ラファエロのは、.attr('fill','')実際の要素に適用していないようです。.attr('fill')コードが後でそれを読む必要がある場合も更新します。同じことが当てはまりますstroke。もちろん、SVGモードでのみ機能します...
  • を使用してSVGファイルをScribusにインポートしますFile > Import > Get vector
  • PDFとしてエクスポート(EPSとしてのエクスポートは機能しませんでした。すべての色がつまっていました)。エクスポートオプションで「CMYK」または「印刷用」に設定されていることを確認してください。ただし、現時点ではカラーマネージメントタブの下でフレーズが表示されています。デフォルトはRGB(「Web /画面用」)のようです。
  • そのPDFをIllustratorで開きます。元のSVGで指定されているものと同じCMYK色のCMYKドキュメントとして開きます。

結果: SVGに一致する、IllustratorのCMYKグラフィックと、SVGで指定されたCMYKカラー。


警告: ScribusのSVGサポートは非​​常に不安定です。特に:

  • 基本的にはSVGテキストのサポートはなく、SVGテキストのサポートに向けて、これが誰の過失かという議論以外にありませんでした。ひどいカーニングで間違ったフォントですべてのテキストを遠くまで概説することを期待してください。
  • グラデーションや透明度に混乱するようですが、途中で文句を言っていても、正しく表示されることもあります。
  • PDF内のすべてがクリッピングマスクのヒープにラップされます。
  • Scribusの独自のインターフェースは本当に混乱しています(2013年夏現在)-Scribus自体で最小限のいじりを行うことをお勧めします。

場合によっては、元のSVGの要素(テキストなど)とScribusで作成されたバージョンを組み合わせる必要があります。誰かがScribusよりも良い方法を知っているなら、共有してください!


特定のカラープロファイルが必要な場合は、Scribusにさらにカラープロファイルをインストールして、SVGで指定できますが、詳細はわかりません。以前にリンクされたこの記事は、開始するのに適した場所かもしれません。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.