web-dev-qa-db-ja.com

ヒストグラムビンの個々のデータポイントを強調表示する

業界内のWebサイトのロード時間分布を示すグラフがあります。 x軸はロード時間バケット(<1秒、1〜2秒、2〜3秒、4〜5秒など)を示し、y軸はサイトの数を示します。このアイデアは、ユーザーが業界内のWebサイトのパフォーマンスを全体的に把握できるようにする必要があるというものです。このグラフでは、1つまたは2つの特定のサイトがどのロードタイムバケットに属しているかを表示して、ユーザーがこれらのサイトの相互比較や業界全体の比較を確認できるようにします。

これまでのところ、これは...

Comparing one site to the industry

Comparing multiple sites to the industry

ただし、サイトはバケット全体ではなく、その一部であるため、これはデータを誤って表現したものです。もう1つの問題は、複数のサイトが同じバケットに配置される場合(これは非常に一般的です)、バーに色を付ける簡単な方法がないことです。

単一のデータポイントが属するバケットを強調表示するより良い方法はありますか?

2
tblessander

読み込み時間の値の近くに、上または下にオーバーレイされたドットプロットを考えます。

個別の視覚的インジケーターを使用する場合は、バー全体を着色することを避けます。このようにして、全体的な分布を特定の値から分離し、凡例の各会社のより正確な値(可能な場合)を取得できます。

凡例には、プロットに使用するのと同じ形状を使用して、1対1のマッピングを行います。ホバーすると、詳細を表示できます。

enter image description here

2
Mike M