グラフのスタイルに統一感がない

[nard-tech]

改善詳細 / Details of Improvement

現状の問題点

• 「7日間移動平均」の値は以下の通り，グラフによって表現方法が異なっている
  • モニタリング項目(1) 新規陽性者数: オレンジ色 実線
  • モニタリング項目(2) #7119における発熱等相談件数: 濃緑色 実線
  • モニタリング項目(3) 新規陽性者における接触歴等不明者数: オレンジ色 破線
  • モニタリング項目(4) 検査の陽性率（検査人数について）: オレンジ色 破線
  • モニタリング項目(5) 救急医療の東京ルールの適用件数: 濃緑色 実線
  • 受診相談窓口における相談件数: 濃緑色 実線
  • 東京都発熱相談センターにおける相談件数: オレンジ色 破線
• グラフ「モニタリング項目(1) 新規陽性者数」の棒グラフの色は淡緑色だが，他のグラフでは棒グラフが1つだけの場合は緑色とすることになっているので，統一感がない

改善案1

「7日間移動平均」の値について

• 理解のしやすさを向上させるため，「7日間移動平均」の値はオレンジ色の破線で表現するよう統一する
  • オレンジ色にするのは，緑色の線で表現すると緑系統の色の棒グラフに埋もれてしまって見づらいため
  • 「モニタリング項目(3) 新規陽性者における接触歴等不明者数」の増加比，「モニタリング項目(4) 検査の陽性率」の陽性率が実線で表現されているので，全体として「比は実線，7日間移動平均は破線」に統一する

グラフ「モニタリング項目(1) 新規陽性者数」について

「7日間移動平均」の値をオレンジ色の破線で表現する場合，棒グラフが緑色にしてしまうと緑色が強調されて見づらいため，「モニタリング項目(1) 新規陽性者数」の棒グラフは淡緑色のままとし，他の「棒グラフ + 移動平均の折れ線グラフ」を「棒グラフ（淡緑色） + 移動平均の折れ線グラフ（オレンジ色 破線）」の構成とする．

改善案2

「7日間移動平均」の値について

• 理解のしやすさを向上させるため，「7日間移動平均」の値はオレンジ色の実線で表現するよう統一する
  • 「モニタリング項目(3) 新規陽性者における接触歴等不明者数」の増加比，「モニタリング項目(4) 検査の陽性率」の陽性率が実線で表現されているが，こちらを破線とする．
  • 全体として，「比は破線，7日間移動平均は実線」に統一する
    • 比を破線にすれば，右のY軸に対応する補助的な値であるということが明確になるのでよいかも？

グラフ「モニタリング項目(1) 新規陽性者数」について

「7日間移動平均」の値をオレンジ色の実線で表現する場合，やはり棒グラフが緑色にしてしまうと緑色が強調されて見づらいため，「モニタリング項目(1) 新規陽性者数」の棒グラフは淡緑色のままとし，他の「棒グラフ + 移動平均の折れ線グラフ」を「棒グラフ（淡緑色） + 移動平均の折れ線グラフ（オレンジ色 実線）」の構成とする．

スクリーンショット / Screenshot

グラフ「モニタリング項目(1) 新規陽性者数」

現状

棒グラフを緑色にした場合（見づらい例）

改善案1

改善案2（現状と同じ）

グラフ「モニタリング項目(2) #7119における発熱等相談件数」「モニタリング項目(3) 新規陽性者における接触歴等不明者数」

現状

改善案1（「モニタリング項目(3) 新規陽性者における接触歴等不明者数」は現状と同じ）

改善案2

[nard-tech]

グラフの色についてはアクセシビリティを考慮すべきということで #1172 などで議論されてきた経緯があり，色分けのルールも作られたと記憶していますが，1年が経過し，グラフが次々に追加されていった結果，色の使い分けに統一性がなくなり，ルールも形骸化してきたような気がするので，違和感を覚える箇所を具体的に挙げるとともに，その改善案を示していきたいと思います．

[forestgtree]

@nard-tech ご提案いただきありがとうございました！
かなり時間が経ってしまってからのコメントとなってしまい、申し訳ありません🙇‍♂️

私もご提案いただいた「改善案１」が良いと思いました✨
その方向で、現状の全グラフの統一性を再考していきたいと思います！

過去のアクセシビリティissueの内容も踏まえつつ
ご意見いただきながら考えていきたいと思いますので、よろしくお願いします！

[kaizumaki]

@forestgtree フォローありがとうございます！

カラーチャートについてはルールが崩れたわけではないのですよね。個々のグラフでルールを適用してきた結果、全体的に見ると統一性がなくなったように感じてしまう、というところだと思います。

今回、東京都からも「７日間移動平均の線を統一してほしい」という要望がありまして、過去の経緯を踏まえつつ議論していきたいと思います。
@magi1125 さんのご意見もぜひ伺いたいです。

[magi1125]

@kaizumaki @forestgtree
お返事遅くなりすみません。見解まとめてみました。ご検討ください。

同意のポイント

• 移動平均や増加比の折れ線グラフが黒っぽい緑だったりオレンジだったりするので統一したほうがよさそう
• 移動平均と増加比は、どちらかを破線、どちらかを実線で固定したほうが良さそう

検討のポイント

• 緑4色（仮に濃い方から①,②,③,④とする）の配色のルールとの兼ね合いをどうするか
  • 現状だと、1系統のみだと②、2系統だと①,③、3系統だと①,②,③、4系統だと①,②,③,④となっている
  • ②と折れ線色が見分けにくいことへの対処として「1系統かつ折れ線グラフがあるときだけ棒グラフの塗りを③にする」で良いのかどうか。
  • 1系統のグラフが多く、また②はサイトのキーカラーでもあるため「②に対しても見分けがつく折れ線の色」を検討する方向もあり得るかも？
• いまの折れ線のオレンジは、D型色覚の場合、②との見分けが厳しそう。Adobe Colorでシミュレーションしてみるとけっこうカラー競合ギリギリ（添付画像参照）。
  • 黄緑っぽい色にするなど、別の色を検討してもよさそう

[kaizumaki]

@magi1125 コメントありがとうございます！これを機に、折れ線のオレンジを別の色へ変更するのはアリだと思います。