お知らせ:
2025 年 4 月 15 日より前に Earth Engine の使用を登録したすべての非商用プロジェクトは、Earth Engine へのアクセスを維持するために
非商用目的での利用資格を確認する必要があります。
ui.SplitPanel
コレクションでコンテンツを整理
必要に応じて、コンテンツの保存と分類を行います。
2 つのパネルを含むウィジェット。パネル間には区切り線があります。分割線をドラッグすると、パネルのサイズを変更できます。1 つまたは両方のパネルが ui.Map オブジェクトである可能性があります。
デフォルトでは、レイアウトは 50/50 の分割で初期化されます。パネルの width スタイルと max/minWidth スタイルは、水平方向の分割サイズを制御します。同様に、縦方向には height と max/minHeight を使用します。これらは、ピクセル単位で「{n}px」として指定するか、包含する SplitPanel の割合として「{n}%」として指定できます。
分割パネルの全体の幅は個別に制御されるため、最初のパネルのサイズが指定されている場合、2 番目のパネルに指定されたサイズは無視されます。両方のパネルに最大サイズと最小サイズを設定できます。
用途 | 戻り値 |
---|
ui.SplitPanel(firstPanel, secondPanel, orientation, wipe, style) | ui.SplitPanel |
引数 | タイプ | 詳細 |
---|
firstPanel | ui.Panel(省略可) | 左側または上側のパネル。デフォルトは ui.Panel の新しいインスタンスです。 |
secondPanel | ui.Panel(省略可) | 下部または右側のパネル。デフォルトは ui.Panel の新しいインスタンスです。 |
orientation | 文字列、省略可 | 「horizontal」または「vertical」のいずれか。デフォルトは「horizontal」です。 |
wipe | ブール値、省略可 | ワイプ効果を有効にするかどうか。このモードが有効になっている場合、両方のパネルが使用可能なスペースをすべて占有し、分割線をドラッグしてもパネルのサイズは設定されず、各パネルの表示量が決定されます。この効果は「ワイプ トランジション」に似ています。このモードは、2 つの地図を比較する場合に便利です。デフォルトは false です。 |
style | オブジェクト、省略可 | このパネルに設定する値を含む、許可されている CSS スタイルのオブジェクト。デフォルトは空のオブジェクトです。 |
特に記載のない限り、このページのコンテンツはクリエイティブ・コモンズの表示 4.0 ライセンスにより使用許諾されます。コードサンプルは Apache 2.0 ライセンスにより使用許諾されます。詳しくは、Google Developers サイトのポリシーをご覧ください。Java は Oracle および関連会社の登録商標です。
最終更新日 2025-07-26 UTC。
[null,null,["最終更新日 2025-07-26 UTC。"],[[["\u003cp\u003eThe \u003ccode\u003eui.SplitPanel\u003c/code\u003e widget divides a UI element into two resizable panels, horizontally or vertically.\u003c/p\u003e\n"],["\u003cp\u003ePanel sizes can be customized using width/height and min/max dimensions, expressed in pixels or percentages.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003ewipe\u003c/code\u003e option allows for a transition-like effect, ideal for comparing two map panels by overlaying them.\u003c/p\u003e\n"],["\u003cp\u003eThe split panel's default layout divides the space equally between the two panels.\u003c/p\u003e\n"],["\u003cp\u003eUsers can specify custom CSS styles to further customize the appearance of the \u003ccode\u003eui.SplitPanel\u003c/code\u003e.\u003c/p\u003e\n"]]],[],null,["# ui.SplitPanel\n\n\u003cbr /\u003e\n\nA widget containing two panels with a divider between them. The divider can be dragged, allowing the panels to be resized. One or both panels may be ui.Map objects.\n\n\u003cbr /\u003e\n\nBy default the layout initializes with a 50/50 split. The width and max/minWidth styles on the panels control the split sizing for horizontal orientations. Similarly, use height and max/minHeight for vertical. These can be given in pixels as '{n}px' or as a percentage of the containing SplitPanel as '{n}%'.\n\nNote that the given size for the second panel will be ignored if the first panel size is specified, since the overall width of the split panel is controlled independently. Max/min sizes may be set for both panels.\n\n| Usage | Returns |\n|--------------------------------------------------------------------------------------------|---------------|\n| `ui.SplitPanel(`*firstPanel* `, `*secondPanel* `, `*orientation* `, `*wipe* `, `*style*`)` | ui.SplitPanel |\n\n| Argument | Type | Details |\n|---------------|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `firstPanel` | ui.Panel, optional | The left or top panel. Defaults to a new instance of ui.Panel. |\n| `secondPanel` | ui.Panel, optional | The bottom or right panel. Defaults to a new instance of ui.Panel. |\n| `orientation` | String, optional | One of \"horizontal\" or \"vertical\". Defaults to \"horizontal\". |\n| `wipe` | Boolean, optional | Whether to enable the wiping effect. When this mode is enabled, both panels take up all available space, and dragging the divider doesn't set the size of the panels but rather determines how much of each panel is shown. This effect is analogous to a \"wipe transition\". This mode is useful for comparing two maps. Defaults to false. |\n| `style` | Object, optional | An object of allowed CSS styles with their values to be set for this panel. Defaults to an empty object. |"]]