Office アドイン

[Officeアドイン]テーブルやグラフを作成する方法(Excel)

お久しぶりのOffice アドインの記事です。
注目している人はほとんどいませんが、Excel JavaScript APIのリリース予定を見れば分かる通り、Office アドインは常に進化し続けており、できることも少しずつ増えています。

今回は、「Office アドインでこんなことできるよ」という一例の紹介として、テーブルやグラフを作成してみます。
(本当はonActivatedイベントとかを試したかったのですが、2017年8月時点だとまだAPIがリリースされておらず、試すことができませんでした)

マニフェスト

※ Id要素やSourceLocation要素のDefaultValue属性の値等は適当に変更してください。

<?xml version="1.0" encoding="UTF-8"?>
<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:type="TaskPaneApp">
  <Id>3648a44b-1eef-42fc-a713-eb78549613b8</Id>
  <Version>1.0</Version>
  <ProviderName>@kinuasa</ProviderName>
  <DefaultLocale>ja-jp</DefaultLocale>
  <DisplayName DefaultValue="Sample Add-in" />
  <Description DefaultValue="Sample Add-in"/>
  <Hosts>
    <Host Name="Workbook" />
  </Hosts>
  <AppDomains>
    <AppDomain>https://login.microsoftonline.com</AppDomain>
  </AppDomains>
  <DefaultSettings>
    <SourceLocation DefaultValue="https://localhost/sample/index.html" />
  </DefaultSettings>
  <Permissions>ReadWriteDocument</Permissions>
</OfficeApp>

コード(index.html)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <title>Sample</title>
    <link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.components.min.css">
    <style>
      #content-main {
        background: #ffffff;
        position: fixed;
        top: 80px;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: auto;
      }
    </style>
    <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.2.1.min.js"></script>
    <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
    <script src="https://unpkg.com/core-js/client/core.min.js"></script>
    <script src="https://unpkg.com/@microsoft/office-js-helpers@0.7.4/dist/office.helpers.min.js"></script>
    <script src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/js/fabric.min.js"></script>
    <script>
      Office.initialize = function(reason){
        $(document).ready(function(){
          $("#run").click(run);
        });
      };
      
      function run(){
        try{
          Excel.run(function(context){
            //const sheet = OfficeHelpers.ExcelUtilities.forceCreateSheet(context.workbook, "Sample");
            const sheet = context.workbook.worksheets.add("Sample"); //シート追加
            
            //テーブル作成
            const tbl = sheet.tables.add("A1:C1", true);
            tbl.getHeaderRowRange().values = [["A", "B", "C"]];
            tbl.rows.add(null, [
              [10, 20, 30],
              [11, 21, 31],
              [12, 22, 32],
              [13, 23, 33],
              [14, 24, 34],
            ]);
            
            //グラフ作成
            const chart = sheet.charts.add("ColumnClustered", tbl.getRange(), "Auto");
            chart.title.text = "テスト用グラフ";
            chart.setPosition("A8");
            chart.legend.position = "right"
            chart.legend.format.fill.setSolidColor("white");
            chart.dataLabels.format.font.size = 15;
            chart.dataLabels.format.font.color = "black";
            sheet.activate();
            return context.sync();
          }).then(function(){
            OfficeHelpers.UI.notify("", "Success", "success");
          });
        }catch(error){
          OfficeHelpers.UI.notify(error);
        }
      }
    </script>
  </head>
  <body>
    <div id="content-main">
      <button id="run" class="ms-Button">
        <span class="ms-Button-label">Run Code</span>
      </button>
    </div>
  </body>
</html>

実行画面

アドインを読み込んで「Run Code」ボタンをクリックすると、「Sample」シートが追加され、シート上にテーブルとグラフが作成されます。

Web連携を得意とするOffice アドインでWeb上のデータを取り込み、Excelシートにグラフとして出力して視覚化する等、グラフが作成できるだけでも、Office アドインを活用し得る場面は多々あると思います。

関連Webページ

ヘッドレス ChromeをSeleniumから動かしてみました。前のページ

ExcelとPowerPointに自動保存機能が追加されました。次のページ

関連記事

  1. Office関連

    Adobe Reader XIを利用してPDFファイルのページ数を取得するVBAマクロ

    先日Adobe Readerを利用してPDFファイルのページ数を取得す…

  2. アイコン一覧

    Office 365アイコン(imageMso)一覧(E)

    Office 365のデスクトップ版Officeアプリケーション(Wo…

  3. Office関連

    手軽に参照設定するためのVBAアドイン

    thom氏のブログで面白い記事がありました。・VBA 参照…

  4. アイコン一覧

    Office 365アイコン(imageMso)一覧を作成するにあたって

    Office 2013のアイコン一覧を公開してから4年ほど経ち、その間…

  5. Office関連

    Excelを使わずにCSVからExcelファイルに変換するPowerShellコード

    CSVファイルからExcelファイルに変換する処理を自動化したい、Ex…

コメント

  • コメント (0)

  • トラックバックは利用できません。

  1. この記事へのコメントはありません。

Time limit is exhausted. Please reload CAPTCHA.

※本ページはプロモーションが含まれています。

Translate

最近の記事

アーカイブ

PAGE TOP