PowerPoint プレゼンテーションにスライドを挿入する
PowerPoint アドインは、PowerPoint のアプリケーション固有の JavaScript ライブラリを使用して、1 つのプレゼンテーションから現在のプレゼンテーションにスライドを挿入できます。 挿入したスライドがソース プレゼンテーションの書式設定を保持するか、ターゲット プレゼンテーションの書式設定を保持するかを制御できます。
スライド挿入 API は、主にプレゼンテーション テンプレートのシナリオで使用されます。アドインによって挿入できるスライドのプールとして機能する既知のプレゼンテーションが少なからず存在します。 このようなシナリオでは、ユーザーまたは顧客が、選択基準 (スライド タイトルや画像など) とスライド ID を関連付けるデータ ソースを作成して管理する必要があります。 API は、ユーザーが任意のプレゼンテーションからスライドを挿入できるシナリオでも使用できますが、そのシナリオでは、ユーザーは実質的にソース プレゼンテーション からすべての スライドを挿入するように制限されます。 詳細については、「 挿入するスライドの選択 」を参照してください。
1 つのプレゼンテーションから別のプレゼンテーションにスライドを挿入するには、2 つの手順があります。
- ソース プレゼンテーション ファイル (.pptx) を base64 形式の文字列に変換します。
- メソッドを
insertSlidesFromBase64使用して、base64 ファイルから現在のプレゼンテーションに 1 つまたは複数のスライドを挿入します。
ソース プレゼンテーションを base64 に変換する
ファイルを base64 に変換する方法は多数あります。 使用するプログラミング言語とライブラリ、およびアドインのサーバー側で変換するか、クライアント側で変換するかは、シナリオによって決まります。 最も一般的には、 FileReader オブジェクトを使用して、クライアント側で JavaScript で変換を行います。 次の例は、このプラクティスを示しています。
まず、ソース PowerPoint ファイルへの参照を取得します。 この例では、型
fileのコントロールを<input>使用して、ユーザーにファイルの選択を求めます。 アドイン ページに次のマークアップを追加します。<section> <p>Select a PowerPoint presentation from which to insert slides</p> <form> <input type="file" id="file" /> </form> </section>このマークアップは、次のスクリーンショットの UI をページに追加します。
注:
PowerPoint ファイルを取得するには、他にも多くの方法があります。 たとえば、ファイルが OneDrive または SharePoint に保存されている場合は、Microsoft Graph を使用してダウンロードできます。 詳細については、「Microsoft Graph でのファイルの操作」および「Microsoft Graph を使用してファイルにアクセスする」を参照してください。
次のコードをアドインの JavaScript に追加して、入力コントロールの
changeイベントに関数を割り当てます。 (関数は次のstoreFileAsBase64手順で作成します)。$("#file").on("change", storeFileAsBase64);次のコードを追加します。 このコードについては、次の点に注意してください。
- メソッドは
reader.readAsDataURL、ファイルを base64 に変換し、 プロパティにreader.result格納します。 メソッドが完了すると、イベント ハンドラーがonloadトリガーされます。 - イベント ハンドラーは
onload、エンコードされたファイルのメタデータをトリミングし、エンコードされた文字列をグローバル変数に格納します。 - base64 でエンコードされた文字列は、後の手順で作成した別の関数によって読み取られるので、グローバルに格納されます。
let chosenFileBase64; async function storeFileAsBase64() { const reader = new FileReader(); reader.onload = async (event) => { const startIndex = reader.result.toString().indexOf("base64,"); const copyBase64 = reader.result.toString().substr(startIndex + 7); chosenFileBase64 = copyBase64; }; const myFile = document.getElementById("file") as HTMLInputElement; reader.readAsDataURL(myFile.files[0]); }- メソッドは
insertSlidesFromBase64 を使用してスライドを挿入する
アドインは、 Presentation.insertSlidesFromBase64 メソッドを使用して、別の PowerPoint プレゼンテーションのスライドを現在のプレゼンテーションに挿入します。 次の簡単な例では、ソース プレゼンテーションのすべてのスライドが現在のプレゼンテーションの先頭に挿入され、挿入されたスライドはソース ファイルの書式設定を保持します。 chosenFileBase64これは、PowerPoint プレゼンテーション ファイルの base64 でエンコードされたバージョンを保持するグローバル変数です。
async function insertAllSlides() {
await PowerPoint.run(async function(context) {
context.presentation.insertSlidesFromBase64(chosenFileBase64);
await context.sync();
});
}
InsertSlideOptions オブジェクトを 2 番目のパラメーターとして に渡すことで、スライドを挿入する場所やソースまたはターゲットの書式設定を取得するかどうかなど、挿入結果のいくつかの側面をinsertSlidesFromBase64制御できます。 次に例を示します。 このコードについては、以下の点に注意してください。
- プロパティには、"UseDestinationTheme" と "KeepSourceFormatting" の 2 つの値
formattingがあります。 必要に応じて、列挙型 (例:PowerPoint.InsertSlideFormatting.useDestinationTheme) を使用InsertSlideFormattingできます。 - 関数は、 プロパティで指定されたスライドの直後に、ソース プレゼンテーションからスライドを
targetSlideId挿入します。 このプロパティの値は、nnn、mmmmmmm、#または nnn# mmm の 3 つの形式のいずれかからなる文字列です。nnn# はスライドの ID (通常は 3 桁) で、mmmmmmm はスライドの作成 ID (通常は 9 桁) です。 一部の例には、267#763315295、267#、および があります#763315295。
async function insertSlidesDestinationFormatting() {
await PowerPoint.run(async function(context) {
context.presentation
.insertSlidesFromBase64(chosenFileBase64,
{
formatting: "UseDestinationTheme",
targetSlideId: "267#"
}
);
await context.sync();
});
}
もちろん、通常、コーディング時にターゲット スライドの ID または作成 ID はわかりません。 より一般的には、アドインはユーザーにターゲット スライドの選択を求めます。 次の手順では、現在選択されているスライドの nnn# ID を取得し、それをターゲット スライドとして使用する方法を示します。
Common JavaScript API の Office.context.document.getSelectedDataAsync メソッドを使用して、現在選択されているスライドの ID を取得する関数を作成します。 次に例を示します。 の
getSelectedDataAsync呼び出しは Promise を返す関数に埋め込まれている点に注意してください。 これを行う理由と方法の詳細については、「 promise-returning 関数で Common-APIs をラップする」を参照してください。function getSelectedSlideID() { return new OfficeExtension.Promise<string>(function (resolve, reject) { Office.context.document.getSelectedDataAsync(Office.CoercionType.SlideRange, function (asyncResult) { try { if (asyncResult.status === Office.AsyncResultStatus.Failed) { reject(console.error(asyncResult.error.message)); } else { resolve(asyncResult.value.slides[0].id); } } catch (error) { reject(console.log(error)); } }); }) }メイン 関数の PowerPoint.run() 内で新しい関数を呼び出し、返される ID ("#" 記号と連結) をパラメーターのプロパティの
targetSlideIdInsertSlideOptions値として渡します。 次に例を示します。async function insertAfterSelectedSlide() { await PowerPoint.run(async function(context) { const selectedSlideID = await getSelectedSlideID(); context.presentation.insertSlidesFromBase64(chosenFileBase64, { formatting: "UseDestinationTheme", targetSlideId: selectedSlideID + "#" }); await context.sync(); }); }
挿入するスライドの選択
InsertSlideOptions パラメーターを使用して、挿入するソース プレゼンテーションのスライドを制御することもできます。 これを行うには、ソース プレゼンテーションのスライド ID の配列を プロパティに sourceSlideIds 割り当てます。 次に、4 つのスライドを挿入する例を示します。 配列内の各文字列は、 プロパティに使用されるパターンの 1 つまたは複数に targetSlideId 従う必要があることに注意してください。
async function insertAfterSelectedSlide() {
await PowerPoint.run(async function(context) {
const selectedSlideID = await getSelectedSlideID();
context.presentation.insertSlidesFromBase64(chosenFileBase64, {
formatting: "UseDestinationTheme",
targetSlideId: selectedSlideID + "#",
sourceSlideIds: ["267#763315295", "256#", "#926310875", "1270#"]
});
await context.sync();
});
}
注:
スライドは、配列に表示される順序に関係なく、ソース プレゼンテーションに表示される相対順序と同じ順序で挿入されます。
ユーザーがソース プレゼンテーションでスライドの ID または作成 ID を検出できる実用的な方法はありません。 このため、 プロパティは、コーディング時に sourceSlideIds ソース ID がわかっているか、アドインが実行時にいくつかのデータ ソースからそれらを取得できる場合にのみ使用できます。 ユーザーがスライド ID を記憶することは想定できないため、ユーザーがスライド (タイトルまたはイメージなど) を選択し、各タイトルまたは画像をスライドの ID に関連付ける方法も必要です。
したがって、 sourceSlideIds プロパティは主にプレゼンテーション テンプレートのシナリオで使用されます。アドインは、挿入できるスライドのプールとして機能する特定のプレゼンテーション セットを操作するように設計されています。 このようなシナリオでは、ユーザーまたは顧客が、選択基準 (タイトルや画像など) を、一連の可能なソース プレゼンテーションから作成されたスライド ID またはスライド作成 ID に関連付けるデータ ソースを作成および管理する必要があります。
Office Add-ins