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関連

    セル内の改行をカウントするExcelマクロ

    「Excel セルの内容 改行を数える VBA」といったキーワード検索…

  2. Office関連

    Excel 2013 新関数一覧

    「関数一覧(Excel 2010)」と「関数一覧(Excel 2013…

  3. Office関連

    PowerShellからNetOfficeを使ってExcelを操作する方法

    先日、Excel MVPの伊藤さんがPowerShellからExcel…

  4. Office関連

    Office 2016関連資料のリンク

    Office 2016関連資料のリンクをメモしておきます。特に「O…

  5. Windows 10

    Microsoft Edgeを操作するVBAマクロ(WebDriver編)

    Microsoft Edge Dev Blogに「Bringing a…

  6. Office アドイン

    “Apps for Office”から“Office Add-ins”に、“Napa”もOffice…

    久しぶりにOffice 用アプリに関する話題です。「Off…

コメント

  • コメント (0)

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

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

Time limit is exhausted. Please reload CAPTCHA.

最近の記事

アーカイブ

PAGE TOP