JavaScript에서 프레젠테이션 슬라이드를 이미지로 변환하기

이 페이지의 내용

Aspose.Slides를 사용하여 JavaScript에서 PPT, PPTX 및 ODP 프레젠테이션의 슬라이드를 PNG, JPEG, GIF, TIFF, EMF 및 기타 이미지 형식으로 변환합니다.

소개

Aspose.Slides for Node.js via Java는 PowerPoint 및 OpenDocument 프레젠테이션의 개별 슬라이드를 PNG, JPEG, GIF, TIFF 및 기타 이미지 형식으로 렌더링할 수 있습니다.

슬라이드를 이미지로 변환하려면 다음 단계를 따르세요:

프레젠테이션을 Presentation 클래스로 로드합니다.
렌더링하려는 슬라이드를 선택합니다.
필요한 경우 RenderingOptions 또는 TiffOptions 클래스로 렌더링을 구성합니다.
Slide.getImage 메서드를 호출합니다. 이 메서드는 IImage 객체를 반환합니다.
IImage.save 메서드를 호출하고 ImageFormat 값을 사용하여 출력 형식을 지정합니다.

슬라이드를 PNG 이미지로 변환하기

가장 간단한 변환은 기본 렌더링 설정을 사용합니다. 결과로 반환된 IImage 객체는 메모리에서 처리하거나 파일로 저장할 수 있습니다.

다음 JavaScript 예제는 첫 번째 슬라이드를 렌더링하고 PNG 이미지로 저장합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slide = presentation.getSlides().get_Item(0);

    const image = slide.getImage();
    try {
        image.save("Slide_0.png", aspose.slides.ImageFormat.Png);
    } finally {
        image.dispose();
    }
} finally {
    presentation.dispose();
}

사용자 지정 크기로 슬라이드를 이미지로 변환하기

java.awt.Dimension 값을 받아 정확한 픽셀 크기로 슬라이드를 렌더링하는 Slide.getImage 오버로드를 사용합니다.

다음 예제는 1820 × 1040 JPEG 이미지를 생성합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");

const imageSize = java.newInstanceSync("java.awt.Dimension", 1820, 1040);

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slide = presentation.getSlides().get_Item(0);

    const image = slide.getImage(imageSize);
    try {
        image.save("Slide_0.jpg", aspose.slides.ImageFormat.Jpeg);
    } finally {
        image.dispose();
    }
} finally {
    presentation.dispose();
}

노트와 댓글이 포함된 슬라이드를 이미지로 변환하기

기본적으로 슬라이드 이미지에는 노트나 댓글이 포함되지 않습니다. 노트와 댓글이 표시되는 위치를 제어하려면 NotesCommentsLayoutingOptions 객체를 RenderingOptions.setSlidesLayoutOptions 메서드에 전달합니다.

다음 예제는 잘린 노트를 슬라이드 아래에, 댓글을 오른쪽에 배치합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");

const scaleX = 2;
const scaleY = scaleX;

const commentsAreaColor = java.newInstanceSync("java.awt.Color", 250, 235, 215);

const layoutOptions = new aspose.slides.NotesCommentsLayoutingOptions();
layoutOptions.setNotesPosition(aspose.slides.NotesPositions.BottomTruncated);
layoutOptions.setCommentsPosition(aspose.slides.CommentsPositions.Right);
layoutOptions.setCommentsAreaWidth(500);
layoutOptions.setCommentsAreaColor(commentsAreaColor);

const renderingOptions = new aspose.slides.RenderingOptions();
renderingOptions.setSlidesLayoutOptions(layoutOptions);

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slide = presentation.getSlides().get_Item(0);

    const image = slide.getImage(renderingOptions, scaleX, scaleY);
    try {
        image.save("Image_with_notes_and_comments_0.gif", aspose.slides.ImageFormat.Gif);
    } finally {
        image.dispose();
    }
} finally {
    presentation.dispose();
}

Warning

슬라이드‑이미지 변환 시, NotesCommentsLayoutingOptions.setNotesPosition 메서드에 BottomFull 을 전달하지 마세요. 노트에는 고정된 이미지 크기보다 더 많은 텍스트가 포함될 수 있습니다. 대신 BottomTruncated 를 사용하세요.

TIFF 옵션을 사용하여 슬라이드를 이미지로 변환하기

TiffOptions 클래스를 사용하면 렌더링된 TIFF 이미지의 크기, 해상도 및 기타 속성을 제어할 수 있습니다.

다음 예제는 첫 번째 슬라이드를 300 DPI의 2160 × 2880 TIFF 이미지로 렌더링합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");

const imageSize = java.newInstanceSync("java.awt.Dimension", 2160, 2880);

const tiffOptions = new aspose.slides.TiffOptions();
tiffOptions.setImageSize(imageSize);
tiffOptions.setDpiX(300);
tiffOptions.setDpiY(300);

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slide = presentation.getSlides().get_Item(0);

    const image = slide.getImage(tiffOptions);
    try {
        image.save("output.tiff", aspose.slides.ImageFormat.Tiff);
    } finally {
        image.dispose();
    }
} finally {
    presentation.dispose();
}

Warning

JDK 9 이전 Java 버전에서는 TIFF 지원이 보장되지 않습니다.

모든 슬라이드를 이미지로 변환하기

슬라이드 컬렉션을 순회하여 전체 프레젠테이션을 일련의 이미지로 변환합니다. 별도로 건너뛰지 않는 한 숨겨진 슬라이드도 포함됩니다.

다음 예제는 모든 슬라이드를 가로 및 세로 스케일 팩터가 2인 JPEG 이미지로 렌더링합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");

const scaleX = 2;
const scaleY = scaleX;

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slideCount = presentation.getSlides().size();
    for (let index = 0; index < slideCount; index++) {
        const slide = presentation.getSlides().get_Item(index);
        const image = slide.getImage(scaleX, scaleY);
        try {
            image.save("Slide_" + index + ".jpg", aspose.slides.ImageFormat.Jpeg);
        } finally {
            image.dispose();
        }
    }
} finally {
    presentation.dispose();
}

Enhanced Metafile 출력 생성

Enhanced Metafile(EMF)은 벡터 기반 그래픽을 Microsoft Office 또는 Windows 메타파일을 지원하는 기타 Windows 응용 프로그램과 교환해야 할 때 유용합니다. 픽셀 기반 이미지와 달리 EMF는 스케일을 확대해도 선명도가 크게 감소하지 않는 벡터 그리기 작업을 유지할 수 있습니다. 그러나 EMF는 주로 Windows 메타파일을 지원하는 애플리케이션을 위한 호환성 형식이며, 범용 교환 형식은 아닙니다. 또한 비트맵 이미지 및 일부 효과와 같은 복잡한 슬라이드 내용은 벡터 메타파일 컨테이너 내부에 래스터화된 요소로 저장될 수 있습니다.

슬라이드를 EMF로 내보내기

Slide.writeAsEmf 메서드는 슬라이드를 EMF 형식으로 대상 스트림에 기록합니다. 다음 예제는 프레젠테이션을 로드하고 첫 번째 슬라이드를 선택한 뒤 EMF 파일 스트림에 기록합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");

const presentation = new aspose.slides.Presentation("input.pptx");
try {
    const slide = presentation.getSlides().get_Item(0);

    const emfStream = java.newInstanceSync("java.io.FileOutputStream", "Slide_0.emf");
    try {
        slide.writeAsEmf(emfStream);
    } finally {
        emfStream.close();
    }
} finally {
    presentation.dispose();
}

위와 같이 호출자는 Slide.writeAsEmf 에 전달된 스트림의 소유권을 가지고 있으며, 스트림을 닫는 책임도 있습니다.

SVG 이미지를 EMF로 변환하고 프레젠테이션에 추가하기

SvgImage.writeAsEmf 를 사용하여 SVG 콘텐츠를 EMF로 변환합니다. 결과 바이트는 ImageCollection.addImage 로 프레젠테이션에 추가하고 ShapeCollection.addPictureFrame 으로 슬라이드에 배치할 수 있습니다.

다음 예제는 SVG 마크업으로부터 SvgImage을 생성하고, 이를 메모리 내 EMF로 변환한 뒤 첫 번째 슬라이드에 메타파일을 삽입하고 프레젠테이션을 저장합니다:

const aspose = {};
aspose.slides = require("aspose.slides.via.java");
const java = require("java");

const svgContent = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"200\" height=\"100\"><rect width=\"200\" height=\"100\" fill=\"#4472C4\"/></svg>";
const svgImage = new aspose.slides.SvgImage(svgContent);

const presentation = new aspose.slides.Presentation();
try {
    const slide = presentation.getSlides().get_Item(0);

    const emfStream = java.newInstanceSync("java.io.ByteArrayOutputStream");
    try {
        svgImage.writeAsEmf(emfStream);

        const emfData = java.newArray("byte", Array.from(emfStream.toByteArray()));
        const image = presentation.getImages().addImage(emfData);
        slide.getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 20, 20, 200, 100, image);
    } finally {
        emfStream.close();
    }

    presentation.save("Presentation_with_emf.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    presentation.dispose();
}

SvgImage.writeAsEmf 은 대상 스트림의 소유권을 갖지 않습니다. java.io.ByteArrayOutputStream 은 생성된 모든 데이터를 메모리에 저장하므로 toByteArray 를 호출하기 전에 위치를 재설정할 필요가 없습니다. 반환된 바이트 배열은 스트림을 닫은 후에도 유효합니다.

EMF 생성은 선택된 Aspose.Slides for Node.js via Java 및 JDK 구성에서 지원되는 운영 체제에서 사용할 수 있지만, 폰트 또는 그래픽 종속성이 없을 경우 플랫폼마다 렌더링 결과가 다를 수 있습니다. 소스 콘텐츠에서 사용된 폰트를 설치하거나 적절한 대체 폰트를 구성하고, Aspose.Slides for Node.js via Java의 platform requirements 를 따른 뒤 대상 EMF 사용 애플리케이션에서 결과를 검증하십시오. Linux 및 macOS 애플리케이션은 Windows 메타파일 표시 및 편집 지원이 제한적이거나 일관되지 않을 수 있습니다.

컬러 이모지 렌더링

Note

프레젠테이션 슬라이드를 이미지로 변환할 때 컬러 이모지를 올바르게 렌더링하려면 프레젠테이션에 사용된 이모지 폰트가 변환을 수행하는 시스템에 설치되어 있어야 합니다. 예를 들어 프레젠테이션에 Segoe UI Emoji 폰트를 사용했지만 해당 폰트가 없으면 출력 이미지에서 이모지가 단색으로 표시될 수 있습니다.

FAQ

Aspose.Slides가 애니메이션이 포함된 슬라이드 렌더링을 지원합니까?

아니요. Slide.getImage 메서드는 슬라이드의 정적 이미지를 렌더링하며 애니메이션을 내보내지 않습니다.

숨겨진 슬라이드를 이미지로 내보낼 수 있나요?

예. 숨겨진 슬라이드도 일반 슬라이드처럼 렌더링할 수 있습니다. 위 예제와 같이 처리 루프에 포함하면 됩니다.

슬라이드 이미지에 그림자 및 기타 효과가 보존됩니까?

예. Aspose.Slides는 슬라이드 이미지에 그림자, 투명도 및 기타 지원되는 그래픽 효과를 렌더링합니다.

JavaScript로 프레젠테이션에서 슬라이드 제거 JavaScript에서 프레젠테이션 슬라이드 비교