[{"id":"08e0fe96-3025-463b-bcee-87f4b29c462b","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"0d5035e7-1a53-4dc5-b32e-9ce261bfa47e","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"2fb2b485-f567-436c-9ca9-06dd71ceadb3","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"c1466f0c-9710-41d3-9812-c7321630328a","tags":[{"product":null,"links":null,"id":"e1d31134-0bda-4c05-bee0-b1f21f82940b","name":"new","color":"#00A273","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"b0e616b5-b520-405e-b108-e81363a8dd74","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"f5712fda-d364-4652-9783-3073e2560b97","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"8f03c498-1e02-459a-a6de-ee619033d6d2","tags":[{"product":null,"links":null,"id":"92283933-94f9-4e9a-8d93-15ba4ec8b3ec","name":"upd","color":"#7e678a","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"2b701643-01a1-40e0-b49b-0a6e93c1f847","tags":[{"product":null,"links":null,"id":"e1d31134-0bda-4c05-bee0-b1f21f82940b","name":"new","color":"#00A273","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]},{"id":"07b4f367-7ddc-4c8a-932c-b180f112364e","tags":[{"product":null,"links":null,"id":"e1d31134-0bda-4c05-bee0-b1f21f82940b","name":"new","color":"#00A273","productId":"77f3d9a0-2c87-4130-b77a-b94ccf13e3cb"}]}]
        
(Showing Draft Content)

インストール

ActiveReportsJSは、クロスプラットフォームのデザイナアプリケーション、およびいくつかのJavaScriptライブラリから構成されています。 このトピックでは、各コンポーネントの概要とそのインストール手順について説明します。

インストールするパッケージ

WindowsmacOS のパッケージを提供しています。使用しているOSに対応するパッケージをダウンロードして、アーカイブを抽出します。

レポートを作成するデザイナアプリ

デザイナアプリは、Electronで構築されたクロスプラットフォームのデスクトップアプリケーションであり、レポートの作成に使用できます。 詳細については、レポート作成者ガイド を参照してください。


インストーラは、ダウンロードしたインストールパッケージのdesignerフォルダにあります。


製品をインストール後30日間、製品評価を目的にご利用頂けます。

コアライブラリ

このライブラリにはコア機能が含まれ、アプリケーションのコード内で使用できるいくつかの を公開しています。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。 この場合、 package.jsonファイルの依存関係リストに@mescius/activereportsjsのnpmパッケージを追加することができます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdistフォルダにあるar-js-core.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-core.js

※「X.X.X」にはバージョン番号が入ります

PDFエクスポートライブラリ

このライブラリには、レポートをPDFでエクスポートするコードが含まれています。詳細については、エクスポート を参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。 この場合、 package.jsonファイルの依存関係リストにPDFエクスポート機能を含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdistフォルダにあるar-js-pdf.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-pdf.js

※「X.X.X」にはバージョン番号が入ります

XLSXエクスポートライブラリ

このライブラリには、レポートをXLSX形式でエクスポートするコードが含まれています。詳細については、エクスポート を参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。 この場合、package.jsonファイルの依存関係リストにXLSXエクスポート機能を含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdistフォルダにあるar-js-xlsx.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。

https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-xlsx.js

※「X.X.X」にはバージョン番号が入ります

HTMLエクスポートライブラリ

このライブラリには、レポートをHTML形式でエクスポートするコードが含まれています。詳細については、エクスポート を参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。 この場合、package.jsonファイルの依存関係リストにHTMLエクスポート機能を含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージの distフォルダーにあるar-js-html.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。

https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-html.js

※「X.X.X」にはバージョン番号が入ります

CSVデータエクスポートライブラリ

このライブラリには、レポートをCSVデータ(CSV)形式でエクスポートするコードが含まれています。詳細については、エクスポート を参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。 この場合、package.jsonファイルの依存関係リストにCSVデータエクスポート機能を含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージの distフォルダーにあるar-js-tabular-data.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。

https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-tabular-data.js

※「X.X.X」にはバージョン番号が入ります

帳票ビューワ

このライブラリには、帳票ビューワコンポーネントが含まれています。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、package.jsonファイルの依存関係リストにビューワコンポーネントを含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdistフォルダにあるar-js-viewer.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-viewer.js

※「X.X.X」にはバージョン番号が入ります

Angular用の帳票ビューワ

このライブラリには、Angular用の帳票ビューワコンポーネントが含まれています。


Angularアプリケーションで使用するには、package.jsonファイルの依存関係リストに@mescius/activereportsjs-angularのnpmパッケージを追加します。


Angular用の帳票ビューワについては、Angularを参照してください。

React用の帳票ビューワ

このライブラリには、React用の帳票ビューワコンポーネントが含まれています。


Reactアプリケーションで使用するには、package.jsonファイルの依存関係リストに@mescius/activereportsjs-reactのnpmパッケージを追加します。


React用の帳票ビューワについては、Reactを参照してください。

Vue用の帳票ビューワ

このライブラリには、Vue用の帳票ビューワコンポーネントが含まれています。


Vueアプリケーションで使用するには、package.jsonファイルの依存関係リストに@mescius/activereportsjs-vueのnpmパッケージを追加します。


Vue用の帳票ビューワについては、Vueを参照してください。

Svelte用の帳票ビューワ

このライブラリには、Svelte用の帳票ビューワコンポーネントが含まれています。


Svelteアプリケーションで使用するには、package.jsonファイルの依存関係リストに@mescius/activereportsjs-svelteのnpmパッケージを追加します。


Svelte用の帳票ビューワについては、Svelteを参照してください。

Webデザイナコンポーネント

このライブラリには、Webデザイナコンポーネントが含まれています。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、 package.jsonファイルの依存関係リストに、Webデザイナコンポーネントを含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdistフォルダにあるar-js-designer.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/ar-js-designer.js

※「X.X.X」にはバージョン番号が入ります

帳票ビューワのローカライゼーションライブラリ

ActiveReportsJSには、ビューワのUIを中国語と日本語で表示するローカライゼーションモジュールが含まれています。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、package.jsonファイルの依存関係リストに、言語用のリソースを含む@mescius/activereportsjs-i18nのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdist\localesフォルダにあるar-js-locales.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/locales/ar-js-locales.js

※「X.X.X」にはバージョン番号が入ります

帳票デザイナのローカライゼーションライブラリ

ActiveReportsJSには、デザイナのUIを中国語と日本語で表示するローカライゼーションモジュールが含まれています。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、package.jsonファイルの依存関係リストに、言語用のリソースを含む@mescius/activereportsjs-i18nのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのdist\locales\designerフォルダにあるja-locale.jsおよびzh-locale.jsスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。


https://cdn.mescius.com/activereportsjs/X.X.X/dist/locales/designer/ja-locale.js

https://cdn.mescius.com/activereportsjs/X.X.X/dist/locales/designer/zh-locale.js

※「X.X.X」にはバージョン番号が入ります

帳票ビューワのUIテーマ

ActiveReportsJSには、帳票ビューワコンポーネント用のさまざまなUIテーマが用意されています。詳細については、テーマを参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、package.jsonファイルの依存関係リストに、帳票ビューワのテーマを含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのstylesフォルダにあるar-js-ui.cssar-js-viewer.cssdark-yellow-ui.cssdark-yellow-viewer.cssgreen-ui.cssgreen-viewer.csslight-blue-ui.css、およびlight-blue-viewer.cssスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/ar-js-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/ar-js-viewer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/dark-yellow-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/dark-yellow-viewer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/green-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/green-viewer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/light-blue-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/light-blue-viewer.css

    ※「X.X.X」にはバージョン番号が入ります

帳票デザイナのUIテーマ

ActiveReportsJSには、レポートデザイナコンポーネント用のさまざまなUIテーマが用意されています。詳細については、テーマを参照してください。


webpackなどのモジュールバンドラーを使用してコンパイルするアプリケーションでActiveReportsJSを使用する場合があるとします。この場合、package.jsonファイルの依存関係リストに、帳票デザイナのテーマを含む@mescius/activereportsjsのnpmパッケージを追加できます。


PureJSアプリケーションには、ダウンロードしたインストールパッケージのstylesフォルダにあるar-js-ui.cssar-js-viewer.cssdark-yellow-ui.cssdark-yellow-designer.cssgreen-ui.cssgreen-designer.csslight-blue-ui.css、およびlight-blue-designer.cssスクリプトへの参照を含めることができます。


または、このスクリプトはCDNから入手できます。

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/ar-js-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/ar-js-designer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/dark-yellow-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/dark-yellow-designer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/green-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/green-designer.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/light-blue-ui.css

  • https://cdn.mescius.com/activereportsjs/X.X.X/styles/light-blue-designer.css

    ※「X.X.X」にはバージョン番号が入ります