Wave Analytics ダッシュボード JSON リファレンス
jgridLayouts (Wave デザイナダッシュボードのみ)
gridLayouts セクションでは、ダッシュボード用に作成されるすべてのレイアウトを定義します。
Wave デザイナダッシュボードのレイアウトについての詳細は、「Generate Unique Dashboard Layouts for Different Devices」を参照してください。Classic デザイナダッシュボードのレイアウトについての詳細は、「layouts (Classic デザイナダッシュボードのみ)」を参照してください。
例
1"gridLayouts": [{
2 "name": "Default",
3 "numColumns": 12,
4 "pages": [{
5 "widgets": [{
6 "colspan": 3,
7 "column": 3,
8 "name": "container_1",
9 "row": 1,
10 "rowspan": 6,
11 "widgetStyle": {
12 "backgroundColor": "#FFFFFF",
13 "borderColor": "#9687BB",
14 "borderEdges": [
15 "top"
16 ],
17 "borderRadius": 0,
18 "borderWidth": 8
19 }
20 }, {
21 "colspan": 12,
22 "column": 0,
23 "name": "text_2",
24 "row": 0,
25 "rowspan": 1,
26 "widgetStyle": {
27 "backgroundColor": "#FFFFFF",
28 "borderColor": "#77B0AD",
29 "borderEdges": [],
30 "borderRadius": 0,
31 "borderWidth": 8
32 }
33 }, {
34 "colspan": 3,
35 "column": 0,
36 "name": "container_4",
37 "row": 1,
38 "rowspan": 6,
39 "widgetStyle": {
40 "backgroundColor": "#FFFFFF",
41 "borderColor": "#77B0AD",
42 "borderEdges": [
43 "top"
44 ],
45 "borderRadius": 0,
46 "borderWidth": 8
47 }
48 }, {
49 "colspan": 3,
50 "column": 0,
51 "name": "text_1",
52 "row": 1,
53 "rowspan": 1,
54 "widgetStyle": {
55 "borderEdges": []
56 }
57 }, {
58 "colspan": 3,
59 "column": 3,
60 "name": "text_3",
61 "row": 1,
62 "rowspan": 1,
63 "widgetStyle": {
64 "borderEdges": []
65 }
66 }, {
67 "colspan": 3,
68 "column": 0,
69 "name": "number_1",
70 "row": 2,
71 "rowspan": 2,
72 "widgetStyle": {
73 "borderEdges": []
74 }
75 }, {
76 "colspan": 3,
77 "column": 3,
78 "name": "number_2",
79 "row": 2,
80 "rowspan": 2,
81 "widgetStyle": {
82 "borderEdges": []
83 }
84 }, {
85 "colspan": 3,
86 "column": 0,
87 "name": "chart_1",
88 "row": 4,
89 "rowspan": 3,
90 "widgetStyle": {
91 "borderEdges": []
92 }
93 }, {
94 "colspan": 3,
95 "column": 3,
96 "name": "chart_2",
97 "row": 4,
98 "rowspan": 3,
99 "widgetStyle": {
100 "borderEdges": []
101 }
102 }, {
103 "colspan": 6,
104 "column": 6,
105 "name": "chart_5",
106 "row": 1,
107 "rowspan": 6,
108 "widgetStyle": {
109 "borderEdges": []
110 }
111 }]
112 }],
113 "selectors": [],
114 "style": {
115 "alignmentX": "left",
116 "alignmentY": "top",
117 "backgroundColor": "#F2F6FA",
118 "cellSpacingX": 8,
119 "cellSpacingY": 8,
120 "documentId": "",
121 "fit": "original"
122 },
123 "version": 1
124}, {
125 "name": "Tablet",
126 "numColumns": 8,
127 "selectors": [
128 "minWidth(600)",
129 "maxWidth(900)",
130 "orientation(portrait)"
131 ],
132 "pages": [{
133 "widgets": [{
134 "colspan": 7,
135 "column": 0,
136 "name": "text_2",
137 "row": 0,
138 "rowspan": 1,
139 "widgetStyle": {
140 "backgroundColor": "#FFFFFF",
141 "borderColor": "#77B0AD",
142 "borderEdges": [],
143 "borderRadius": 0,
144 "borderWidth": 8
145 }
146 }, {
147 "colspan": 3,
148 "column": 0,
149 "name": "text_1",
150 "row": 1,
151 "rowspan": 1,
152 "widgetStyle": {
153 "borderEdges": []
154 }
155 }, {
156 "colspan": 3,
157 "column": 0,
158 "name": "number_1",
159 "row": 2,
160 "rowspan": 2,
161 "widgetStyle": {
162 "borderEdges": []
163 }
164 }, {
165 "colspan": 3,
166 "column": 0,
167 "name": "chart_1",
168 "row": 4,
169 "rowspan": 3,
170 "widgetStyle": {
171 "borderEdges": []
172 }
173 }, {
174 "colspan": 4,
175 "column": 0,
176 "name": "container_4",
177 "row": 1,
178 "rowspan": 6,
179 "widgetStyle": {
180 "backgroundColor": "#FFFFFF",
181 "borderColor": "#77B0AD",
182 "borderEdges": [
183 "top"
184 ],
185 "borderRadius": 0,
186 "borderWidth": 8
187 }
188 }, {
189 "colspan": 3,
190 "column": 4,
191 "name": "text_3",
192 "row": 1,
193 "rowspan": 1,
194 "widgetStyle": {
195 "borderEdges": []
196 }
197 }, {
198 "colspan": 3,
199 "column": 4,
200 "name": "number_2",
201 "row": 2,
202 "rowspan": 2,
203 "widgetStyle": {
204 "borderEdges": []
205 }
206 }, {
207 "colspan": 3,
208 "column": 4,
209 "name": "chart_2",
210 "row": 4,
211 "rowspan": 3,
212 "widgetStyle": {
213 "borderEdges": []
214 }
215 }, {
216 "colspan": 4,
217 "column": 4,
218 "name": "container_1",
219 "row": 1,
220 "rowspan": 6,
221 "widgetStyle": {
222 "backgroundColor": "#FFFFFF",
223 "borderColor": "#9687BB",
224 "borderEdges": [
225 "top"
226 ],
227 "borderRadius": 0,
228 "borderWidth": 8
229 }
230 }, {
231 "colspan": 8,
232 "column": 0,
233 "name": "chart_5",
234 "row": 7,
235 "rowspan": 6,
236 "widgetStyle": {
237 "borderEdges": []
238 }
239 }]
240 }],
241 "version": 1,
242 "style": {
243 "backgroundColor": "#C5D3E0",
244 "cellSpacingX": 4,
245 "cellSpacingY": 4,
246 "documentId": "",
247 "fit": "original",
248 "alignmentX": "left",
249 "alignmentY": "top"
250 },
251 "maxWidth": 500
252}]gridLayouts プロパティ
gridLayouts キーは、Wave デザイナダッシュボードのすべてのレイアウトを定義します。各レイアウトの個別のノードが含まれます。各レイアウトには、レイアウトを使用できるデバイス、およびレイアウト内の各ウィジェットの配置に関する情報を提供するプロパティがあります。また、グリッドのセルのスペーシングやダッシュボードの背景色または背景画像などのダッシュボードのプロパティも含まれます。
| プロパティ名 | 詳細 |
|---|---|
| name |
|
| maxWidth | ダッシュボードが使用可能な最大幅 (ピクセル単位)。必要な場合は Wave で、レイアウトのこの設定に基づいて、既存のダッシュボードウィジェットが再配置されます。 |
| numColumns |
|
| pages |
|
| selectors |
|
| style |
|
| version |
pages プロパティ
pages キーには、Wave デザイナダッシュボードレイアウトでの各ウィジェットの配置を決定するプロパティが含まれます。現在、Wave デザイナではレイアウトごとに 1 ページのみがサポートされています。
| プロパティ名 | 詳細 |
|---|---|
| widgets |
|
widgets プロパティ
widgets キーには、各ウィジェットの高さと幅、およびダッシュボードレイアウト上での配置場所を決定するプロパティが含まれます。Wave ダッシュボードデザイナではグリッドを使用するため、行と列に関するプロパティを指定します。たとえば、列数を指定してウィジェットの幅を決定します。
| プロパティ名 | 詳細 |
|---|---|
| name |
|
| column |
|
| row |
|
| colspan |
|
| rowspan |
|
| widgetStyle |
|
widgetStyle プロパティ
widgetStyle キーには、ウィジェットの境界線の種類、境界線の色、および背景色を設定するプロパティが含まれます。これらの属性は 2 つのレベルで指定できます。すべてのダッシュボードウィジェットのデフォルトを設定するには、gridLayouts の widgetStyle 項目を使用します。特定のウィジェットを設定するには、widgets の widgetStyle 項目を使用します。すべてのウィジェットで、この設定はデフォルト設定よりも優先されます。
| プロパティ名 | 詳細 |
|---|---|
| backgroundColor |
|
| borderColor |
|
| borderEdges |
|
| borderRadius |
|
| borderWidth |
|
selectors プロパティ
selectors キーには、レイアウト名、デザイナグリッド設定、背景設定、およびこのレイアウトを使用できるデバイスの要件を指定するレイアウトプロパティが含まれます。
| プロパティ名 | 詳細 |
|---|---|
| minWidth(<width>) |
|
| maxWidth(<width>) |
|
| orientation(<orientation> |
|
| platform(<platform>) |
|
style プロパティ
style キーには、グリッドのセルのスペーシングやダッシュボードの背景色または背景画像などのダッシュボードのプロパティが含まれます。
| プロパティ名 | 詳細 |
|---|---|
| alignmentX |
|
| alignmentY |
|
| backgroundColor |
|
| cellSpacingX |
|
| cellSpacingY |
|
| documentId |
|
| fit |
|