Skip to content
This repository has been archived by the owner on Jun 1, 2023. It is now read-only.

[改善][a11y] グラフのa11y対応としてテーブルもDOMにレンダリングする #1443

Merged
merged 21 commits into from
Mar 20, 2020
Merged

[改善][a11y] グラフのa11y対応としてテーブルもDOMにレンダリングする #1443

merged 21 commits into from
Mar 20, 2020

Conversation

KentarouTakeda
Copy link
Contributor

@KentarouTakeda KentarouTakeda commented Mar 14, 2020 •
edited
Loading

👏 解決する issue / Resolved Issues

📝 関連する issue / Related Issues

⛏ 変更内容 / Details of Changes

  • グラフ描画全箇所、noscript時はテーブル（表）を表示
  • グラフ描画時はDOMだけ残し表示は画面外に飛ばす（スクリーンリーダー対応）
  • csvダウンロード（機能のみ・uiは仮） 別PRに回します

備考

  • 変更内容的に型なしで書くのが辛かったのでts対応ブランチより作業開始しました。
    （ts対応のmergeが当面先になりそうな場合、本件のみjsに移植します）
  • wipなので変更内容は今後増えます。

📸 スクリーンショット / Screenshots

no-js

@KentarouTakeda KentarouTakeda changed the title [改善][a11y] グラフ描画のアクセシビリティ工場 [改善][a11y] グラフ描画のアクセシビリティ向上 Mar 14, 2020
@KentarouTakeda
yarn add file-saver / @types/file0saver
0baeaa5
@KentarouTakeda
都庁来庁者数の推移 csvダウンロード
49200bf
@KentarouTakeda
「都営地下鉄の利用者数の推移」csvダウンロード
2db8ac4
@KentarouTakeda
「検査実施数」 csvダウンロード
b971cc3
@KentarouTakeda
TimeBarChart csvダウンロード
8714ace 
* 陽性患者数
* 検査実施数
* 新型コロナコールセンター相談件数
* 新型コロナ受診相談窓口相談件数
@KentarouTakeda
Merge branch 'feature/graph-download-csv' into feature/graph-fallback…
5723498 
…-to-table

デザイン仮
@KentarouTakeda
csvダウンロード ファイル名の指定方法を統一
2af81fd
@KentarouTakeda
Merge branch 'feature/graph-download-csv' into feature/graph-fallback…
77c5690 
…-to-table
@KentarouTakeda
テーブル非表示の際もdomには残す（画面外に飛ばす）
91a2e23
@KentarouTakeda
Revert "Merge branch 'feature/graph-download-csv' into feature/graph-…
b8f17ee 
…fallback-to-table"

This reverts commit 77c5690, reversing
changes made to 5723498.
@KentarouTakeda
Revert "Merge branch 'feature/graph-download-csv' into feature/graph-…
69dd6ad 
…fallback-to-table"

This reverts commit 5723498, reversing
changes made to 206c873.
@KentarouTakeda KentarouTakeda changed the title [改善][a11y] グラフ描画のアクセシビリティ向上 [改善][a11y] グラフのa11y対応としてテーブルもDOMにレンダリングする Mar 14, 2020
@KentarouTakeda KentarouTakeda marked this pull request as ready for review March 14, 2020 13:44
@KentarouTakeda KentarouTakeda mentioned this pull request Mar 14, 2020
Closed
@magi1125 magi1125 added the accessibility アクセシビリティ関連 label Mar 16, 2020
@KentarouTakeda KentarouTakeda changed the base branch from feature/types/development to development March 20, 2020 05:26
@KentarouTakeda
Copy link
Contributor Author

  • ブランチ元の更新によりconflict発生していたのでそれを解消
  • ブランチ元は development へマージされたので本PRもdevelopmentへ向けるよう変更
  • それにともないconflictが発生したので解消

を行いました。
（そもそも検討の必要なPRだと思いますのでご確認はいつでも良いです。）

@kaizumaki
Copy link
Collaborator

@KentarouTakeda こちらコンフリクトを起こしているので、一度最新を取り込んだ上、解消してもらえますか？

@KentarouTakeda
Copy link
Contributor Author

@kaizumaki conflict解消しました。

halsk
halsk approved these changes Mar 20, 2020
View reviewed changes
Copy link
Contributor

@halsk halsk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

取り込みます！！

@halsk halsk merged commit c1e9a21 into Tokyo-Metro-Gov:development Mar 20, 2020
@kaizumaki kaizumaki mentioned this pull request Mar 20, 2020
Closed
@KentarouTakeda KentarouTakeda deleted the feature/graph-fallback-to-table branch March 20, 2020 11:47
This was referenced Mar 20, 2020
Merged
Closed
@t-tajiri t-tajiri mentioned this pull request Mar 20, 2020
Merged
@magi1125
Copy link

対応ありがとうございます。確認が遅くなり申し訳ありません。スクリーンリーダーで読み上げられることを確認しました！
挿入頂いているtableのマークアップを改善することでよりスクリーンリーダーフレンドリーにできそうなので、それは別issueで立てようと思います。

@magi1125 magi1125 mentioned this pull request Mar 21, 2020
Closed
This was referenced Mar 21, 2020
Closed
Closed
@shunito shunito mentioned this pull request Mar 22, 2020
Merged
halsk added a commit that referenced this pull request Mar 26, 2020
@halsk
Merge pull request #1443 from KentarouTakeda/feature/graph-fallback-t…
5699c4f 
…o-table

[改善][a11y] グラフのa11y対応としてテーブルもDOMにレンダリングする
@shgtkshruch shgtkshruch mentioned this pull request Apr 20, 2020
Open
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@halsk halsk halsk approved these changes

Assignees
No one assigned
Labels
accessibility アクセシビリティ関連
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

table提供やcsv提供による、グラフのアクセシビリティへの過渡的な対応
4 participants
@KentarouTakeda @kaizumaki @magi1125 @halsk