質問: 数千ステップのプロジェクトの進捗を視覚化するアイデア 私は手書きのインデックスカードのコレクションを転写するためのインターフェイスに取り組んでいます...インデックスカードのlot、何万ものようなもの。複数の人が任意のカードを任意の順序で転記できるサイトを構築しています。どれだけの作業が行われたか、どれくらいの作業が残っているかを視覚化したものを追加したいと思います。私が思いついたのは、1ピクセルが1枚のカードに対応する散布図でした-100x100の<canvas>タグでそのようなプロットを作成すると、たとえば、10,000のステータスポイントをキャプチャできます。色が付けられたキャンバスの部分は、少なくともどれだけ文字が転写されたかを視覚的に示します。しかし、このような<canvas>タグをレンダリングするには、データも送信する必要があります。これはおそらくデータが多すぎます。 (多分私は定期的にサーバー上でプロットをレンダリングし、それを画像として送信することができます。)それともそれはでしょうか?誰か提案はありますか?
回答: 標準の進行状況バーとカードの数で十分でしょう。しかし、これはあなたが少し独創的であるかもしれないものだと思います:散布図の効果は素晴らしいかもしれません、あなたは最も新しいピクセルを最も明るくして、古いものをフェードさせることもできます。パフォーマンス的には、生成されたピクセルプロットを保存する場合、表示するたびに計算する必要がないので、これは本当に問題にはなりません。 canvas-tagではなく、サーバーサイドで生成された画像を使用すると思います。更新アクション自体はそれほど複雑であってはなりません。既存の画像を取得し、最後の更新(または最後の画像のレンダリング以降の更新)を取得して、それらの正確なピクセルを変更するだけです。または、時間に応じてフェードしたい場合は、最初に既存の画像をフェードし、次に最新のフェードアクションのタイムスタンプを追加して、1日1回または1時間に1回だけ行うようにします。 (ステップごとに行うこともできます。)現在は、進行状況の情報を提供するためだけに必要なものよりはるかに複雑なものになっています。また、リソースを拡張しない方法で実装することは非常に現実的だと思います。