web-dev-qa-db-ja.com

マップ上の同じ場所にある複数のピンをどのように表すことができますか?

ユーザーがコンテンツを地図に投稿できるようにする非常に小さなアプリを作成しています。

アプリのホーム画面には、すべての投稿の地図が含まれています(以下を参照)。

[〜#〜]問題[〜#〜]

01-ユーザーが同じエリアから投稿を投稿すると、2つのピンが重なり合って、そのうちの1つにアクセスできなくなります

02-多くのコンテンツが投稿されている場合、各ピンをクリックするのは難しいでしょう

03-ズームアウトすると、ピンが多すぎます

誰か他のことを試すことをお勧めできますか?

enter image description here

5
oo7

「マップでクラスタリングを正しく行うにはどうすればよいですか」は、マッピングアプリケーションでよくある質問です。

短い答え:クラスタリングは機能しません。クラスタリングは優れたUXではないため、優れたクラスタリングUXなどはありません。

理由は簡単です:ユーザーはエリアに興味があるか、ポイントです。彼はエリアの密度(人口、徒歩5分以内のアイスクリームショップの数など)に興味があるかもしれませんが、ポイントには密度

2つのポイントの「平均」はどちらでもありません。時々これは意味があります(ストーンヘンジの石の平均は記念碑を表すかもしれません)が、 ほとんどの場合、意味がありません。

これはおそらく、Googleマップ、Nokiaマップ、またはその他の大規模マッププロバイダーのどちらも、マップにクラスタリングがない理由を説明しています。注:それらのほとんどは概念段階でそれを持っていました、それが落とされたとき、GoogleマップはA/Bテスト段階にさえ達しました。

もちろん、すべてのUXの経験則と同様に、例外があります。これまでのところ、プロパティ広告のみを見てきました。特定のエリアで販売されている物件の数は、私が見たものは、クラスター化のための地区と近隣地域の概念を持っていましたが、それは意味のある情報です。 (それは http://otthonterkep.hu/ です)

ソリューションもこれに接続されています:エリアまたは関心のあるポイントがあるかどうかを決める必要があります。もちろん、「上」からのポイントとなる可能性があるのは、たとえば都市のように、よく見るとエリアである可能性があります。

エリアは密度を持つことができ、次に密度カラーリングを行うことができますエリア。何らかの理由で地理的領域を定義していない場合は、ヒートマップ、またはセルベースの密度情報(基本的には人工的な領域)を使用できます。

クラスタリングは、本質的にはポイントとして示される密度情報です。ここでも意味はありません。

可能な場合は地域に基づいて密度を表示し、常にビューの下の質問をマップの下のリストとして表示し、個別に安全にタップできるように十分にズームインしたときにのみ個々の質問を表示します

リージョンがない場合に備えて、ヒートマップを検討するとします。

私のマップ製品の1つは、レストランの最大熱を任意のポイントとして定義しました。そこから、少なくとも20軒のレストランが徒歩5分以内にあります。中火は10レストランで、熱はありませんでした。少なくとも2つのレストランが利用できないすべての場所に対して定義された-熱は選択と豊富さに関するものであったので、単一の立構造は「熱」を引き起こさなかった。

これはズームレベルにとらわれないものでした。ヒートマッププロバイダーが行う一般的な間違いは、メーターではなくピクセル単位で測定するため、マップは各ズームレベルで異なるストーリーを示します。

ズームインすると、最高の10%基準(正確には、評価の指数曲線の首を超えた場所)を満たす場所が大きなアイコンでハイライト表示され、残りは小さな点で表示されます-「レストラン」の検索でもGoogleマップのように機能する場合。

それがあなたの質問に答えてくれることを願っています。

作者は地図中心の会社で働いており、2つの地図ベースのスタートアップを持っていて、Wordの最大の地図プロバ​​イダーの1つで、地図デザイン部門のUXデザイナー/プロトタイパーとして働いていました。

4
Aadaam

アイコンを使用して、すでに2次元の情報を伝達しています。

  • 高評価の数
  • アイコンの種類(質問、投稿)

3番目のディメンション(アイコンごとに複数の投稿)を追加します。次の理由により、これを行うのは困難です。

  • アイコンが2次元を超える情報を伝達することはお勧めできません。
  • 複数のアイコンの投稿/質問の数を集計する方法が必要になります。

これが1つの可能性です。

enter image description here

  • 使用 +記号は、マルチアイコンに含まれるいいねのある種の集約を示します(たとえば、 modal いいねの数、またはいいねの総数を選択します)。
  • マルチアイコンをタップすると、その場所に投稿/質問があるモーダルパネルが表示され、ユーザーは表示したいものを選択できます。

これを実装するのは本当に難しいでしょう

Googleマップ、Yelp、Hotels.com、その他多くの地域では、地理的クラスタリングのアルゴリズムが容易ではないため、ここではうまく機能していません。

  • たとえば、直線に10点あるとします。
  • それらを5の2グループ、3または4の3グループ、または2の5グループにグループ化しますか?
  • マルチポインターの場所はどこで決定しますか?ユーザーが地図をズームインまたはズームアウトするときに、これをリアルタイムでどのように実行しますか?

まともなズーム可能なクラスタリングの作成に成功した場合は、誰かがそのアルゴリズムのためだけにあなたの会社を購入する可能性があるため、結果を示すためにメモを残してください!!

1
tohster

これはマップの一般的な問題です。 MarkerClusteringと呼ばれるソリューションがあります。あなたはそれについてウェブでもっと読むことができます。ここにいくつかの出発点があります: https://developers.google.com/maps/articles/toomanymarkers

そして、ここにその実装の例があります: http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.388.html

MarkerCluster example

1
Wousser