組み込みの Web SQL UI (play.html。任意の ClickHouse HTTP ポートの /play パスで提供) では、結果内で選択したカラムを表示したまま、テーブルの残りを横方向にスクロールできます。ピン留めされたカラムはスクロールして見えなくならず、結果領域の手前側の端に留まるため、識別子、名前、日付といったキーになるカラムを、確認中の右端のカラムの横に常に表示しておけます。
カラムのピン留め
📌 の画びょうアイコンが各カラムヘッダーの左側に表示されます。これをクリックするとカラムがピン留めされ、もう一度クリックすると解除されます。このアイコンは実際のボタンなので、キーボード利用者は Tab キーで移動してキーボードでトグルできます。また、ピン留め状態は支援技術にも伝えられます。
ホバー可能なポインター (マウス) を備えたデバイスでは、アイコンはヘッダーにホバーしている間、またはトグルにフォーカスがある間だけ表示されるため、それ以外のときは邪魔になりません。一方、ホバーのないタッチ端末やその他の粗いポインターデバイスでは、直接タップできるようアイコンは常に表示されます。ピン留めされたカラムでは、その状態を示すため、アイコンがはっきり表示されたままになります。
ピン留めを利用できる場合
ピン留めを利用できるのは、テーブルの幅が横スクロールを必要とする場合だけです。テーブル全体がビューポート内に収まっている場合は、スクロールして見えなくなる部分がないため、ピン留めのトグルは無効になり、キーボードのタブ移動順からも除外されます。結果が横方向にスクロール可能になると、つまり、結果が横に広い場合、ウィンドウ幅が狭い場合、またはストリーミングされた結果が横方向に広がっていく場合には、トグルが有効になります。
スクロール時のピン留めされたカラムの動作
ピン留めされたカラムは、水平スクロール中はコンテンツと一緒に移動し、ビューポートから外れそうになると手前側の端に固定されます。左側のカラムは左端に、右側のカラムは右端に固定され、そのまま表示され続けます。複数のピン留めされたカラムがある場合は、元の順序のまま端に沿って重なり、それぞれが境界線によってスクロール中のコンテンツと区切られます。固定セルは、その下をスクロールする通常のセル (選択中のセルを含む) の上に描画されるため、常に読みやすい状態が保たれます。
ピン留めはカラム名ごとに管理され、列ごとの色分けモードと同様に、ページ上のすべての結果テーブル間で共有されます。ある結果で id という名前のカラムをピン留めすると、他の結果や、同じカラムを返す後続のクエリでも、その id カラムはピン留めされたままになります。
永続性
固定したセットは、ページのURL、ブラウザーの履歴、タブごとの結果スナップショットに保存されるため、ページを再読み込みしたり、リンクを共有したり、前後に移動したりしても維持されます。コンパクトに保つため、保存されるのは固定したカラムだけで、空のセットはURLや履歴状態に何も追加しません。
制限事項
- 縦方向 (転置) の単一行表示には横スクロールするカラムがないため、ピン留めはできません。