ilog elixir 製品概要fxug.net/archives/study_mtg_40/elixirj.pdf7 つのモジュール: 3d...

ILOG Elixir

製品概要

Internal ILOG Document

1

アイログについて

Changing the rules of business� 市場のリーダー

� ビジネス･ルール、最適化、可視化

� 信頼される実績

� 1987年創立

� 2,500以上の顧客

� 株式公開企業 (NASDAQ)

2008/4/25 Internal ILOG Document 2

� 株式公開企業 (NASDAQ)

� 売上高 1億7,500 万ドル (TTM)

� 全世界に展開

� 米国とフランスに本社

� 全世界に900人以上の従業員

� 30か国で事業運営

� Adobe FlexおよびAIR向けデータ表示用コンポーネント� リリース: 2008年、2月25日

� 製品情報: http://elixir.ilog.com

� Windows、Mac、Linux版、英語版と日本語版

� アイログとAdobeの関係� アイログが開発、所有

ILOG Elixir –製品の概要


� アイログがOEM提供

� エンドユーザ・ライセンスをAdobeが販売www.adobe.com/go/buyilogelixir

� リソースの提供� ブログ: http://blogs.ilog.com/elixir

� フォーラム: http://forums.ilog.com/elixir/

� JIRAバグベース: http://elixir-bugs.ilog.com

� 7 つのモジュール:

� 3Dチャート

� レーダーチャート

� ゲージとダイヤル

�地図

ILOG Elixir –製品の概要


�

�組織図

� ガント形式リソース・チャート

� ツリーマップ

� Adobe Flex Builderとの緊密

な統合

Flex Builderとの統合

� コンポーネント・パレット

から全コンポーネントを

利用可能

� デザイン・ビューへ簡単


� デザイン・ビューへ簡単

にドラッグ

� 設定の一部がプロパ

ティ・ビューで操作可能

3Dチャート


� Adobe 2Dチャートを継承して3D化

� 3Dチャート描画エンジン

� 折れ線、面グラフ、棒グラフ、積上げ棒グラフ、円グラフ

� 正投影、斜投影

� 直方体レンダリング、円柱レンダリング

3Dチャート


� 直方体レンダリング、円柱レンダリング

� 3D視点設定と照明

� 表示規模

� ユーザ操作可能なアイテムを300個

� 静止表示なら2,000個

3Dチャート – コーディング例

<ilog:BarChart3D dataProvider="{myData}"

elevationAngle="30">

<ilog:horizontalAxis>

<mx:CategoryAxis categoryField="country"/>

</ilog:horizontalAxis>


</ilog:horizontalAxis>

<ilog:series>

<ilog:BarChart3D yField="GDP" form="cylinder"/>

</ilog:series>

</ilog:BarChart3D>

ゲージとダイヤル


� 用途例: ダッシュボードでKPIを表示

�生産管理および財務管理、その他のダッシュボード

� モニタリング (データ表示)

�制御 (データ入力)

ゲージとダイヤル


� 必要機能

� すばやいカスタマイズが可能なフレームワーク

� ゲージとダイヤルが作成済み

�円形、扇形、棒状、つまみ

�ルックアンドフィールの統一性とアニメーション

ゲージとダイヤル – コーディング例

<ilog:SimpleCircularGauge value="{speed}"

minimum="0" maximum="100"

startAngle="225" endAngle="315" />

<ilog:SimpleKnob value="{choice}"


categories="['monitor1', 'monitor2', 'monitor3']"

liveDragging="true" />

<ilog:SimpleVerticalGauge value="{power}"

minimum="100" maximum="100" />

ゲージとダイヤル – コーディング例

<ilog:RectangularGauge>

<ilog:scales>

<ilog:RectangularLogScale minimum="1" maximum="10000"/>

<ilog:scales>

<ilog:elements>

<ilog:RectangularLabelRenderer text="{a_value}"

area="left" />


<ilog:RectangularTrack minimum="1000"

maximum="10000"/>

<ilog:RectangularScaleRender tickPlacement="trailing"

majorTickRenderer="BeautifulTickRenderer"/>

<ilog:MarkerRender shape="arrow" value="{a_value}"/>

</ilog:elements>

</ilog:RectangularGauge>

地図


� 用途例: 各種ダッシュボード� マップ上にKPI表示 (GIS画面ではなく)

� 領域を名称別にカラーコードで塗り分け

� 各領域にFlexオブジェクトをオーバーレイ配置

� 必要機能

ダッシュボード用地図


� 必要機能� 9種類の作成済みマップ

� エリア単位または地理的位置 (経緯度) により、どのようなFlexオブジェクトでもオーバーレイ可能

� カスタム・マップをインポートするツールセット� ESRI Shape形式のエリアマップのインポート� 地図の簡略化/一般化� Flex用コンポーネントとしてのエクスポート

� アニメーション

ダッシュボード用地図– コーディング例

public var data:Array = [

{ key : "CA", population : 38, name : "California"},

{ key : "NY", population : 19, name : "New York"}

];

public var function fillFunction(population:Number):IFill {


if (population > 20) {

return new SolidColor(0xff0000);

} else {

return new SolidColor(0x00ff00);

}

}

ダッシュボード用地図– コーディング例

<ilog:USStates>

<mx:Repeater dataProvider="{statesData} id="r">

<ilog:MapFeature key="{r.currentItem.key}"

fill="{fillFunction(r.currentItem.population)}">

<mx:Label text="{r.currentItem.name}"/>


<mx:Label text="{r.currentItem.name}"/>

</ilog:MapFeature>

</mx:Repeater>

</ilog:USStates>

リソース・チャート


� 用途例: スケジューリング

� 人員、運送車輌、設備等のリソースの稼働状況を時間軸を

ベースに確認・監視可能

� タスク間の依存性を反映させたMS Projectのようなプロジェクト管理と

は異なる

リソース・チャート


は異なる

� 必要機能

� リソースのツリー・テーブル

� ズームすると時間軸に関する表示スケールが自動的に変わり、そのス

ケールに応じた適切なスケジュール表示を実現


リソース・チャート – コーディング例

<mx:Script>

public var resources:Array = [

{ id : "R1", name : "Erwan" }

];

public var tasks:Array = [


{ resourceId : "R1", name : "Market Study", startTime :

"1/14/2008 8:0:0", endTime: "2/14/2008 17:0:0" },

{ resourceId : "R1", name : "Product Definition",

starttime : "2/15/2008 8:0:0", endTime : "4/1/2008

17:0:0" }

];

</mx:Script>

リソース・チャート – コーディング例

<ilog:ResourceChart resourceDataProvider="{resources}"

taskDataProvider="{tasks}">

<ilog:ganttSheet>

<ilog:taskItemRenderer>

<mx:Component>


<my:BeautifulTaskRenderer/>

</mx:Component>

</ilog:taskItemRenderer>

</ilog:ganttSheet>

</ilog:ResourceChart>

組織図


� 用途例: 企業ポータル

�従業員データベースの検索操作用

� 必要機能

組織図


� シングル・レポートライン

� すべての項目で同一情報

(電話、メールなど)

�項目の詳細をユーザ定義可能

組織図 – コーディング例

<mx:Script>

private var data:XML =

<employee name="John Bernard" position="CEO"

location="Mountain View">

<employee name="Chris Hugon" position="CTO"


<employee name="Chris Hugon" position="CTO"

location="Sunnyvale">

<employee name="Janet Brioude" position="CFO"

location="New York City"/>

</employee>

</mx:Script>

組織図 – コーディング例

<ilog:OrgChart dataProvider="{data}>

<ilog:itemRenderer>

<mx:Component>

<my:BeautifulOrgChartRenderer/>


</mx:Component>

</ilog:itemRenderer>

</ilog:OrgChart>

レーダーチャート


� Adobe 2Dチャートを継承可能

� 描画機能

� 直線または曲線、縦棒形式

� 塗りつぶしをする/しないの選択

レーダーチャート


� 複数放射軸

� 操作性

� アニメーション機能

� マウス操作で簡単に情報表示

レーダーチャート – コーディング例

<ilog:RadarChart dataProvider="{myData}"

showDataTips="true">

<ilog:angularAxis>

<ilog:AngularAxis categoryField="country"/>

</ilog:angularAxis>


</ilog:angularAxis>

<ilog:series>

<ilog:RadarLineSeries dataField="GDP"/>

</ilog:series>

</ilog:RadarChart>

ツリーマップ


� 用途例: 視覚的な分析

�大規模データセットを視覚により探索

� データ・クラスタのドリルダウン

� 必要機能

ツリーマップ


� 必要機能

�大規模データセットをサポート (項目数が何千件)

� ユーザ定義可能な配色


ツリーマップ – コーディング例

<ilog:TreeMap dataProvider="{treeData}"

id="tmap" algorithm="alternating"

colorScheme="div-red-green"

colorField="@gdp" areaField="@population"

itemDoubleClick="launchAction()"


itemDoubleClick="launchAction()"

/>

<ilog:TreeMapLegend dataProvider="{tmap}"/>

<mx:Label text="{tmap.selectedItems[0].name}"/>

� ILOG Elixir とは

� Flex 3 用コンポーネント・ライブラリであり、Flex、AIR、ColdFusion アプリ

ケーションに対応

� 開発者向け

� 高度な視覚性が必要なアプリケーションに最適

� 3Dチャート、ゲージ、レーダーチャート、地図を装備したダッシュボード

ILOG Elixir – まとめ


� 3Dチャート、ゲージ、レーダーチャート、地図を装備したダッシュボード

� ツリーマップと3Dチャートによる視覚的分析

� 組織図を備えた企業ポータル

� リソース・チャートによるリソースのスケジューリング

� Flex 3 と同時にリリース (2008年、2月25日)

� 製品情報： http://elixir.ilog.com

� 日本での連絡先：[email protected]

ilog elixir 製品概要fxug.net/archives/study_mtg_40/elixirj.pdf7 つのモジュール: 3d...

Documents