web-dev-qa-db-ja.com

レスポンシブデザイン/ユーザーのジオロケーションに関する距離を選択するための適切なWebコンポーネントは何ですか?

レスポンシブウェブアプリケーションを所有しています。

ユーザーに、地理位置情報と選択された制限に基づいて、結果を(いくつかのデータをリストするページを想定して)フィルター処理させたい。

たとえば、ボブは、10 km以内にあるすべての会議を表示したいと考えています。

特にモバイルデバイスでは、適切なコンポーネントは何でしょうか?

私は this (最初の項目)を見つけましたが、狭いモバイルデバイスで大きなスライダーを表すのは扱いにくいかもしれません。

どう思いますか?

1
Mik378

数値ステッパーを使用できます。ユーザーはキーボードで値を入力するか、上/下矢印を使用できます。デフォルト値は空である必要があります(距離フィルターなし)。

編集:@FodderZoneのコメントを参照

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

3
DesignerAnalyst

特に、距離をあまり正確に設定する必要がない場合は、値が段階的に変化するスライダーがモバイルデバイスでも適切に機能するはずです。端点は最小距離にすることができ、最大値はどこにでも置くことができます。

2
Michael Lai