ウェブ画像の場合、透明性と幅広い互換性をサポートする PNG が主流の形式です。一方、SVG はスケーラビリティが高く、ロゴ、アイコン、その他のベクターベースのグラフィックに最適です。SVG には多くの利点がありますが、特に異なるプラットフォームやデバイス間での互換性を確保するには、SVG を PNG に変換する必要がある場合があります。このブログ投稿では、Node.js を使用して SVG グラフィックを PNG 形式に変換するプロセスについて説明します。
画像を変換する Node.js API
GroupDocs は強力な Conversion API を提供し、開発者はこれを使用して画像形式を変換し、変換プロセス中に結果の画像を操作できます。この API は幅広い高度なオプションをサポートしているため、Node.js で SVG を PNG に変換する場合に最適です。このタスクには GroupDocs.Conversion for Node.js を使用します。
開始するには、プロジェクトで次のコマンドを実行して、Node.js 用の GroupDocs.Conversion を インストール します。
npm i @groupdocs/groupdocs.conversion
詳細については、ドキュメントおよびAPIリファレンスをご覧ください。
Node.js を使用して SVG を PNG 画像に変換する
まず、デフォルト設定を使用して SVG ベクター グラフィックを PNG 形式に変換してみましょう。次の手順では、Node.js を使用して SVG イメージを PNG に変換する方法を説明します。
- Converter クラスを使用して SVG ファイルを読み込みます。
- 変換オプションを設定します。
- 出力形式を PNG に指定します。
- 準備したオプションを使用して convert() メソッドを呼び出します。
SVG を PNG に変換する Node.js コードは次のとおりです。
// Node.js 変換 API を使用して、デフォルト オプションで SVG ファイルを PNG 形式に変換する
const converter = new groupdocs.conversion.Converter("path/vector-graphic.svg")
const convertOptions = new groupdocs.conversion.ImageConvertOptions()
convertOptions.setFormat(groupdocs.conversion.ImageFileType.Png)
converter.convert("path/converted-svg-to-png.png", convertOptions)
Node.js を使用した高度な SVG から PNG への変換
GroupDocs.Conversion for Node.js には、変換プロセス中に PNG 出力に適用できるさまざまなカスタマイズ オプションが用意されています。これらのオプションには次のものが含まれます。
- 明るさ調整
- コントラスト調整
- ガンマ補正
- グレースケール変換
- 水平または垂直反転
- 回転角度
- カスタム画像サイズ(高さと幅)
- 透かしの追加
Node.js で SVG から PNG への変換中にこれらの高度なオプションを適用する方法を見てみましょう。
- Converter クラスを使用して SVG ファイルを読み込みます。
- 画像変換オプションを設定します。
- 出力形式を PNG に指定します。
- 明るさ、回転、その他の利用可能なカスタマイズを定義します。
- convert() メソッドを呼び出して PNG を生成します。
これらの高度なオプションの一部を適用する Node.js コードを次に示します。
// さまざまなカスタマイズを使用して Node.js で SVG ベクターを PNG 形式に変換する
const converter = new groupdocs.conversion.Converter("path/vector-graphic.svg")
const convertOptions = new groupdocs.conversion.ImageConvertOptions();
convertOptions.setFormat(groupdocs.conversion.ImageFileType.Png);
convertOptions.setFlipMode(groupdocs.conversion.ImageFlipModes.FlipY);
convertOptions.setBrightness(50);
convertOptions.setContrast(50);
convertOptions.setGamma(0.5);
convertOptions.setGrayscale(true);
convertOptions.setHorizontalResolution(300);
convertOptions.setVerticalResolution(100);
convertOptions.setPageNumber(1);
convertOptions.setPagesCount(2);
converter.convert("path/converted-svg-to-png.png", convertOptions)
SVGからPNGへのオンライン変換を無料でお試しください
SVG ファイルを PNG に変換する簡単で素早いソリューションが必要ですか? この無料のオンライン SVG から PNG へのコンバーター を使用してください。Web ブラウザーを備えたあらゆるデバイスからアクセスできるため、便利で手間がかかりません。
無料のAPIライセンスを取得する
GroupDocs.Conversion の 無料の一時ライセンス を取得すると、評価制限なしで API を使用できます。
結論
この記事では、GroupDocs.Conversion for Node.js を使用して Node.js で SVG ベクター グラフィックスを PNG 画像に変換する方法について説明しました。また、回転、グレースケール、透かし、明るさ調整などのカスタマイズを適用して変換プロセスを強化する方法も説明しました。これらの高度な機能を使用すると、PNG 出力を正確な要件に合わせて調整できます。
その他の例については、GroupDocs GitHub リポジトリ をご覧ください。独自の SVG から PNG へのコンバーターを構築するのに役立つさまざまなコード サンプルが見つかります。ご質問がある場合は、フォーラム からお気軽にお問い合わせください。