Upgrade to Pro — share decks privately, control downloads, hide ads and more …

はじめてのActiveReportsJS（帳票デザインの基本編）/activereportsjs-design

Dcbf2269af2483cabf43128ad1718c11?s=47 グレープシティ 開発支援ツール
September 02, 2021
Programming
0
19

 はじめてのActiveReportsJS（帳票デザインの基本編）/activereportsjs-design

グレープシティのオンラインセミナー「はじめてのActiveReportsJS（帳票デザインの基本編）」のセッション資料です。

Dcbf2269af2483cabf43128ad1718c11?s=128

グレープシティ 開発支援ツール

September 02, 2021
Tweet

More Decks by グレープシティ 開発支援ツール

See All by グレープシティ 開発支援ツール
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
51
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
27
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
35
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
32
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
15
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
18
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
15
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
49
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
260

Other Decks in Programming

See All in Programming
98df8bb11748bb59fef1aa1e474e8e02?s=48 komofr
0
130
89b8f4a7429270308ac301bf7605f974?s=48 olafurw
0
370
F74146bada61d15a5e652919815bd355?s=48 satoki
0
320
3cb4e761dbdb7aebd1ffd85f752e1e3e?s=48 sonatard
0
510
Ba655e3712aaabfbca289fe136f85fe4?s=48 qnighy
0
140
744f1c2c6cbea2ff5104b0ac512936bd?s=48 hpgrahsl
0
140
7eca3e06edc3c69004aaf57de51900c2?s=48 ajstarks
3
4.2k
5c588fdfe782f92fa6b081903edd82bb?s=48 hr01
1
6.5k
44df43ecb9d8ae00cafee6b804db3fcd?s=48 kentatada
2
220
42a6a049ac8f5265f31858a9509217fb?s=48 uhooi
3
180
Fb0a40e5e7a9dc85520f1646fd41eb44?s=48 higuuu
0
170
5879390889652a11c811fec9147588af?s=48 nhiguchi
0
120

Featured

See All Featured
7653c7c449918ff6542880a8c284f5e7?s=48 jponch
106
5.4k
Fe6b81005d1553accd6b2a28f6a2bef1?s=48 phodgson
92
4.2k
Ba530e786553390f3fb271848485681c?s=48 3n
169
23k
3d6ace9554821d552146413bcdf874f6?s=48 trishagee
37
5k
C7393b7ba7ec9c8890dd77d209fbb3c9?s=48 maltzj
504
37k
Fde6c3a50ca518a909ef35c22c0ee0e4?s=48 destraynor
224
48k
A0517b08532aec8ab2aae3f65d40ad86?s=48 hannesfritz
32
1.1k
5f83ef806155b403c3393160ce51f955?s=48 jlugia
218
16k
3d4519fd34b76fb265fc0237f3792bd4?s=48 danielanewman
208
20k
48c098b6579220a67a6ba949be6e4b5a?s=48 revolveconf
204
10k
F68cb25ae3e5c2106997454b13b7737d?s=48 brad_frost
162
6.9k
F716e5f737fcfb03f2cf8d1a184f1dbe?s=48 nonsquared
84
3.7k

Transcript

  1. はじめてのActiveReportsJS（帳票デザインの基本編） グレープシティ株式会社 ツール事業部 プロダクトマーケティングチーム 福井潤之

  2. 2 GrapeCity Developer Solutions ActiveReportsJSのご紹介

  3. ActiveReportsJS 3 GrapeCity Developer Solutions 帳票開発ツール「ActiveReports」の DNAを受け継ぐ、モダンWeb開発に対応した 「帳票開発支援JavaScriptライブラリ」 クライアントサイドで 帳票生成

    Windows／Macで 使えるデザイナ マルチブラウザ対応の ビューワ

  4. ActiveReportsJSでの帳票開発の流れ 4 GrapeCity Developer Solutions 1. 付属の帳票デザイナでレポートファイルを作成 2. 表示するデータをJSONフォーマットで作成する 3.

    レポートファイルをブラウザ上で実行し、 作成された帳票を、帳票ビューワで閲覧、各種形式への保存、印刷

  5. 5 GrapeCity Developer Solutions ActiveReportsJSデザイナのご紹介

  6. ActiveReportsJSデザイナ 6 GrapeCity Developer Solutions ツールバーで 簡単レイアウト Windows / Mac

    対応 豊富なレポートコントロール 直感的に使える プロパティグリッド デザイナ上で 直接プレビューが可能

  7. 18種類のレポートコントロール 7 GrapeCity Developer Solutions • TextBox • TableOfContents •

    CheckBox • Container • Line • Shape • InputField • Bullet • Image • Barcode • Tablix • Sparkline • SubReport • OverflowPlaceHolder • List • Table • BandedList • Chart データ領域コントロール

  8. データバインディング 8 GrapeCity Developer Solutions APIだけでなく、 埋め込みやファイル形式にも対応 データソースはJSON形式で設定します ヘッダやクエリパラメータの 設定にも対応

    各レポートコントロールとのバイン ディングもGUIでらくらく APIのURIを指定 パラメータで動的に変更も可能

  9. 日本仕様 9 GrapeCity Developer Solutions

  10. 選べる2つのレポート形式 10 GrapeCity Developer Solutions • 印刷結果とまったく同じレイアウトで帳票を デザインできる • 出力される帳票のレイアウトはデータの量に

    応じて変化 • 日本に多い定型のレイアウトを作成するのに最適 • 印刷よりもアプリケーション上でプレビューする 用途に最適

  11. 11 GrapeCity Developer Solutions デモ

  12. デモで作成する請求書 12 GrapeCity Developer Solutions

  13. アプリケーションへの組み込みもわずかなコードで 13 GrapeCity Developer Solutions <body onload="load()"> <div id="Viewer" style="height:

    100vh"></div> <script> function load() { const viewer = new ActiveReports.Viewer('#Viewer', { language: 'ja' }); viewer.open('./reports/test.rdlx-json'); } </script> </body>

  14. 本日のまとめ 14 GrapeCity Developer Solutions 帳票のレイアウトにあわせて最適なデータ領域コントロールを選択する 1 2 3 動的な制御や集計処理には「式」を使用する

    グループ化でキー項目ごとにデータをまとめた帳票を作成する

  15. Webで技術情報を公開中 15 GrapeCity Developer Solutions CodeZine GrapeCity.devlog (https://codezine.jp/article/corner/823) (https://devlog.grapecity.co.jp/archive/category/ActiveReportsJS)

  16. セミナーの内容や製品に関するご質問・ご相談を承っています 16 GrapeCity Developer Solutions お問い合わせ グレープシティ株式会社 ツール事業部 営業部 製品に関するご相談を

    オンライン形式で承っています。 • より詳しい製品のご紹介 • 勉強会の開催 など、柔軟にご対応可能です。 セミナーの内容に関してご質問がある方は グレープシティ営業部までお気軽に お問い合わせください。 050-5490-4661 sales@grapecity.com

  17. END セミナー受講、誠にありがとうございました。