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

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

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

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

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

Dcbf2269af2483cabf43128ad1718c11?s=128

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

September 02, 2021
Tweet

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

See All by グレープシティ 開発支援ツール
あなたの会社の古いシステム、なんとかしませんか？～システム刷新から考えるDX化への道筋とバリエーション～/webinar20220420-systems
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
110
あなたの会社の古いシステム、なんとかしませんか？～システム刷新から考えるDX化への道筋とバリエーション～/webinar20220420-grapecity
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
120
不安なあなたにおくるエンジニアのキャリア形成ガイド/Developers Boost 2021
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
46
日本の入力をしっかりサポートするInputManJS講座/inputmanjs-supports-japanese-input
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
84
ActiveReports最新バージョン「14.0J」移行のポイントを解説/activereports-migration
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
110
よくわかるグレープシティのJavaScriptラインナップ/grapecity-javascript-lineup
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
70
帳票作成をもっと簡単に！用途で選ぶグレープシティの帳票開発ツール/grapecity-reporting-tools
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
49
スクラッチ開発を全方向でサポートするグレープシティ開発支援ツール/scratch-developertools
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
21
SPREAD活用テクニック（データ入力・バインド・インポート編）/spread-technique
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
66

Other Decks in Programming

See All in Programming
Node.js 最新動向 TFCon 2022
D76231a2114896dfcc7b79ac69558b79?s=48 yosuke_furukawa
PRO
4
2.3k
Where and how to run UI tests (Droidcon London, 2021)
E20836b1ea89956e0b96362046e2b564?s=48 nonews
0
200
Develop your CI tools
Cf95f93e78f6d6dd0630049396f723c6?s=48 xgouchet
2
180
Groovy Roadmap
4578d99b560b2a470e05288ef6766ac2?s=48 paulk
7
13k
Microsoft Teams の 会議アプリ開発のはじめかた / How to start Microsoft Teams app development
9cdd446fb259ec93e52d4388f60197f8?s=48 karamem0
0
1.3k
LOWYAの信頼性向上とNew Relic
F95bdf0d9003fa506a9f7448335da1af?s=48 kazumax55
4
280
Web API 開発を加速しよう - Avanade Beef のご紹介 / Accelerate your web API - development introducing Avanade Beef
9cdd446fb259ec93e52d4388f60197f8?s=48 karamem0
0
280
Named Document って何？
4cda705b5eecbba889fb97ce9f374efe?s=48 harunakano
0
140
Android入門
180bbdf8267422d5814fd498ecea043a?s=48 hn410
0
300
Securing Kafka Connect Pipelines with Client-Side Field Level Cryptography @ Kafka Summit London 2022
744f1c2c6cbea2ff5104b0ac512936bd?s=48 hpgrahsl
0
300
tfcon2022_Web3Dひとめぐり.pdf
40cb25d36e6838fae4e925bc038a5a0d?s=48 emadurandal
0
390
WindowsコンテナDojo：第2回 Windowsコンテナアプリのビルド、公開、デプロイ
E5eb221d34d4ffbe973f8542b4c3a00e?s=48 oniak3ibm
PRO
0
120

Featured

See All Featured
The Mythical Team-Month
E6c6e133e74c3b83f04d2861deaa1c20?s=48 searls
208
39k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
B3d6434763caa0ef5dc4b792662c49f7?s=48 smashingmag
237
19k
CSS Pre-Processors: Stylus, Less & Sass
7559f6cff1f5efc2d210965febd4d71c?s=48 bermonpainter
349
27k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
103
16k
Thoughts on Productivity
A16eb159db895e3b01d3dc95767ad595?s=48 jonyablonski
43
2.2k
How GitHub (no longer) Works
78b475797a14c84799063c7cd073962f?s=48 holman
296
140k
Fight the Zombie Pattern Library - RWD Summit 2016
9fa239b3154a0169d99ab7bf1422dd12?s=48 marcelosomers
226
15k
Dealing with People You Can't Stand - Big Design 2015
44b54d2ffcb7857004071cc6795dde11?s=48 cassininazir
350
21k
Why You Should Never Use an ORM
88bc30284c6a424b63a92aad27d0ba36?s=48 jnunemaker
PRO
47
5.5k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
5b9fe87ec1faa67a4599782930f45ec9?s=48 sstephenson
151
12k
Debugging Ruby Performance
D47656e20ff5e42f125fc5ea0fd636c6?s=48 tmm1
65
10k
Teambox: Starting and Learning
Aebc2d07a50011e2a30d38435fde564a?s=48 jrom
121
7.6k

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 セミナー受講、誠にありがとうございました。