この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

レイアウトの仕様

“layouts” セクションは、モバイルデバイスのダッシュボードの表示方法をカスタマイズするために使用されます。

ダッシュボードの JSON ファイルの “layouts” セクションは、“widgets” セクションの子で、“state” および “steps” セクションの兄弟です。次に、典型的な “layouts” セクションの例を示します。

1"layouts": {
2 "default": {
3  "page:0": [
4   "widget_name_1",
5   "widget_name_2"
6  ],
7  "page:1": [
8   "widget_name_3 | widget_name_4",
9   "widget_name_2 {attribute=2}"
10  ]
11 },
12 “device:ipad, orientation:landscape”:{
13  “page:0”: [
14   “widget_name_1 | widget_name_3 | widget_name_4 | row: {attribute=300}”,
15   “widget_name_2 {widget_name=3}”
16  ]
17 }
18}

前述の例の widget_name は、JSON ファイルの “widgets” セクションで指定される特定のウィジェットを参照します。属性 は、「レイアウト属性の参照」に記載されているいずれかの属性を参照します。セルはパイプ文字 ( | ) で区切られます。カンマ ( , ) で区切ってセルに複数のウィジェットを含めることができます。行は、引用符で囲まれた文字列 (引用符で囲まれた各文字列は 1 行) の外側のカンマ ( , ) で区切られます。

簡単な layouts セクション

次に、1 のページに 1 つの列、4 つの行、4 つのウィジェットがある簡単な “layouts” セクションを示します。

1"layouts": {
2 "default": {
3  "page:0": [
4   "buttongroup_1",
5   "dimfilter_1",
6   “dimfilter_2”,
7   “chart_1”
8  ]
9 }
10}

複雑な layouts セクション

複雑な “layouts” セクションを使用して、デバイス固有および方向固有の表示ルールを設定できます。次の “layouts” セクションでは、2 つのページでダッシュボードのウィジェットをレイアウトします。最初のページの最初の行の高さは 300 ピクセルです。2 番目のページには、2 つの行と 2 つの列があります。最初の行のセルの 1 つに 2 つのウィジェットが含まれます。ボックスウィジェットの 1 つに 3 つの属性セットがあります。グラフウィジェットは 2 つの列にまたがります。横モードの iPad でダッシュボードが表示される場合、2 つの行がある 1 つのページのみが表示されます。最初の行には 3 つのウィジェットがあり、2 番目の行には 3 つの列にまたがる 1 つのウィジェットがあります。

1"layouts": 
2{
3 "default": {
4  "page:0": [
5   "buttongroup_2 | row: {height=300}",
6   "chart_1"
7  ],
8  "page:1": [
9   "dimfilter_1, box_1 {colspan=2, rowspan=2, zIndex=-1, vpad=5, hpad=5} |
10      dimfilter_2”,"chart_1 {colspan=2}"
11  ]
12 },
13 “device:ipad, orientation:landscape”:{
14  “page:0”: [
15   “dimfilter_1, box_1 {colspan=2, rowspan=3, zIndex=-1, vpad=5, hpad=5} | dimfilter_2 |
16      buttongroup_2”,“chart_1 {colspan=3}”
17  ]
18 }
19}

レイアウトのオプション

上記の例は、横モード (“device:ipad, orientation:landscape”) の iPad に固有のレイアウトです。次に、レイアウトのデバイスおよび方向のオプションを示します。

“default”: 特定のデバイスまたは方向を対象としていないレイアウト用です。
“device:ipad, orientation:portrait”: 縦モードの Apple iPad 用です。
“device:ipad, orientation:landscape”: 横モードの Apple iPad 用です。
“device:ipad”: 縦モードまたは横モードの Apple iPad 用です。
“device:iphone”: Apple iPhone 用です (暗黙的に縦モード)。
“device:external”: 外部デバイス用です (デバイスが HDMI ケーブルでプロジェクターやディスプレイに接続されている場合など)。external レイアウトを使用するには、[設定] で [プレゼンテーションモード] を選択します。
“device:applewatch”: Apple Watch 用です。1 つのスクロールページのみがサポートされます。
“orientation:portrait”: 縦モードの iPhone または iPad 用です。
“orientation:landscape”: 横モードの iPad 用です。

アプリケーションが Apple Watch で表示され、かつ “device:applewatch” レイアウトが存在していない場合、アプリケーションはまず “device:iphone” レイアウトの最初のページの形式の変更を試みます。“device:iphone” が存在していない場合、次に “default” レイアウトの最初のページの使用を試みます。

メモ

アプリケーションが外部デバイスで表示され、かつ “device:external” レイアウトが存在していない場合、アプリケーションはまず “device:ipad” “orientation:landscape” の最初のページの使用を試みます。“device:ipad” “orientation:landscape” が存在していない場合、次に “default” レイアウトの最初のページの使用を試みます。

メモ

レイアウトのオートフォーマット

“layouts” が指定され��いない場合、使用に適したレイアウトの最適な推測を行うオートフォーマットを使用してダッシュボードが表示されます。レイアウトのオートフォーマットに関する次の事項に注意してください。

Apple Watch の場合、オートフォーマットは default レイアウトの最初のページを使用してそれを 1 つの列に変換します。
外部デバイスの場合、オートフォーマットはスクロールできない 1 つのページのみをサポートし、外部ディスプレイにすべてのダッシュボードコンテンツを収めようとします。

オートフォーマットでサポートされる各デバイスの列数には制限があります (下記の表を参照)。

デバイス	オートフォーマットでサポートされる最大列数
Apple Watch	1
Apple iPhone	2
Apple iPad	4

オートフォーマットはデフォルトで有効になっています。モバイルレイアウトを使用できない、入念に設計されたダッシュボードなどの場合に、オートフォーマットを無効にするには、"layouts": "" のように空の “layouts” 属性を “state” 属性の下に追加します。

layouts セクションを含むダッシュボード JSON ファイルの例

次に、“layouts” セクションを含むダッシュボード JSON ファイルの例を示します。

1{
2 "name_lc": "purchases by customer",
3 "state": {
4  "widgets": {
5   "buttongroup_1": {
6    "params": {
7     "measureField": "count",
8     "step": "Region_3"
9    },
10    "type": "PillBox",
11    "pos": {
12     "w": 280,
13     "zIndex": 1,
14     "y": 30,
15     "x": 540
16    }
17   },
18   "chart_1": {
19    "params": {
20     "chartType": "vbar",
21     "step": "Customer_Name_1"
22    },
23    "type": "ChartWidget",
24    "pos": {
25     "w": 810,
26     "zIndex": 0,
27     "y": 150,
28     "h": 470,
29     "x": 10
30    }
31   },
32   "dimfilter_1": {
33    "params": {
34     "measureField": "count",
35     "expanded": false,
36     "step": "Customer_Name_1"
37    },
38    "type": "ListSelector",
39    "pos": {
40     "w": 250,
41     "zIndex": 100001,
42     "y": 50,
43     "h": 50,
44     "x": 10
45    }
46   },
47   "dimfilter_2": {
48    "params": {
49     "measureField": "count",
50     "expanded": false,
51     "step": "Product_Name_2"
52    },
53    "type": "ListSelector",
54    "pos": {
55     "w": 250,
56     "zIndex": 100002,
57     "y": 50,
58     "h": 50,
59     "x": 280
60    }
61   }
62  },
63  "steps": {
64   "Region_3": {
65    "isFacet": true,
66    "start": null,
67    "query": {
68     "measures": [
69      [
70       "count",
71       "*"
72      ]
73     ],
74     "groups": [
75      "Region"
76     ]
77    },
78    "extra": {
79     "chartType": "hbar"
80    },
81    "selectMode": "single",
82    "useGlobal": true,
83    "em": "SuperStoreSales",
84    "type": "aggregate",
85    "isGlobal": false
86   },
87   "Product_Name_2": {
88    "isFacet": true,
89    "start": null,
90    "query": {
91     "measures": [
92      [
93       "count",
94       "*"
95      ]
96     ],
97     "groups": [
98      "Product_Name"
99     ]
100    },
101    "extra": {
102     "chartType": "hbar"
103    },
104    "selectMode": "single",
105    "useGlobal": true,
106    "em": "SuperStoreSales",
107    "type": "aggregate",
108    "isGlobal": false
109   },
110   "Customer_Name_1": {
111    "isFacet": true,
112    "start": null,
113    "query": {
114     "measures": [
115      [
116       "count",
117       "*"
118      ]
119     ],
120     "groups": [
121      "Customer_Name"
122     ]
123    },
124    "extra": {
125     "chartType": "hbar"
126    },
127    "selectMode": "single",
128    "useGlobal": true,
129    "em": "SuperStoreSales",
130    "type": "aggregate",
131    "isGlobal": false
132   }
133  },
134  "layouts": {
135   "default": {
136    "page:0": [
137     "buttongroup_1 | row: {height=300}" ,
138     "chart_1"
139    ],
140    "page:1": [
141     "dimfilter_1 | dimfilter_2",
142     "chart_1 {colspan=2}"
143    ]
144   },
145   “device:ipad, orientation:landscape”:{
146    “page:0”: [
147     “dimfilter_1 | dimfilter_3 | buttongroup_2”,
148     “chart_1 {colspan=3}”
149    ]
150   }
151  }
152 },
153 "lastRefresh": 1425493084,
154 "_uid": "0FKD000000000BUOAY",
155 "_createdBy": {
156  "_type": "user",
157  "profilePhotoUrl": "https://c. <myorg>/profilephoto/005/T",
158  "name": "Admin User",
159  "_uid": "005D0000001V97kIAC"
160 },
161 "folder": {
162  "_type": "folder",
163  "_uid": "00lD00000013RRvIAM"
164 },
165 "edgemarts": {
166  "emName": {
167   "_type": "edgemart",
168   "_uid": "0FbD00000004CjcKAE"
169  }
170 },
171 "_type": "dashboard",
172 "_container": {
173  "_container": "0FKD000000000BUOAY",
174  "_type": "container"
175 },
176 "_createdDateTime": 1426201221,
177 "assetSharingUrl": "https:// <myorg>/analytics/wave/dashboard?assetId=0FKD000000000BUOAY&orgId=00DD00000007hUM&loginHost= <myorg>.com&urlType=sharing",
178 "_permissions": {
179  "modify": true,
180  "view": true
181 },
182 "description": "",
183 "_url": "/insights/internal_api/v1.0/esObject/lens/0FKD000000000BUOAY/json",
184 "name": "Purchases by Customer",
185 "_files": {
186  "assetPreviewThumb": {
187   "fileSize": 8666,
188   "_type": "lensfile",
189   "lastModified": 1426202487,
190   "_url": "/insights/internal_api/v1.0/esObject/lens/0FKD000000000BUOAY/lensfile/0FJD0000000008VOAQ/data?lastModified=1426202487",
191   "lensId": "0FKD000000000BUOAY",
192   "fileName": "assetPreviewThumb",
193   "contentType": "image/png",
194   "_uid": "0FJD0000000008VOAQ"
195  }
196 }
197}

Wave Analytics ダッシュボード JSON リファレンス