忍者ブログ
日々の研究生活のメモ書きなど
今にして思えばなんかjavascriptを使ってうまいことやる方法があるような気がしてた〜〜〜
とりあえずやったことをメモしとく




html自体はテキストファイルを読み込んで、その値に応じて#FF0000とか色を16進法で指定したい

最初に見たのがこういうページ

■ 参考 : WEBカラー作成(グラデーションから選択)

https://coffeepote.tumblr.com/post/185980495773

CSSの機能である色〜ある色へのグラデーションを作れる
これを使って、その中間の色を選択できるのかなぁ〜と思ったけど
この機能はどうやら背景画像の代わりに使う用途っぽい
なのでだめ






rgb()って関数があることはなんとなく察しがついたので
赤色 rgb(255, 0, 0) からその透明度を上げて白色までグラデーションさせることを思いついた

調べてみたら透明度込みのRGBは、次のようにして指定するらしい
最後の1が透明度の値なので0から1を入れる
rgba(255, 0, 0, 1)


ただこれもだめ
というのもhtmlの背景色がそもそも白色じゃないからそっちの色が透過してしまってなんのこっちゃって感じになった


ちなみにやりたいのはこんな感じのをtableの各マスの背景色にしたい


■ 参考 : rgba() …… RGBAカラーモデルで色を指定する







■ 参考 : グラデーション配色の計算方法





結局
< td bgcolor=\"#FF0000\">なんか値<td>
みたいな感じでこれまで通り対応した

#FF0000の部分は値に応じてawkで16進法の色を用意する
color_td=`echo $some_value | awk '{if($1 > 1000){printf "#FF0000)\n"} else printf "#FF%02X%02X\n", 255-$1/1000*255, 255-$1/1000*255}'`

awkのprintfフォーマットで%xとすると16進法で書き出してくれる
%Xは大文字
%xは小文字になる

最初、printfの中の%xで0埋めしてなかったから、赤〜白にはない変な色になって焦った
%02Xで大文字かつ2桁でない場合は0埋めしてくれる

1000以上の値の場合はサチらせて赤にした

■ 参考 : 10進数<=>ASCII<=>16進数変換(bash+awk)



awkを使わなくても単にprintf "%02X" 100とかでもいける

■ 参考 : コマンドライン上で手軽に16進計算
















PR
この記事にコメントする
Name
Title
Color
E-Mail
URL
Comment
Password   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
プロフィール
HN:coffee
職業:物理屋(自称)
趣味:映画鑑賞、登山
出身:大阪府の南の田舎
自己紹介:
import MyProfile
import coffee_pote from TWITTER
import amazonのほしい物リスト from WISH_LIST

print "株式売買を始めてだいたい1ヶ月くらい立ちますた"

# 最終更新 2019/07/20
カウンター
ブログ内検索
ツイートするボタン
リンク
相互リンク募集中です (Twitterにてお知らせください)

Demo scripts for gnuplot version 5
(gnuplotのさまざまなデモ画像と作り方がまとめられている、眺めているだけでできるようになった気分になれる)

gnuplotスクリプトの解説
(米澤進吾さんの個人ページ、gnuplotと言えばこのかた)

gnuplot のページ
(Takeno Lab、うちのブログがリンクされていたのでリンク返し)

とある物理の院生日誌~院生は社会へ旅立った~
(研究室の先輩の個人ブログ)

英語例文を見て自然に英語・英会話を学ぶ
(楠本慶ニさんの個人ページ、様々な情報の密度の高さに感動)

Twitterから映画の評価が分かる & 映画の鑑賞記録が残せる coco
(映画の感想をまとめられるサイト、いつもお世話になっています)

Astronomy Picture of the Day Archive
(天文や宇宙関連の最新の話題について画像とともにNASAが説明しているページ)

今日のほしぞら
(任意の時刻の空で見える星を表示してくれる、国立天文台が管理している)

GNUPLOTとアニメーション
(応用の項目の「見せてあげよう!ラピュタの雷を!!」あたりからすごすぎる)

読書メーター
(読んだ本をリストできる便利なサイト)

flickr難民の写真置き場
(20XX年、flickrは有料化の炎に包まれた。あらゆるflickr無料ユーザーは絶滅したかに見えた。 しかし、tumblr移住民は死に絶えてはいなかった。)

教授でもできるMac OS X へのLaTeX, X11, gccのインストレーションと環境設定
(阪大の山中卓さんのwebページ、タイトルにセンスが溢れている、内容は超充実してる、特にTeX関連、学振DCとかPDの申請書類作成時にはお世話になっております)


Template "simple02" by Emile*Emilie
忍者ブログ [PR]