お知らせ:
2025 年 4 月 15 日より前に Earth Engine の使用を登録したすべての非商用プロジェクトは、Earth Engine へのアクセスを維持するために
非商用目的での利用資格を確認する必要があります。
ui.SplitPanel.style
コレクションでコンテンツを整理
必要に応じて、コンテンツの保存と分類を行います。
ウィジェットのスタイル ActiveDictionary を返します。これは、ウィジェットのスタイルを更新するために変更できます。
CSS の対応するプロパティと同様の動作をするプロパティ:
- height、maxHeight、minHeight（例: '100px'）
- width、maxWidth、minWidth（例: '100px'）
- padding、margin（例: '4px 4px 4px 4px' または '4px'）
- color、backgroundColor（例: 'red'、'#FF0000'）
- border（例: '1px solid black'）
- borderColor（例: 'red black blue #FF0000'）
- borderRadius（例: '10px'）
- borderStyle（例: 'solid dashed none dotted'）
- borderWidth（例: '1px 0px 1px 0px'）
- fontSize（例: '24px'）
- fontStyle（例: 'italic'）
- fontWeight（例: 'bold'、'100'）
- fontFamily（例: monospace、serif）
- textAlign（例: 'left' または 'center'）
- textDecoration（例: 'underline'、'line-through'）
- whiteSpace（例: 'nowrap'、'pre'）
- shown（true または false）
サポートされているカスタム レイアウト プロパティ（ui.Panel.Layout のドキュメントを参照）:
- stretch（'horizontal'、'vertical'、'both'）
- position（'top-right'、'top-center'、'top-left'、'bottom-right' など）
| 用途 | 戻り値 |
|---|
SplitPanel.style() | ui.data.ActiveDictionary |
| 引数 | タイプ | 詳細 |
|---|
これ: ui.widget | ui.Widget | ui.Widget インスタンス。 |
例
コードエディタ（JavaScript）
// Define a UI widget and add it to the map.
var widget = ui.SplitPanel({style: {width: '400px', height: '200px'}});
Map.add(widget);
// View the UI widget's style properties; an ActiveDictionary.
print(widget.style());
// ActiveDictionaries are mutable; set a style property.
widget.style().set('backgroundColor', 'lightgray');
print(widget.style());
// Define the UI widget's style ActiveDictionary as a variable.
var widgetStyle = widget.style();
print(widgetStyle);
// Set the UI widget's style properties from the ActiveDictionary variable.
widgetStyle.set({border: '5px solid darkgray'});
print(widgetStyle);
特に記載のない限り、このページのコンテンツはクリエイティブ・コモンズの表示 4.0 ライセンスにより使用許諾されます。コードサンプルは Apache 2.0 ライセンスにより使用許諾されます。詳しくは、Google Developers サイトのポリシーをご覧ください。Java は Oracle および関連会社の登録商標です。
最終更新日 2025-07-25 UTC。
[null,null,["最終更新日 2025-07-25 UTC。"],[[["\u003cp\u003e\u003ccode\u003ewidget.style()\u003c/code\u003e returns an ActiveDictionary that can be used to modify the widget's appearance, including properties like height, width, color, and border.\u003c/p\u003e\n"],["\u003cp\u003eYou can directly manipulate the widget's style using standard CSS properties such as \u003ccode\u003epadding\u003c/code\u003e, \u003ccode\u003emargin\u003c/code\u003e, \u003ccode\u003efontSize\u003c/code\u003e, and more.\u003c/p\u003e\n"],["\u003cp\u003eCustom layout properties such as \u003ccode\u003estretch\u003c/code\u003e and \u003ccode\u003eposition\u003c/code\u003e are also supported to control widget placement and resizing behavior.\u003c/p\u003e\n"],["\u003cp\u003eThe returned ActiveDictionary is mutable, meaning changes made to it will directly update the widget's style in real-time.\u003c/p\u003e\n"],["\u003cp\u003eThe provided examples showcase how to access, modify, and apply styles using the \u003ccode\u003ewidget.style()\u003c/code\u003e method and the ActiveDictionary.\u003c/p\u003e\n"]]],["The `style()` method returns a widget's `ActiveDictionary`, enabling style modifications. This includes properties like `height`, `width`, `padding`, `margin`, `color`, `backgroundColor`, `border`, `fontSize`, `fontStyle`, `fontWeight`, `fontFamily`, `textAlign`, `textDecoration`, `whiteSpace`, and `shown`. Custom layout properties such as `stretch` and `position` are also supported. The `ActiveDictionary` is mutable, allowing direct updates to the widget's style properties, as shown in the code examples.\n"],null,["# ui.SplitPanel.style\n\n\u003cbr /\u003e\n\nReturns the widget's style ActiveDictionary, which can be modified to update the widget's styles.\n\n\u003cbr /\u003e\n\nProperties which behave like their CSS counterparts:\n\n- height, maxHeight, minHeight (e.g. '100px')\n\n- width, maxWidth, minWidth (e.g. '100px')\n\n- padding, margin (e.g. '4px 4px 4px 4px' or simply '4px')\n\n- color, backgroundColor (e.g. 'red' or '#FF0000')\n\n- border (e.g. '1px solid black')\n\n- borderColor (e.g. 'red black blue #FF0000')\n\n- borderRadius (e.g. '10px')\n\n- borderStyle (e.g. 'solid dashed none dotted')\n\n- borderWidth (e.g. '1px 0px 1px 0px')\n\n- fontSize (e.g. '24px')\n\n- fontStyle (e.g. 'italic')\n\n- fontWeight (e.g. 'bold' or '100')\n\n- fontFamily (e.g. 'monospace' or 'serif')\n\n- textAlign (e.g. 'left' or 'center')\n\n- textDecoration (e.g. 'underline' or 'line-through')\n\n- whiteSpace (e.g. 'nowrap' or 'pre')\n\n- shown (true or false)\n\nSupported custom layout properties (see ui.Panel.Layout documentation):\n\n- stretch ('horizontal', 'vertical', 'both')\n\n- position ('top-right', 'top-center', 'top-left', 'bottom-right', ...)\n\n| Usage | Returns |\n|----------------------|--------------------------|\n| SplitPanel.style`()` | ui.data.ActiveDictionary |\n\n| Argument | Type | Details |\n|-------------------|-----------|-------------------------|\n| this: `ui.widget` | ui.Widget | The ui.Widget instance. |\n\nExamples\n--------\n\n### Code Editor (JavaScript)\n\n```javascript\n// Define a UI widget and add it to the map.\nvar widget = ui.SplitPanel({style: {width: '400px', height: '200px'}});\nMap.add(widget);\n\n// View the UI widget's style properties; an ActiveDictionary.\nprint(widget.style());\n\n// ActiveDictionaries are mutable; set a style property.\nwidget.style().set('backgroundColor', 'lightgray');\nprint(widget.style());\n\n// Define the UI widget's style ActiveDictionary as a variable.\nvar widgetStyle = widget.style();\nprint(widgetStyle);\n\n// Set the UI widget's style properties from the ActiveDictionary variable.\nwidgetStyle.set({border: '5px solid darkgray'});\nprint(widgetStyle);\n```"]]
