hogashi.*

日記から何から

Redashではクエリ結果にHTMLを使えるので便利 長いカラムをdetailsで畳める ほか

 Redash (https://redash.io/) でデータをクエリしたとき、長い値が入ったカラムがあると、クエリ結果が縦に長くなってしまいがち (画像では 3行しかないけど、 100行とかあると見づらいことも多い)。

長い値があるクエリ結果 / 縦に長くなりがちで見づらいこともある

 Redash では、なんとクエリ結果に HTML が書かれているとレンダされるので、 details タグで囲うことで畳むことができる。便利。*1

長い値をdetailsタグで畳むことができる / クリックしたら全部見れる

 リンクを張ることもできる。管理画面の URL などで、クエリ結果の id をクエリパラメータに入れたり、名前や時刻をリンクテキストにしたりすると便利。おもてなしとして target="_blank" をつければ、新しいタブで開くことができる。

リンクを張ることができる / target="_blank" のような指定もできる

 input や textarea で値をコピーしやすくできて便利。必要に応じて readonly などをつけたりするのもよさそう。

inputタグで好きなテキストをコピーしやすくできる
改行を含む文字列ならtextareaがコピーしやすい

 CSS も (タグの style 属性で) 書けるので、工夫次第では視覚的にわかりやすい表をつくることができると思います (上にあげたものが見やすいかはさておき……) *2。逆にごちゃごちゃにならないように気をつけつつ、便利に使っていきたいですね。

あけましておめでとうございます~〜〜

 はてなエンジニア Advent Calendar 2024 - Hatena Developer Blog の 35日目の記事でした。

*1:これはつまり、カラムの値として HTML が入っていると、素朴に select するだけでレンダされて出てきてしまうということなので、扱いには注意……

*2:JavaScript は書けない