終了

illustrator2023でのSVG書き出し時に、fill="#000"が反映されない。

New Here ,
Jun 25, 2023 Jun 25, 2023

リンクをクリップボードにコピー

コピー完了

illustrator2023でのSVG書き出し時に、パスに設定された fill="#000"が反映されず、全て透明になってしまします。illustrator2022では書き出すことが出来るのですが、何か設定があるのでしょうか?

キーワード
Mac , 読み込みと書き出し

表示

731

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
Community Expert ,
Jun 27, 2023 Jun 27, 2023

リンクをクリップボードにコピー

コピー完了

梢23291648y0yh さん、こんにちは。

 

こちらの手元で簡単な図形(黒色の正円)を作り、Illustrator2023 v27.6.1 と2022 v26.5.3 (Windows版)の両方から「ファイル>書き出し>書き出し形式>ファイルの種類SVG(オプションは次のスクリーンショットの通り)」で書き出しを行いましたが、黒色の塗りは書き出されました。

 

Shot-2023-06-26-001.png

 

よかったら、試したファイル一式を次のURLで公開していますので、チェックなどに使ってください。このデータが書き出せれば、Illustrator側はきちんと動いているのではと思います。

https://www.dropbox.com/s/i6puuh5reaviaux/IllustratorSvgFill20230627.zip?dl=0

※2023年7月末まで公開予定

 

簡単な図形は書き出せたので、後は梢23291648y0yhさんの環境かデータ側に何かの原因があると思うのですが、それをこちらで推し量るのはむずかしそうです。

 

あと、文中にあった細かい部分をいくつか補足します。

 

「パスに設定された fill="#000"が反映されず」とのことですが、黒(#000000)に関しては、SVGコードに色指定のコード(fill)は出力されません。次のディスカッションにくわしく書かれています。

 

▼Can't export SVGs to have a fill="#000000" (black) - Adobe Support Community - 11990294
https://community.adobe.com/t5/illustrator-discussions/can-t-export-svgs-to-have-a-fill-quot-000000-...

 

塗りが黒以外の場合は、色指定のコード(fill)が出力されます。参考に「青色の正円」と「白色の正円」で出力したSVGファイルも先のURLに添付しておきます。

 

また、「全て透明になってしまう」とのことですが、SVGの背景色はデフォルトが透明色指定のため、塗りを入れたオブジェクトも透明なのであれば、そのオブジェクト自体が正しく出力されていないのかもしれません。

 

ちなみに、SVGの透明部分を確認するには、透明部分が白で表示されてしまうブラウザよりも、Photoshopで開いてみることをおすすめします(PhotoshopでSVGを開くと、透明部分は格子模様で描かれるのでわかりやすいです)。

 

以上、解決のヒントに繋がりますと幸いです。
.

ー ー ー ー
参考になったら“▲賛成票”を、解決したら“✔正解”で応答を。
このコメントが有用か、私に伝えてくださるとうれしいです。

r360studio Kazue Mori 🦔
(執筆時間:95分)
ー ー ー ー

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines
New Here ,
Aug 13, 2023 Aug 13, 2023

リンクをクリップボードにコピー

コピー完了

最新

同じくfillが黒のパスだけSVGに反映されずに困っておりました。

 

書き出したい対象にかかっていたクリッピングマスクを非表示にしたところ解消いたしました。
お役に立てれば幸いです。

投票

翻訳

翻訳

レポート

レポート
コミュニティガイドライン
他のユーザーへの思いやりを持ち、敬意を払いましょう。コンテンツの出典を明記し、投稿する前に内容が重複していないか検索してください。 さらに詳しく
community guidelines